动态组件


动态组件的作用

动态组件就是为一个组件添加设置多个状态,和页面状态一样可以用来实现页面内的交互动画。可以让页面中一个组件的位置、大小、颜色发生改变,也可以设置显示隐藏。



例如弹窗、底部导航、下拉菜单等都可以用动态组件功能实现。具体视频演示操作请看交互效果案例演示

动态组件的具体操作方法与页面状态类似,可以点击参考页面交互教程进行具体操作。



动态组件和页面状态比较

动态组件和页面状态的动画效果实际上都是用状态实现的。两者的区别在于:

1)页面状态做的动画效果会影响整个页面内的组件,动态组件做的动画效果只会影响动态组件内部的组件。

2)页面状态基于项目页面完成,不太方便保存复用,动态组件与项目页面是分离的,可以保存到组件库中作为组件素材复用。

由于以上两点差异,建议刀友们在做交互动效的时候优先选择用动态组件来实现。



tips: 1.如果在切换页面状态或组件状态时,不想每次重复设置无效果或神奇移动,可在左上角点击偏好设置-默认动效。



2.需要为动态组件设置默认状态时,选中动态组件,在右侧的外观面板即可选择设置。





动态组件连接其它页面

动态组件要连接其它页面,需要在动态组件编辑区内,为相应状态内的元素添加事件跳转至其他页面。





这篇文章帮助到你了吗?