产品经理必会工具Axure元件之样式

内容摘要:元件样式分为九大功能,分别为元件名称、元件位置/尺寸….,本文将对这九大功能一次展开进行讲解。
我文章中提到的我汇总的文件,内容实在太多。关注公众号:人人都是产品学徒    ,里面可以免费领取

元件名称

元件名称通常为英文名称,采用驼峰式的编写方式。

编写规则为 元件用途+元件类型+元件序号。

例如:UsernameInput01 表示的含义为 序号为01的用户名输入框。

建议大家都写上名称,就像是给代码打上注释一样,方便大家以后再设置交互的时候可以快速找到该元件。


元件位置/尺寸

元件的位置为元件的左上角相对于画布左上角的位置的距离。

X表示横坐标的距离

Y表示纵坐标的距离

W表示元件的宽度

H表示元件的高度

当我们选择蓝色的小锁头的时候,高度和宽度的变化会随着比例的变化而变化。

可以通过修改旋转的数值来修改元件的旋转的角度(旋转角度为顺时针旋转),当然,我们也可以通过ctrl+左键,点击元件节点进行旋转。


通过修改小眼睛的状态来进行是否可见,默认情况下元件隐藏后会在编辑区县市淡黄色阴影。


元件样式

将元件拖入画布后,默认会给一个元件样式,默认的样式为该元件的样式,也可以通过修改样式来完成样式的修改,例如我需要元件的外形为矩形,但是它有一级标题的属性,则可以通过修改来实现。


通过修改透明性来修改元件内部的透明性,默认为100%显示,当透明性为0%时为元件不显示。



元件排版

元件排版是对元件内部输入的文字进行排版,类似于word中的排版工具,特别要注意的是axure中 提供了阴影工具,可以通过阴影来实现立体的效果。


元件填充

Axure支持元件的填充,填充包括颜色填充和图片填充。


颜色填充包括:

单色填充:应用场景为纯色的banner

线性填充:应用场景为渐变色

径向填充:应用场景为以某一点为扩展的渐变色

通过RGB来调节填充色,类似于画图工具


图片填充支持重复、不重复、填充等多种形式。


元件阴影

元件阴影分为内部阴影和外部阴影,通过调节阴影与元件之间的位置来显示出不同的状态。通过调节阴影的模糊状态调整阴影的效果。

多用于立体效果的呈现。


元件线段

元件的线段支持多种不同种类的线段,通过修改类型来调整实线、虚线等。

通过修改线宽和颜色可以制作出相框效果。


矩形的边框可以在样式中设置显示全部或部分。


元件圆角

可以通过拖动元件左上方的圆点图标进行调整,也可以在元件样式中设置圆角半径来实现


也可以通过调整一个角是否可见来控制圆角的变化形式。


元件边距

元件边距是指元件中的文字到形状边缘的距离,通过填充空隙来实现。

#产品#
全部评论
自己顶一下
点赞 回复
分享
发布于 2021-02-01 21:49
不错  干货   赞一个
点赞 回复
分享
发布于 2021-02-02 09:54
博乐游戏
校招火热招聘中
官网直投
顶一下
点赞 回复
分享
发布于 2021-02-03 22:34
点赞 回复
分享
发布于 2021-02-19 15:55

相关推荐

1. 自我介绍,说说实习项目,你主要参与了什么部分、功能2. protobuf协议了解过吗3. 粘包拆包问题如何处理?4. XXL-JOB做什么?(定时任务xxx)不借助第三方框架,用纯java原始的东西做定时怎么做?5. Timer、TimeTask了解过吗?6. 平时开发中遇到的一些异常有哪些?7. 假如用String强转int会怎么样?这个String可能不是数字。8. 这个异常是运行期知道的还是编译期知道的?9. Java常用集合类有哪些?10. HashMap了解多少?11. 说说线程池底层、关键的东西12. 你看源代码主要关注点是什么?主要收获是什么?13. Java锁了解吗?你怎么理解悲观锁和乐观锁?14. synchronize原理,锁静态方法、实例方法、代码块有什么区别?15. 类classA有个synchronize修饰的静态方法f,创建两个classA的实例a1和a2,分别调用a1.f和a2.f,这两个锁是互斥的吗?如果f是实例方法呢?16. Java内存模型17. Java值传递和引用传递你是怎么理解的?18. 类A有个方法f,传递参数为Node node,在方法内node = new Node();,这里会影响到外面的node吗?如果在方法内修改node的参数,他会影响到外面的node吗19. ConcurrentHashMap和Hashtable20. (两个月培训)假如你发现你的进度,可能会发现和别人差距比较大,或者有一些课程的落后。在这种高压环境下面的这种情况,你一般会怎么应对这种情况?21. 你对游戏感兴趣吗?22. 反问30min,进去会学一门语言,Kotlin已约二面
点赞 评论 收藏
转发
1 6 评论
分享
牛客网
牛客企业服务