.

14.状态组组件:补间动画/样式属性效果

老赵发表于:2016年08月17日 12:10:35更新于:2021年10月22日 15:15:42

00160f671a5c71208be24708618dbd2

点击播放腾讯视频教程

百度网盘下载



一、案例效果

0015ca1e49f686523646f61c6b29994

《Epub360 状态组演示案例》


二、应用场景

在Epub360中,组件有自己的尺寸、位置、边框底色样式等,这些样式属性的组合,我们称之为一个“状态”。

1.以七巧板动画为例,七个图片的不同位置组合,就构成了不同的状态。

00157b3e4c2de206b195b30a3df4040


2.组件的尺寸、边框、圆角及底色样式组合,也可以构成不同的状态。

00157b3e4d4b84b721a811606ff62e9


三、素材准备

文末附件下载素材,非商用,仅供学习使用。


四、组件用法

基本用法

1.点击状态组组件,将其添加到页面。

00157b3e56e0c70d1516b668ee80555


2. 添加图片、文字等素材到桌面。选中“状态组”组件,添加关联一组图片组件、设置状态:

00157b3e4ea3b829df9e88e72082f24


3. 点击橙色+添加多个状态

0015ca1dff2768c77a8a12b68190e5a


4.“进入状态编辑模式”

blob.png


5. 针对每个“状态”,设置组件的尺寸、位置、边框样式等

00157b3e4feaa1ae38e77bc09da200a


6. 设置状态变化执行方式,可以自动执行、也可以触发器触发执行。

blob.png


高级用法

1.如何控制状态组。假设用一个按钮来控制状态组的切换,要结合一个触发行为:切换状态组。

image.png


2.点击按钮设置触发器——点击时——触发行为:切换状态组——选择要切换到哪个状态。

image.png


附件:状态组素材.zip • 2.31MB • 下载

--------- 不了解设计的程序员不是好客服 ---------------

回复(2)