Axure9 使用及开发细节

一、下载和配置Axure9

1.首先需要下载Axue9

2.然后通过淘宝几块钱购买一个账号

3.通过账号密码，生成一个key，完成

4.汉化包，lang文件导入安装地址即可

↑以上细节，具体参看某淘客服发的链接，这里不具体附上了

二、Axure9开发细节

0、常用颜色

蓝色字体：108DE9 ，1890FF+灰色

蓝色：169BD5 作为 "确认"or"取消" 按钮，确认字体和border颜色，或者是取消的fill

1、NodeTree的使用：

主要是用来做左侧菜单栏的，主要的的步骤1.拖一个Node Tree出来 2.添加删除节点即可

PS：想要给item左边附上图片，

1）先有个16*16的icon，自行去iconfont-阿里巴巴矢量图标库下载

2）右键这个数，编辑数属性->√显示图标

3）右键这个数，编辑图标->导入一个图标->显示所有节点图片

4）完成

2、试图是否可视：

主菜单有visible和invisible选项，可以选择某视图，可见不可见。

3、闪电符号：

代表该控件有绑定事件。

4、Switch：

功能可以使用矩形+原型，通过动态面板来做。也可以直接拖系统已有控件。

5、下拉选择框：

该功能实现下拉选择框，其中item选项需自行配置，typography，fill，边框border等，item的位置需要调整padding即可，conner是边框弧度。

6、按钮+按钮内部右边，有个x的组合图

没做出来，保留

7、水平线

设置border就可以了，fill可不设置，因为线段无填充

8、矩形

边框可以从border的可见性，点击去除边框

9、动态面板

1）拖取一个动态面板，配上名字A(方便后期可选)，添加状态，并根据实际情况命名，state_12345个状态，完成动态面板配置。然后起一个button，去配置click or tab，设置面板状态，对应A动态面板，然后选择state_1状态，逐个配置即可完成，点按钮动态跳转的效果。

2）动态面板，做弹窗，例如"确认是否删除"、”确认是否下线”、“删除”、“编辑”，必须放在多个动态面板里去实现，实现的"确定"、“取消”、"x”按钮，都需要配置Click or tap->显示和影藏，选择影藏动作，且需要配置，More options->置于顶层bring to front√ 打钩->顺便来个灯箱效果 cool!

3）发现动态面板，无背景色或者透明了，去设置动态面板，使其背景为白色即可。

4）如何让动态面板弹窗居中，右键设置->固定到浏览器->固定到浏览器√->水平固定(居中)->垂直固定(居中)，即可。

5）动态面板，适合做那种填资料三部曲，第一步xxx，第二步xxx，第三步xxx。前提是，这三部曲需要再一个版面上，无法完成错落有致的效果，如有弹窗之类的，慎重考虑。

  其中跳转可以下面给两个按钮，一个按钮 to 该动态面板上一个State，一个按钮 to 该动态面板下一个State，最好给点动画，即可完成跳转。

10、设置tab选中和切换效果

1）首先拖几个矩形ABCD，分别代表不同的tab，实现用户点击A，字体和边框会变成蓝色，用户再点到其他B，则A消失聚焦，B变成蓝色，如此类推。

2）给A设置，交互->click or tab->设置选中->this绝对位置'true'，在设置下面的->形状 properties->Selected Style->设置字体颜色和字段颜色为蓝色

3）继续在形状 properties->右上角 Show All->设置选项组名称：通知规则->给ABCD都加到这个规则中->默认A给个选中即可

4）click or tab配合动态面板，完成最终分tab切换效果

11、Mouse over Style 鼠标悬停样式

？？

12、Multiple Widgets (多个部件)

??是一种长条单元格子，从哪里拖出来?

13、如何制作"环形饼图"

1）准备控件：一个灰色底大扇形>273°，一个小一点的白色圆形，一个小扇形带蓝色。

2）PS：如何话扇形，先拖一个圆出来，右键，Select Shape，选择扇形那个即可

3）把三个图根据图层堆叠起来，形成环形饼图

14、如何制作“面积图”

1）包括一条曲线图，一个堆叠fill图

2）曲线：insert->钢笔->画出来->改变形状->曲线各连接点

3）堆叠fill图：矩形->右键->改变形状->Editpoint->自己画点点->然后拖动

4）组合起来即可，但是遇到曲线内部有留白填充不上的情况？？

15、如何制作"柱状图"

1）线段、线段(虚线)、坐标轴值(矩形)、上方是样例图(圈+文字描述)、柱子(矩形加颜色)

16、制作"表格"

1)拖一个原生表格出来

2）设置好行列个数，PS：点击列上侧的灰色按钮，可以批量设置整列的效果

17、图的组合

把多个元器件选中，然后点击组合即可。后面就可以很方便配置，这组组件的事件，不用单个配置事件，这么麻烦、

18、Radio Button（单选按钮）

拉两个，或者以上个'单选按钮'，然后选择他们，右键->设置单选按钮组->即可。

如果想对按钮加时间，例如点击可以显示自定义时间，则需要设置事件“选中”->里面在选 “显示/隐藏”->即可

19、使用母版

新开一个页面，或者直接选中常见的控件，如日期控件，弹窗控件等，右键选中的元件->选择Create master(添加母版)->即可生成。使用的时候拖出来即可，跟原件一样使用。