您当前的位置: 首页 > 

杨林伟

暂无认证

  • 3浏览

    0关注

    3337博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

Axure快速入门(08) -网格和参考线

杨林伟 发布时间:2021-01-11 10:41:02 ,浏览量:3

文章目录
    • 1. 前言
    • 2. 参考线
      • 2.1 指定像素移动元件
      • 2.2 参考线
      • 2.3 网格参考线

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 网格参考线

同时也可以创建网格参考线,如下操作(视图->标尺·网格·辅助线->创建辅助线): 在这里插入图片描述 选择预设值,确认: 在这里插入图片描述 可以看到创建网格参考线: 在这里插入图片描述 同时也是可以删除网格参考线的,如下操作(…->删除全部辅助线): 在这里插入图片描述 本文完!

关注
打赏
1662376985
查看更多评论
立即登录/注册

微信扫码登录

0.1031s