前言
在APP端中左右滑动的交互方式十分常见,在有限的区间内可以放置更多的内容。
![请添加图片描述](https://i-blog.csdnimg.cn/blog_migrate/2d78d1debe878c33b5929819c8863bf9.gif)
准备
- Axure 9(或Axure 8、10)软件已安装。
- 掌握基本的软件使用。
本教程知识点
-
初级的动态面板使用。
-
拖动触发的移动的交互事件。
-
移动边界计算。
详细教程
功能
- 鼠标右击可以将组件内容进行左右拖动。
- 组件内容左右拖动有对应的边界限制。
制作方式
1、基础动态面板版本
![请添加图片描述](https://i-blog.csdnimg.cn/blog_migrate/6c5fad3d9471c4715c87f1332f4019e4.gif)
- 基础样式可以将展示内容嵌套在动态面板中,利用动态面板的水平滚动进行功能实现。
![请添加图片描述](https://i-blog.csdnimg.cn/blog_migrate/30db3c3818c7663a203d2bfa3970dc93.png)
-
- 制作时,需将动态面板的尺寸调整页面宽度,超出内容将自动隐藏。同时在预览和编辑时可以看到水平滚动条。