欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  科技

Axure怎么设计开关按钮效果?

程序员文章站 2023-11-30 12:38:40
Axure怎么设计开关按钮效果?...

axure中想要绘制开关按钮,该怎么设计开关呢?下面我们就来看看详细的教程。

Axure怎么设计开关按钮效果?

”开关“按键比较简单,如下图,新建一个”圆形“及一个”矩形“

Axure怎么设计开关按钮效果?

设置”圆形“尺寸为28*28,命名为round;设置”矩形“尺寸为70*32,命名为block,填充色#999999,圆角半径35,字体颜色#ffffff,文字内容”off“,右对齐

Axure怎么设计开关按钮效果?

另单独再设置”矩形:block“的选中时,填充色为#009900

Axure怎么设计开关按钮效果?

按下图方式布局方式组合”圆形:round“和”矩形:block“,并命名此组合为”on-off“

Axure怎么设计开关按钮效果?

布局、组合结束后,下来就是”开关“按键的交互动作。”组合:on-off“的”鼠标点击时“的交互动作:设置”当前控件“的选中状态为”切换(toggle)“方式

Axure怎么设计开关按钮效果?

”圆形:round“的”选中时“的交互动作:移动”圆形:round“到指定位置(x,y)

Axure怎么设计开关按钮效果?

设置“元件:block”为局部变量lvar1,所以x的值为[[lvar1.right-this.width-3]]

Axure怎么设计开关按钮效果?

y的值为[[this.y]]

Axure怎么设计开关按钮效果?

”圆形:round“的”取消选中时“的交互动作:移动”圆形:round“到指定位置(x,y)

Axure怎么设计开关按钮效果?