网格,辅助线和对齐 | The Grid, Guides, and Snapping

Axure RP的画布包含了许多可以帮助你排布图稿的功能。你可以显示和自定义背景网格以及垂直和水平的参考线,这些参考线可以用于指定页面,也可以用于项目中的所有页面。你可以只将它们当做视觉上的参考,也可以使你的元件自动和它们对齐。

注意:网格和辅助线只在Axure RP中可见,当你在Web浏览器中预览原型的时候,它们是不显示的。

1.     网格

进入顶部菜单中的“视图-标尺,网格,辅助线”,然后选择“显示网格”即可在画布上显示网格,网格有两种显示方式:点或线段。

无论网格是否显示,当你通过拖拽来移动元件或改变原价大小时,元件都会自动对齐到网格。你可以进入到“视图-标尺,网格,辅助线”,然后取消“网格对齐”的选择,即可禁用这种行为。

默认情况下,网格是10×10像素大小,并且以点的形式显示。如果需要,你可以进入到“视图-标尺,网格,辅助线”,选择“网格设置”来自定义网格大小,并且可以切换成以线段的形式显示,以及改变网格的颜色。

2.     辅助线

辅助线和添加在画布上的线条,有助于标记元件需要放置的位置,你可以在“视图-标尺,网格,辅助线”下来切换各种辅助线的可见性。

2.1.   页面辅助线和全局辅助线

页面辅助线只在项目中的单个页面或母版中显示,想要在画布上添加页面辅助线,在标尺上点击并拖动,然后将辅助线放在所需的X轴或Y轴的位置即可,页面辅助线默认为蓝绿色。

全局辅助线和页面辅助线类似,但是全局辅助线会一直显示在画布上,无论你当前正在哪个页面或母版上操作。创建全局辅助线,在标尺上点击并拖动时,按住CTRL或CMD键,全局辅助线默认为洋红色。

删除页面辅助线和全局辅助线

要想删除一条页面辅助线或全局辅助线,右键点击它,然后选择“删除”。或者,你也可以选择一条辅助线或一组辅助线,然后使用键盘上的DELETE键删除。

想要一次性删除画布上的所有辅助线,可以使用“视图-标尺,网格,辅助线-删除全部辅助线”功能。

注意:在一个页面删除了全局辅助线后,项目中的其他页面中的全局辅助线也同样会被删除。

创建辅助线

你可以一次性创建一组页面辅助线或全局辅助线。通过“视图-标尺,网格,辅助线-创建辅助线”功能打开对话框,你可以自定义每个字段的值,或者从对话框顶部的下拉列表中选择,下拉列表提供了如下四个选项:

      960 Grid: 12 Column

960 Grid: 16 Column

1200 Grid: 12 Column

1200 Grid: 15 Column

锁定辅助线

你可以锁定页面辅助线或全局辅助线,以防止它们被移动或删除。想要锁定一条或多条辅助线,选中它们,然后点击鼠标右键,选择“锁定”。你也可以一次性锁定项目中的所有辅助线,点击“视图-标尺,网格,辅助线-锁定辅助线”即可。

2.2.   页面尺寸辅助线

页面尺寸辅助线显示了你定义的特定尺寸的页面的边界。页面的顶部、左侧和右侧边界以外的区域在画布中显示为灰色,底部边界则由红褐色的曲线标记。

如果你在页面上使用自适应视图,页面尺寸辅助线也会随着你的视图切换而自动更新。

2.3.   打印辅助线

打印辅助线显示了当前所选打印纸张的页面边界,打印纸张的尺寸可以在“文件-纸张尺寸与设置”中设置。当你更改打印纸张的尺寸时,打印辅助线也会自动更新。默认情况下,打印辅助线显示为灰色。

2.4.   对齐辅助线

当你在画布上拖动一个元件,或通过拖拽更改元件尺寸时,元件将自动对齐到邻近的辅助线。如果你想禁用这种行为,取消“视图-标尺,网格,辅助线”“对齐辅助线”的勾选即可。

2.5.   底层显示辅助线

默认情况下,辅助线是显示在元件上层的,这就使得辅助线在画布上任何时候都可见。如果你想让辅助线在元件下层显示,点击“视图-标识,网格,辅助线”,然后选择“辅助线设置”,在弹出的退画框中选择“底层显示辅助线”即可。

3.     标尺

你可以通过勾选或取消勾选“视图-标尺,网格,辅助线”下的“显示标尺”,来切换画布顶部和左侧的标尺的可见性。

4.     元件对齐

当你在画布上拖动元件或通过拖拽调整元件尺寸时,其边缘或中心点会自动对齐到附近元件的边缘和中心点。当出现这种情况时,将自动显示红色辅助线,以显示元件将要对齐的对象以及相对距离(以像素为单位)。

你可以在“视图-标尺,网格,辅助线-元件对齐设置”功能对话框中,更改元件对齐的辅助线颜色,以及边缘对齐的像素距离(例如,与附近的元件距离25像素时对齐)。

如果要禁用此行为,可在“视图-标尺,网格,辅助线”下取消“元件对齐”的勾选。

评论(0 个评论)

发表回复

您的电子邮箱地址不会被公开。