Axure教程—计数器

本文将教大家如何用AXURE制作计数器（商品购件数的交互设计）
一、效果

预览地址：https://uf9ie1.axshare.com
二、功能
1、用户点击“+”号时数值加1
2、用户点击“-”号时数值减1
三、制作

• 数值
  拖入一个矩形组件，其大小设置为164×38，在其上拖入一个文本框，命名为数值，设置默认数值为1，如图：
  

• 减号
  拖入一个矩形组件，命名为减，设置大小为39×36，在其矩形中加入“—”标号，放置在数值的左侧，（减号可以用文本表示也可以用图片表示）如图：
  

• 加号
  拖入一个矩形组件，命名为加，设置大小为39×36，在其矩形中加入“+”标号，放置在数值的右侧，（加号可以用文本表示也可以用图片表示）如图：
  
  元件制作完毕
  四、交互
  1、减
  “减“的鼠标点击时设置 文本标签【数值】的文本为[[LVAR1-1]]；如图：
  
  
  鼠标移入时设置选中状态为ture,如图：
  鼠标移入出时设置选中状态为false,如图：
  

2、加
“加“的鼠标点击时设置 文本标签【数值】的文本为[[LVAR1+1]]；如图：

鼠标移入时设置选中状态为ture,如图：
鼠标移入出时设置选中状态为false,如图：

3、数值
文本【数值】文本改变时，设置如图

获取焦点时设置选中状态为ture,如图：
失去焦点时设置选中状态为false,如图：

所有制作完毕