Axure教程|移动应用原型库的底部
浏览:55 时间:2024-4-1

这一点适合所有人分享:在Axure软件中,如何制作APP原型的底部。

完成后,您可以直接修改转发器列表中的文本以获得所需的帧;也可以直接在转发器列表中设置指向框选项的链接。可以实现四种类型的子弹盒:标题子弹盒,无标题子弹盒,单选子弹盒和多选项子弹盒。明亮的原型主要集中在:APP原型动力学库,APP原型组件库,Axure原型动力学库,Axure原型组件库,高保真原型设计。

原型屏尺寸:375 * 667px(iphone6/iphone6s/iphone7)

首先,底部子弹盒的想法和步骤

1.在Axure中,拖动动态面板(名称:Box2,大小:375,667),以下称为Box2,默认隐藏;

2.在Box2中,设置透明度为40%的黑色背景(名称:Background_Box2,大小:375,667),默认情况下隐藏;

3.在Box2中,拖动动态面板,以下称为底部子弹框(名称:Main_Box2,大小:375,高度自动调整为内容大小),默认隐藏;

4.在Axure中,拖动按钮(或热区),以下称为按钮,根据情况编辑名称和大小;

5.单击项目符号按钮时,设置事件:

移动Box2到达(坐标:0,0)。设置完成后,动态面板可以放在页面的任何位置,而不会模糊其他组件的编辑,

显示Box2,动画:无,放置在顶层,事件必须在以下2个事件的前面;

显示黑色背景,动画:渐渐地,时间:500毫秒;

显示底部框架,动画:向上滑动,时间:500毫秒;

6.单击黑色背景时设置事件:

隐藏底部框架,动画:向下滑动;

隐藏黑色背景,动画:渐渐地;

等待500毫秒,500毫秒是动画的默认播放时间;

隐藏Box2,动画:无,该事件必须在上述3个事件之后,因为您必须等待动画完成播放然后隐藏。

7.双击以进入底部框架,编辑子弹框选项并取消按钮。根据情况编辑选项和文本内容的数量;

8.单击选项时设置事件:

当您单击该选项时,如果您不需要跳转到其他页面,它将触发“< ;;黑色背景点击事件“,因为事件与事件一致”通过点击黑色背景“;

单击该选项时,如果需要跳转到另一个页面,请在单击时设置链接跳转。

9.单击“取消”按钮时,设置事件:

单击“取消”按钮时,可以直接触发“黑色背景单击事件”,因为当您单击黑色背景时,事件与“事件”一致。

第二,高级高级:使用中继器和全局变量来实现免费编辑和增加或减少子弹盒选项

1.单击按钮时设置全局变量[box_id]的值,并在加载转发器时触发事件> ;;

2.加载转发器时,设置添加过滤器事件:“Item.box_id”中列的值等于全局变量的值< ;; box_id” [[Item.box_id==box_id]] ;

3,第一行是圆角,中间是直角,最后一行是圆角,如果第一行是标题,高度和字体样式都不同于其他行,如果只有一行,则在下面圆润共有5种款式。您需要使用动态面板制作5种不同的样式。然后使用转发器的函数和字段来判断每行调用哪种样式。您需要在此处设置的事件的屏幕截图如下(如果有更好的方法),请添加q组235415403通信):

三,下拉刷新思路分析

1.在Axure中设置2个动态面板:下拉刷新动态面板(高度:65px,以下简称“刷新面板”),内容动态面板(高度调整为内容大小,以下简称“内容面板”) ;

2.刷新面板的初始坐标(0,0),内容面板的初始坐标(0,65);

3.垂直拖动内容面板时,将刷新面板的底部移动到内容面板的头部,并将提示设置为:“向下刷新”;

4.当内容面板的y坐标大于或等于130时,刷新面板会更改提示:“让我们刷新” 

5.在拖动结束时,如果内容面板头的y坐标大于或等于130,则将刷新面板移动到(0,65),将内容面板移动到(0,130),然后更改刷新面板提示:“刷新”…”,并在此坐标处等待1000毫秒,最后将两个面板移回原始位置;

6.在拖动结束时,如果内容面板的头部的y坐标大于65且小于130,则两个面板移回到初始位置。

作者:bright,公共号码:闪亮的原型

本文最初由@亮亮发表。未经许可,禁止复制

该地图来自unsplash,基于CC0协议