1. 前言

本文的登录案例源文件已上传到Github，有兴趣的同学可以下载来看看： https://github.com/ylw-github/Axure-Demo

前面写过Axure相关的文章，有兴趣的同学可以参阅：

• 《Mac 下Axure RP9下载与安装》
• 《Axure快速入门教程》
• 《Axure快速入门（01） - 面板介绍》
• 《Axure快速入门（02） - 入门例子（登录案例）》
• 《Axure快速入门（03） - 丰富的元件库》
• 《Axure快速入门（04） - 元件位置调整》
• 《Axure快速入门（05） - Master母版减少重复操作》
• 《Axure快速入门（06） -动态面板例子》
• 《Axure快速入门（07） -选项组例子》

很多时候，我们在画原型的时候，特别是高保真原型的时候，会精确到像素，Axure有没有辅助的工具呢？本文来讲解Axure原型的网格和参考线。

2. 参考线

2.1 指定像素移动元件

有时候我们拖动空间进入页面编辑区域时，都是一个一个像素来拖动的，如下图：

其实可以以一定像素来移动的，比如10个像素，选择菜单栏"视图"->“标尺.网格.辅助线”->“网格式设置”：

勾选Snap to Grid，同时也可以调整移动像素的大小，这里使用默认的10像素：

移动控件，可以看到像素每次都是以10像素移动：

向左移动

继续向左移动

2.2 参考线

直接拖动标尺，即可拉出参考线，如下图：

2.3 网格参考线

同时也可以创建网格参考线，如下操作（视图->标尺·网格·辅助线->创建辅助线）：

选择预设值，确认：

可以看到创建网格参考线：

同时也是可以删除网格参考线的，如下操作（…->删除全部辅助线）：

本文完！