- 今天我们先不急着堆动效，而是把 ArkUI 里常见的动画类型摆在一起看清楚。 动画最容易写乱的地方，不是 API 多，而是还没想清楚“到底是谁在动”：是一个属性在变，还是组件在出现消失，还是页面在切换，或者只是想做一点氛围。这个 Demo 就是一个选型页，帮我们先把边界分开。 这个 Demo 看什么 准备一个 Anim 今天我们先不急着堆动效，而是把 ArkUI 里常见的动画类型摆在一起看清楚。 动画最容易写乱的地方，不是 API 多，而是还没想清楚“到底是谁在动”：是一个属性在变，还是组件在出现消失，还是页面在切换，或者只是想做一点氛围。这个 Demo 就是一个选型页，帮我们先把边界分开。 这个 Demo 看什么 准备一个 Anim
- 今天我们做一个最小拖放 Demo：左边卡片拖起来，右边区域接住它。 拖拽不只是 draggable(true)。用户需要知道什么时候开始拖、什么时候进入目标区域、什么时候放下成功。少了这些反馈，拖拽就会像“东西飘走了”。 参考文档： https://developer.huawei.com/consumer/cn/do 今天我们做一个最小拖放 Demo：左边卡片拖起来，右边区域接住它。 拖拽不只是 draggable(true)。用户需要知道什么时候开始拖、什么时候进入目标区域、什么时候放下成功。少了这些反馈，拖拽就会像“东西飘走了”。 参考文档： https://developer.huawei.com/consumer/cn/do
- 今天我们看手势冲突里最基础的裁决入口。 很多手势问题不是“代码不生效”，而是两个动作都觉得自己应该生效。比如横向拖动卡片、纵向滚动列表、子组件点击，这些意图如果不拆开，用户一滑不动就会很烦。 参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyosguid 今天我们看手势冲突里最基础的裁决入口。 很多手势问题不是“代码不生效”，而是两个动作都觉得自己应该生效。比如横向拖动卡片、纵向滚动列表、子组件点击，这些意图如果不拆开，用户一滑不动就会很烦。 参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyosguid
- 今天我们先看手势怎么绑到组件上：gesture、priorityGesture、parallelGesture。 这三个名字很像，但它们解决的问题不一样。我们这篇只讲绑定方式，不展开父子组件冲突，不做复杂拖拽排序。 参考文档： https://developer.huawei.com/consumer/cn/doc/h 今天我们先看手势怎么绑到组件上：gesture、priorityGesture、parallelGesture。 这三个名字很像，但它们解决的问题不一样。我们这篇只讲绑定方式，不展开父子组件冲突，不做复杂拖拽排序。 参考文档： https://developer.huawei.com/consumer/cn/doc/h
- 今天我们看父容器和子组件都绑定手势时，响应边界怎么判断。 新手写手势很容易把动作绑得到处都是：父容器一个 TapGesture，子卡片也一个 TapGesture。页面能跑，但一旦用户点到重叠区域，你就会开始怀疑到底谁该响应。 参考文档： https://developer.huawei.com/consumer/cn 今天我们看父容器和子组件都绑定手势时，响应边界怎么判断。 新手写手势很容易把动作绑得到处都是：父容器一个 TapGesture，子卡片也一个 TapGesture。页面能跑，但一旦用户点到重叠区域，你就会开始怀疑到底谁该响应。 参考文档： https://developer.huawei.com/consumer/cn
- 今天我们用 GestureGroup 做两个轻量例子：顺序组合和并行组合。 组合手势不是越多越专业。它只是告诉系统：这些手势之间到底是先后关系，还是可以一起参与识别。能用一个手势解决，就不要硬组合。 参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyos 今天我们用 GestureGroup 做两个轻量例子：顺序组合和并行组合。 组合手势不是越多越专业。它只是告诉系统：这些手势之间到底是先后关系，还是可以一起参与识别。能用一个手势解决，就不要硬组合。 参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyos
- 今天我们用 onTouch 做一个常见手势小实验：单指移动、双击缩放、单指旋转、双指旋转和双指捏合缩放。 如果把这些动作全靠多个 Gesture 堆到同一个节点上，新手很容易先被冲突绕进去。所以这一篇我们直接读触点：一个手指看位置变化，两个手指看距离和角度变化。操作对象用本地的 iconhuawei.svg，这样你能很 今天我们用 onTouch 做一个常见手势小实验：单指移动、双击缩放、单指旋转、双指旋转和双指捏合缩放。 如果把这些动作全靠多个 Gesture 堆到同一个节点上，新手很容易先被冲突绕进去。所以这一篇我们直接读触点：一个手指看位置变化，两个手指看距离和角度变化。操作对象用本地的 iconhuawei.svg，这样你能很
- 今天我们只看三个单一手势：TapGesture、LongPressGesture、PanGesture。 手势最怕混着讲。点击、长按、拖动本来就是三种不同意图，先把它们拆开跑通，后面再谈组合和冲突会轻松很多。 参考文档： https://developer.huawei.com/consumer/cn/doc/harm 今天我们只看三个单一手势：TapGesture、LongPressGesture、PanGesture。 手势最怕混着讲。点击、长按、拖动本来就是三种不同意图，先把它们拆开跑通，后面再谈组合和冲突会轻松很多。 参考文档： https://developer.huawei.com/consumer/cn/doc/harm
- 今天我们给三张卡片加上焦点能力。 很多页面只考虑手指点击，结果一接键盘、遥控器或者无障碍操作，页面就不知道该往哪走。焦点处理解决的就是这个问题：谁能获得焦点、焦点顺序是什么、获得焦点后有没有明显边框。 参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyo 今天我们给三张卡片加上焦点能力。 很多页面只考虑手指点击，结果一接键盘、遥控器或者无障碍操作，页面就不知道该往哪走。焦点处理解决的就是这个问题：谁能获得焦点、焦点顺序是什么、获得焦点后有没有明显边框。 参考文档： https://developer.huawei.com/consumer/cn/doc/harmonyo
- 今天我们只看软键盘和输入组件的关系：什么时候弹、弹什么、怎么收。 软键盘很容易被写成一个完整聊天页、表单页或者支付页。那样当然真实，但主题会散。这个 Demo 只保留三个最基础的点：系统键盘、不自动弹键盘、自定义键盘。 系统键盘 最普通的输入框，获取焦点就弹系统键盘： enterKeyType 控制键盘右下角按钮的语义 今天我们只看软键盘和输入组件的关系：什么时候弹、弹什么、怎么收。 软键盘很容易被写成一个完整聊天页、表单页或者支付页。那样当然真实，但主题会散。这个 Demo 只保留三个最基础的点：系统键盘、不自动弹键盘、自定义键盘。 系统键盘 最普通的输入框，获取焦点就弹系统键盘： enterKeyType 控制键盘右下角按钮的语义
- 今天我们做一个输入事件观察页，看 onTouch、onHover、onMouse 和 onKeyEvent 分别适合什么。 同一个页面在手机、平板、2in1 设备上，输入来源可能完全不同。手指更关心触摸动作，鼠标有悬停和按键，键盘还要先处理焦点。我们先用最小 Demo 看清楚它们的差别。 参考文档： https://d 今天我们做一个输入事件观察页，看 onTouch、onHover、onMouse 和 onKeyEvent 分别适合什么。 同一个页面在手机、平板、2in1 设备上，输入来源可能完全不同。手指更关心触摸动作，鼠标有悬停和按键，键盘还要先处理焦点。我们先用最小 Demo 看清楚它们的差别。 参考文档： https://d
- 今天我们先用一个小页面，把 ArkUI 里最基础的交互边界跑一遍：按钮点击、卡片点击、禁用态和点击区域。 交互响应不是“能点就行”。新手最容易犯的错，是把所有动作都塞进 onClick，然后让用户猜哪里能点、点了会发生什么。我们这篇先不碰复杂手势，只把最普通的点击关系摆清楚。 参考文档： https://develop 今天我们先用一个小页面，把 ArkUI 里最基础的交互边界跑一遍：按钮点击、卡片点击、禁用态和点击区域。 交互响应不是“能点就行”。新手最容易犯的错，是把所有动作都塞进 onClick，然后让用户猜哪里能点、点了会发生什么。我们这篇先不碰复杂手势，只把最普通的点击关系摆清楚。 参考文档： https://develop
- 这一篇我们只看 clipShape。它的作用很直接：把一个组件按指定形状裁掉。图片可以裁，文本标签可以裁，卡片也可以裁。 Demo 里有三种常见用法 第一种是圆形裁剪。头像、入口图标、圆形徽章，都可以用 CircleShape。 第二种是圆角矩形。我们用 RectShape 裁图片和标签。它适合那些“只想把边角收一下” 这一篇我们只看 clipShape。它的作用很直接：把一个组件按指定形状裁掉。图片可以裁，文本标签可以裁，卡片也可以裁。 Demo 里有三种常见用法 第一种是圆形裁剪。头像、入口图标、圆形徽章，都可以用 CircleShape。 第二种是圆角矩形。我们用 RectShape 裁图片和标签。它适合那些“只想把边角收一下”
- 这一篇我们看 Path。如果一个图形已经不是圆、线、矩形能舒服表达的样子，就别再用一堆布局硬拼了，直接写路径会更干净。 commands 是重点 Path 的核心是 commands。你可以先记住几个常用字母： M：移动到某个点。 L：连线到某个点。 C：画三次贝塞尔曲线。 Z：闭合当前路径。 Demo 第一块用 M 这一篇我们看 Path。如果一个图形已经不是圆、线、矩形能舒服表达的样子，就别再用一堆布局硬拼了，直接写路径会更干净。 commands 是重点 Path 的核心是 commands。你可以先记住几个常用字母： M：移动到某个点。 L：连线到某个点。 C：画三次贝塞尔曲线。 Z：闭合当前路径。 Demo 第一块用 M
- 这一篇我们把几何图形单独拎出来。Rect、Circle、Ellipse、Line、Polyline、Polygon 都不难，但它们能解决很多“小地方不好看”的问题。 Demo 里先分两类 第一类是基础形状：矩形、圆、椭圆。它们适合做背景块、图标底、状态点。第二类是线和点集：直线、折线、多边形。它们更适合做分隔、走势、徽 这一篇我们把几何图形单独拎出来。Rect、Circle、Ellipse、Line、Polyline、Polygon 都不难，但它们能解决很多“小地方不好看”的问题。 Demo 里先分两类 第一类是基础形状：矩形、圆、椭圆。它们适合做背景块、图标底、状态点。第二类是线和点集：直线、折线、多边形。它们更适合做分隔、走势、徽
上滑加载中
推荐直播
-
华为云码道Agent集成与鸿蒙实战2026/08/11 周二 19:00-21:00
王一男-华为云码道产品规划专家；李炎-华为云码道产品专家；彭江敏-华为云鸿蒙端云一体化开发专家
本次直播带你解读华为云码道7月份产品新特性、新功能。更有专家演示码道Agent Space × 钉钉机器集成实战，从0到1打通消息通道；码道鸿蒙端云一体化实战，快速搭建员工签到系统。
回顾中 -
华为云开发者AI素养直播课·第五期2026/09/04 周五 16:00-18:00
林华鼎-华为云AI开发者运营负责人；蒋春阳-华为云AI开发者案例开发专家
本期直播内容： AI工具体验营 · 第5-8课连讲。Agent-Team 多智能体协作完成毕业设计实践
回顾中 -
华为云开发者AI素养ClassRoom·第六期2026/09/08 周二 19:00-20:00
樊渊-2026华为软件挑战赛冠军
高手来了：看软挑高手解析二维排样问题—从工业难题到算法突破
回顾中
热门标签