一、初识Axure
由Axure打开的文件,后缀名必须保存为 .rp。
了解状态栏、工具栏各功能作用。
区分兄弟元件与父子元件。
并排的元件为兄弟元件,嵌套元件为父子元件。
二、关于flow流程图
可以进行流程图的绘制,并且没有水印,可以直接导出图片使用。
三、from表单
1、使用Default元件编辑基本组件,组件编辑完成后,成功实现下拉列表与单选按钮的互斥,全部设置完毕后,选中所有组件创建组合。并为此组合命名。
(1) 下拉列表:双击下拉列表弹出对话框
可在添加处手动添加选项,也可以在编辑多项中添加选项。
(2)单选按钮互斥:同时选中两个单选按钮,然后按图中方法设置可实现单选按钮互斥。
2、为求美观,可以设置表单的显示与隐藏。
(1)为表单设置默认隐藏。
单击组件外网格区域,选择“新建交互”-->"页面载入时“-->”显示/隐藏“,选中刚刚的表格组合,
此界面中选择”隐藏“,点击确定。这是打开预览,可以看到界面上已经没有了表格。
(2)使用按钮控制表格的显示与隐藏
从Default元件库中拖出两个主要按钮放在表格正下方,编辑按钮文本为“显示”和“隐藏”。
然后单击按钮,新建交互选择“单击时”-->“显示/隐藏”
然后在此界面选择“显示”,动画为弹出方式可以按自己的喜好设置。同样另一个隐藏按钮也这样设置。
3.关于母版
母版是可以多个页面使用的公共元件,可以自己新建母版,在已有原件上右击然后选择“转换为母版”,弹出对话框新建母版名称,之后在母版界面就会出现刚刚新建的母版。可以再不同页面直接拖动使用。
示例:xxxx系统
(1)在页面区域新建文件夹,再新建三个页面,之后选中三个页面可以拖动到文件夹中,在元件库中找到一个导航栏,将不需要的组件删除。注意:导航栏最好放在(0,0)顶格。
更改导航名和页面名为“首页”、“关于”和“wo”。选中“首页”,新建交互选择“单击时”-->“打开链接”选择连接到首页,这样就可以在预览时点击首页按钮弹出首页页面。同时“关于”和“wo"也使用同样的方法链接不同页面。注意:连接时选项可以连接到网站,比如新浪。
(2)可以在不同的页面加入不同的图标或文字用以区分。
(3)可以在首页设置一个弹窗,将不需要的组件删除,更改弹窗内信息为“欢迎来到xxxx系统!”
选中该弹窗在右上角样式界面有一个小眼睛,点击默认隐藏。点击组件外网格区域,新建交互-->页面加载时-->显示/隐藏-->选择显示,下面的动画和时间按个人喜好设置。在更多选项中,选择弹出效果可以使弹窗弹出后自动关闭。
4、自适应
根据窗口的分辨率调整页面样式,一般用于phone,pad,pc的自适应。
选择该选项,在弹出的对话框中设置名称和宽度,
注意:三个预设要全部基于“基本”选项之下设置!
确定后一定要将影响所有视图取消勾选!
最后分别给三个预设构造不同的页面样式。
5、自定义菜单
设置多个菜单互斥效果,并且选中某个菜单时菜单样式发生变化。
设置一个初始样式
选择该选项然后选择“更多样式选项”,在弹出的对话框中,选择“选中”选项卡,在里面设置不同的填充样式和字体颜色,选中元件,新建交互-->单击时-->设置选中将目标改为“当前元件”(注意!!一定要选择当前元件)然后点击确定。但此时做完虽然可以做到选中菜单改变样式,但是并不互斥并且只能选中不能回退。这时我们复制出多个同样菜单,选中全部菜单在交互界面右上角的三个点中
为选项组命名,勾选“选中”,这样就可以实现各菜单之间互斥。
6、折叠菜单
将所需要的元件拖出来,设置二级菜单初始为隐藏,点击组件外网格区域,新建交互-->页面载入时-->显示/隐藏,在对话框选择隐藏。然后点击按钮,新建交互-->单击时-->显示/隐藏,在对话框选择切换,下面显示动画和隐藏动画为向下滑动和向上滑动,其余可自行改变。
今天是学习前端Axure的第一天,也是把今天所学到的只是示例等等全部记下来,有便于加深记忆和日后复习。今天的学习总体来说不是很难理解, 但是这样总结下来也是很麻烦,而且这其中也可能会有一些错误,将来找到会及时改正。