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

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

1. 前言

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

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

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

2. 参考线

2.1 指定像素移动元件

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

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

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

移动控件,可以看到像素每次都是以10像素移动:

向左移动 继续向左移动

2.2 参考线

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

2.3 网格参考线

同时也可以创建网格参考线,如下操作(视图->标尺·网格·辅助线->创建辅助线):

选择预设值,确认:

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

同时也是可以删除网格参考线的,如下操作(…->删除全部辅助线):

本文完!

目录
相关文章
|
4月前
|
C# 开发者 数据处理
WPF开发者必备秘籍:深度解析数据网格最佳实践,轻松玩转数据展示与编辑大揭秘!
【8月更文挑战第31天】数据网格控件是WPF应用程序中展示和编辑数据的关键组件,提供排序、筛选等功能,显著提升用户体验。本文探讨WPF中数据网格的最佳实践,通过DevExpress DataGrid示例介绍其集成方法,包括添加引用、定义数据模型及XAML配置。通过遵循数据绑定、性能优化、自定义列等最佳实践,可大幅提升数据处理效率和用户体验。
70 0
|
7月前
|
Java 测试技术 项目管理
产品入门第三讲:Axure产品流程图绘制
产品入门第三讲:Axure产品流程图绘制
165 0
产品入门第三讲:Axure产品流程图绘制
Axure快速入门(04) - 元件位置调整
Axure快速入门(04) - 元件位置调整
100 0
Axure快速入门(01) - 面板介绍
Axure快速入门(01) - 面板介绍
81 0
|
搜索推荐 定位技术
SWMM从入门到实践教程 02 快速入门案例的绘制
SWMM从入门到实践教程 02 快速入门案例的绘制
|
前端开发 定位技术
地图开发实战案例:高德地图的标注、信息窗口的实战实例
地图开发实战案例:高德地图的标注、信息窗口的实战实例
181 0
|
前端开发
Echarts实战案例代码(49):基于不支持立体漏斗图Funnel的HTML+CSS解决方案
Echarts实战案例代码(49):基于不支持立体漏斗图Funnel的HTML+CSS解决方案
197 0
|
存储 开发工具
游戏开发实战教程(3):绘制网格
如图,蓝色线框中间的区域为游戏最终能够显示的区域,如果一个物体位于蓝色的线框外,那么最终在游戏界面中是不会显示的。红色的坐标轴,水平方向为x轴,竖直方向为y轴,中心点(0,0)位于显示区域的正中央。图中的白色的正方形线框的位置就是(0,0),即位于屏幕的正中央。以后,当你遇到一个物体位置为(500,500)时,你就应该知道它大概位于屏幕的右上方。
143 0
|
容器
游戏开发实战教程(6):把图形放置到网格上
在第四节中我们实现了图形的拖拽功能,拖拽的图形最终需要被放置在网格的对应位置上。 先说一下实现思路: 使用拖拽图形上的左下角的位置作为图形位置,与整个网格的位置进行比对。如果图形位置与当前单元格的位置匹配,则根据图形的数据从当前的单元格开始填充,直到填充完整个图形为止。 看不懂?没关系。接着往下我会一步一步的进行拆解和分析。
100 0
|
容器
微信小游戏开发实战6-把图形放置到网格上
本篇主要内容包括如何将拖拽的图形安放到网格的对应位置上。 如果你没有任何的游戏开发经验,欢迎阅读我的“人人都能做游戏”系列教程,它会手把手的教你做出自己的第一个小游戏。
85 0