页面交互
页面状态
页面状态设置与添加
设置面板的右边有几个按钮,点击第一个圆形按钮后就可以设置页面状态了。
点击状态面板中的「新建」或「复制」按钮即可新建状态。
其中第一个状态就是页面的默认显示状态,也就是当我们打开一个页面时,页面最开始呈现的样子(状态)。
可以通过鼠标拖拽调整页面状态顺序。
页面状态的作用
页面状态可以用来实现页面内整体的交互动画。举个例子:
使用页面状态切换,我们可以让页面中一个图片(组件)的位置、大小、颜色发生改变。
页面状态切换和页面切换的区别
上图的状态切换会有组件平滑移动的效果,我们可以称之为智能动画。页面切换则没有这种平滑移动的效果,会是生硬的切换,就像这样:
如何实现页面状态切换
在一个页面状态中,为该页面全局或组件添加跳转交互,就能实现页面状态的切换。
1.选中页面的状态1,在右侧面板选择「全局事件」,设置行为“切换页面状态”,选择需要切换的状态即可。这样在运行时点击页面全局的任何一个位置都可以实现切换。
2.选中页面状态1中的任何一个组件,拖动左侧闪电图标到目标状态,或是在右侧选择「添加事件」进行设置。这样在运行时点击这个组件就能实现切换。
网页跳转/插入外部链接
使用交互事件中的超链接功能即可实现网页跳转效果。
1、选中任意元素,添加事件,选择跳转超链接
2、选择跳转到当前页面或者新开窗口,输入允许跳转的http/https协议的地址
定时跳转
选中画布后,在链接设置面板中可以为页面或状态设置定时跳转的效果。
这篇文章帮助到你了吗?