一.本节课开始绘制移动App原型,在这个网址中下载iPhone手机外形元件库https://www.inneed.club/resources/detail/9zlway6wjd。
二.将这个元件库导入axure9软件中,然后从这个元件库中找一个iPhone外形图片,学习先使用iPhone 6Sliver图片。
根据这个图片绘制iPhone 6Sliver线框图。我们可以用已经有的线框图,但是在实际工作中会出现各种情况,自己能画是最好的。绘制效果如下图二。
在iPhone 6Sliver图片上放置矩形元件,用矩形元件临摹出图片的线框,其中这三个元件由于
图形不一样,移动到线框图中无法居中,这是从标尺右侧拉出一条辅助线到线框图,然后将这三个元件移动至让辅助线分为两等分即可,然后选中辅助线delete删除。
三.然后将绘制的线框图转换为母版,方便日后复用使元件,且可以统一修改母版中元件。
- 创建母版有两种方法,一种是将创建的部件选中右击转换为母版,一种是新建母版,在母版中添加部件;
- 编辑母版:直接在母版中编辑,或者从任何一个页面双击该母版修改后,其它页面都会有变化;
- 重复运用母版:将母版拖入到需要运用的页面中即可,如果需要在运用母版的页面的中修改母版,这是就需要将此母版的拖放行为进行修改。
- 将iphone母版拖动两个页面中,母版的拖放行为是“任意位置”或“固定位置”,从任何一个页面修改母版时,其它页面都会有变化;如果这时将母版拖放行为改为“脱离母版”,然后拖动放入另一个页面,这时修改母版发现前两个页面中的内容跟着母版修改,但是最后一个母版未被修改。
- 修改母版后之前调用母版的页面也会变化;
- 将iphone母版拖动两个页面中,母版的拖放行为是“任意位置”或“固定位置”,选中母版右击-选择”从页面中移除”,这时系统会弹框自动提示调用当前所选母版的页面,且可以选择页面将母版移除。移除后查看调用母版的页面发现该母版内容不存在。但是如果页面调用母版时,母版的拖放行为是“脱离母版”,选中母版右击-选择”从页面中移除”,这时系统会弹框自动提示调用当前所选母版的页面,且可以选择页面将母版移除。但是移除后查看调用母版的页面可以看到该母版内容存在(因为未与母版关联了)。
将iphone母版拖动两个页面中,母版的拖放行为是“任意位置”或“固定位置”,在删除母版时,则会提示那些页面正在使用的改母版,不能删除;
a、需要先将这些页面中调用的母版去掉,才可将母版删除。
b、将iphone母版拖动两个页面中,母版的拖放行为是“脱离母版”,可以正常删除母版。
注意:若要对某一页面中的母版添加事例,需要将此页面中的母版设置为“脱离母版”。(右击-脱离母版)
也可以将调用页面中的母版右击选择“脱离母版”,这时母版和该页面中母版内容无任何关联了。
母版上有粉色的遮罩,可以将视图遮罩-母版中的对勾去掉,这是遮罩就消失了。
四.在画原型过程中知识点有几点:
- 页面缩放可使用快捷键ctrl+滚动鼠标滚轮或者修改工具栏中百分比。
- 复制的两种方式,复制并平移(按住shift+ctrl+拖动元件)和右击元件复制、ctrl+拖动元件复制。
- 没有选中元件时,方向键是上下左右查看画布;选中元件中,方向键是移动元件。
- 在文件-偏好设置中-可以调整画布、辅助线、母版等。