Working with Page Properties
在本章当中,学习使用页面样式,在原型当中增加背景或居中页面,应用素描效果和新建参考线。
视频:下载MP4格式
Page Formatting
Page Formatting 允许你编辑个人Pages的格式。同时,也可以选择应用默认的page样式或者自定义的page样式。Page Formatting设置选项在Page Properties 面板的第三个选项卡里面。
Format Page Properties
页面设置有以下属性
- Page Style:如widgets,你可以定义页面的样式。点击右边的图标(或者 Wireframe-> 主菜单里面的 Page Style Editor ),可以编辑默认样式或者新建自定义样式。如果你想在你默认的原型中居中你的每一个页面并设置默认的背景图片,编辑Default Page样式的设置并应用到page中。
- Page Align:将原型在页面当中靠左或居中布局。这只会应用到HTML中,所以 在Axure RP的wireframe中看不到这种变化。居中依赖于widget在页面当中并且假设widget的左边不在“x=0”的位置。你可以设置page的左边据为100px,但是页面依然会在浏览器中居中显示,这是由于widget居左还是居右造成的。
- Back Color:设置Page的背景色
- Back Image:设置Page的背景图片,可以选择是否平铺图片。
- Horiz Align and Vert Align:设置背景图片水平和垂直方向的位置。
- Repeat:设置背景图片的平铺方向,垂直,水平,或者垂直和水平。
Sketch Effects
Sketch Effects能快速将项目的线条拥有数偶会效果。这样可以帮助人们将注意力集中到结构,联系和功能当中,如果你需要的话。
Sketch Effects功能是属于Page Formatting的一部分(所以你可以将其设置在页面样式当中),它拥有以下选项:
- Sketchiness:随着Sketchiness的增加,widgets会变得越来越波浪形。我们习惯性将其设置在50附近。
- Color:改变整个项目的灰度,包括图片,填充色,背景和字体颜色。
- Font:统一页面中所有widget的字体。可以选择使用手写字体,譬如Axure Handwriting,Scoder Hand,Lucida Handwriting或者Bradley hand ITC。
- Line Width:增加widget 边框的宽度以至于看上去更像手写。我们习惯性使用“+1”。
Global and Page Guides
Guides/参考线 在保持布局的一致性或widget对齐上面有极大帮助。你可以在个人页面和全局页面当中新建参考线。全局页面当中的参考系在其他页面上都起作用。
Add guides
在wireframe的水平或垂直标尺当中拖动,就可以在当前Page新建参考线。绿色线是被当前选中的线。释放鼠标线条颜色会变成蓝色。
按住“Cmd键”(如果是mac)或“Ctrl键”(如果是PC),在标尺当中拖动线条就会创建应用在所有页面当中的全局参考线。在全局的参考线是粉红色的。
右键wireframe,在菜单当中选择Grid and Guides,可以选择隐藏或者锁定参考线。
在菜单当中选择“Wireframe-> Gridd and Cuides-> Create Guides”或者右键Wireframe Grid并选择内容菜单,会弹出“Create Guides”对话框。
有两个网格设置供选择:960 Grid 12 Column和 960 Grid 16 Column。或者选择自己定义特殊的网格。如果你想参考线出现在所有页面中,选中选项框“Create as Global Guides“。
你可以在这里学习更更多关于”960 Grid System“的内容。