Axure8.0实例|数量编辑器

Axure8.0实例|数量编辑器

一、元件准备

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

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

二、添加用例

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

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

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

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

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

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

三、预览

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

相关推荐
晚风_END9 小时前
Linux|操作系统|elasticdump的二进制方式部署
运维·服务器·开发语言·数据库·jenkins·数据库开发·数据库架构
devmoon9 小时前
Polkadot SDK 自定义 Pallet Benchmark 指南:生成并接入 Weight
开发语言·网络·数据库·web3·区块链·波卡
爱吃生蚝的于勒9 小时前
【Linux】线程概念(一)
java·linux·运维·服务器·开发语言·数据结构·vim
Figo_Cheung9 小时前
Figo关于OpenClaw(MacOS)安装前环境变量设置保姆级教程
macos·性能优化·个人开发
Pluchon9 小时前
硅基计划4.0 算法 简单模拟实现位图&布隆过滤器
java·大数据·开发语言·数据结构·算法·哈希算法
我命由我123459 小时前
Java 泛型 - Java 泛型通配符(上界通配符、下界通配符、无界通配符、PECS 原则)
java·开发语言·后端·java-ee·intellij-idea·idea·intellij idea
yunsr9 小时前
python作业3
开发语言·python
星火开发设计10 小时前
this 指针:指向对象自身的隐含指针
开发语言·数据结构·c++·学习·指针·知识
梵刹古音10 小时前
【C++】构造函数
开发语言·c++
独自破碎E10 小时前
【曼哈顿距离】BISHI25 最大 FST 距离
java·开发语言