Axure8.0实例|数量编辑器

Axure8.0实例|数量编辑器

一、元件准备

1、添加三个矩形框,分别取名为"减少数量"、"数量背景"、"增加数量"。"减少数量"矩形框中输入"-"号,"增加数量"矩形框中输入"+"号,待用;

2、添加一个文本框,取名为"数量",用来接收通过键盘输入的数字;且该文本框的长度和高度与"数量背景"矩形框保持一致。

二、添加用例

一般情况下,无论是加入进货单,还是下单购买,最少的数量是1,所以我们这里设置数量的默认值为1,在"数量背景"矩形框中输入数量"1"。

1、首先,给"减少数量"矩形框添加用例,点击"减少数量"矩形框,达到的效果是一次减少1,且要求在数量为1的时候,不能再减小,所以要判断"数量背景"矩形框的值是否大于1,只有"数据背景"矩形框的值大于1时,才能减小数值,具体用例如下图:

当"背景数量"矩形框的值大于1时,设置"数量背景"矩形框的文字等于它本身的值减去1,具体设置用例如下:

2、给"增加数量"矩形框设置用例,点击"增加数量"矩形框,达到的效果是一次增加1,具体用例如下图:

3、将"数量背景"矩形框放置到"数量"文本框上,在点击"数量背景"矩形框时,将"数量背景"矩形框的文字赋值给"数量"文本框,并且将"数量"文本框置于顶层,同时让"数量"文本框获取焦点,具体用例如下图:

4、给"数量"文本框设置用例。通过键盘输入数值给"数量"文本框后,在"数量"文本框驶入焦点时,把"数量"文本框置于底层,同时将"数量"文本框的数值赋值给"数量背景"矩形框,具体用例如下:

三、预览

至此,数量编辑器到此已经完成了,预览一下吧。

相关推荐
Wang's Blog38 分钟前
Java 项目实战:交友项目 - 用户体系集成总结
java·开发语言·交友
中科三方1 小时前
IPv6检测常见问题:AAAA记录检测不通过是什么原因?
开发语言·php
沫璃染墨2 小时前
从零入门计算机网络系列(十一):HTTP协议进阶——从重定向原理到GET/POST与Fiddler抓包
linux·服务器·开发语言·网络·c++·tcp/ip·html
刚入门的大一新生2 小时前
Linux-线程互斥
java·开发语言
香芋芋圆3 小时前
iD-editor 详解|OSM官方在线编辑器,基于D3.js的轻量地图编辑器
开发语言·javascript·编辑器
赵小哥要冲啦3 小时前
社区邻里互助小程序从 0 到 1 复盘:需求拆解与信任机制设计
java·小程序·需求分析
小熊恋旧3 小时前
Python 面向对象编程:方法、属性、继承与多态详解
开发语言·python
云边云科技_云网融合3 小时前
面向汽车零部件制造业场景的解决方案 | 70 秒:一台车下线的时间里,藏着五张网
开发语言·汽车·php
Evand J3 小时前
【PMSM滤波例程2】PMSM未知负载转矩观测EKF。MATLAB例程(负载增广EKF与实际仿真结果)。附下载链接
开发语言·matlab·电机
will_net4 小时前
apollo 站点部署&C#接入
开发语言·c#·apollo