Axure 绘制表格添加删除

简介: Axure 绘制表格添加删除

1、添加按钮:白底黑框,80X30,文本和命名均为“添加”;

2、数据表格(表头):1行5列,灰底黑框的表格作为表头,从左到右每个格子的文字分别为:姓名、性别、年龄、电话和操作:

3、数据表格(表身):一个中继器,中继器里面是一个1行5列,白底黑框的表格,从左到右5个格子分别命名为“姓名”、“性别”、“年龄”、“电话”和“删除”,其中最右边一个格子文字为:删除,字体为蓝色加下划线.

绘制表格

中继器

绘制弹框

(1)4个文本标签的文本分别为姓名、性别、年龄和电话;

(2)4个文本框分别命名为“姓名”“性别”“年龄”和“电话”,一一对应放在文本标签右边

(3)2个矩形中,一个文本和命名均为“确认”,另一个文本和命名均为“取消”。

添加按钮

设置交互样式和交互用例

交互样式为:鼠标悬停和鼠标按下均设置填充颜色为灰色

交互用例为:鼠标单击时显示“弹出框”

中继器设置数据

删除按钮

交互用例设置为:鼠标单击时删除 this 行

确定按钮

交瓦用例设置为:鼠标单击时添加一行数据并隐藏“弹出框”

取消按钮

交瓦用例设置为:鼠标单击时隐藏“弹出框”

预览

如果年龄、电话中不能输入数字,注意切换一下输入法

目录
相关文章
|
机器学习/深度学习 存储 弹性计算
使用 Databricks 和 MLflow 进行机器学习模型训练和部署的应用实践| 学习笔记(一)
快速学习使用 Databricks 和 MLflow 进行机器学习模型训练和部署的应用实践
1181 0
使用 Databricks 和 MLflow 进行机器学习模型训练和部署的应用实践| 学习笔记(一)
|
Java 应用服务中间件 Maven
解析Spring Boot中的Profile:配置文件与代码的双重掌控
解析Spring Boot中的Profile:配置文件与代码的双重掌控
|
8月前
|
移动开发 前端开发 数据可视化
React 拖拽布局组件 Drag & Drop Layout
本文介绍了如何在React中构建拖拽布局组件,涵盖基础知识、常见问题及解决方案。首先解释了拖拽操作的三个阶段:开始、过程中和结束。接着推荐了几个常用的拖拽库,如`react-beautiful-dnd`,并详细展示了如何使用该库创建基础拖拽组件,包括安装依赖、初始化容器和处理拖拽结束事件。文章还探讨了常见问题,如拖拽不生效、性能优化、嵌套拖拽和跨浏览器兼容性,并提供了进阶技巧,如自定义样式、多列布局和集成其他UI组件。通过这些内容,读者可以掌握构建高效拖拽布局的方法。
575 16
|
存储 关系型数据库 分布式数据库
突破大表瓶颈|小鹏汽车使用PolarDB实现百亿级表高频更新和实时分析
PolarDB已经成为小鹏汽车应对TB级别大表标注、分析查询的"利器"。
突破大表瓶颈|小鹏汽车使用PolarDB实现百亿级表高频更新和实时分析
|
XML JSON Java
【Java用法】@RequestParam、@RequestBody、@ResponseBody和@PathVariable的使用与区别
【Java用法】@RequestParam、@RequestBody、@ResponseBody和@PathVariable的使用与区别
518 0
STM32(HAL库)驱动GY30光照传感器通过串口进行打印
STM32(HAL库)驱动GY30光照传感器通过串口进行打印
|
算法 C++
【洛谷 P1055】[NOIP2008 普及组] ISBN 号码 题解(字符串)
该编程题目要求编写程序检查输入的ISBN号码的识别码是否正确。ISBN号码格式为`x-xxx-xxxxx-x`,其中`x`是数字,最后一位是通过特定算法计算得出的识别码。算法是将前9位数字乘以1到9的加权值,求和后对11取模,模为10时识别码为大写`X`,否则为对应模值的数字。程序接收一个符合格式的ISBN号码,验证识别码并输出`Right`(如果正确)或修正后的正确ISBN号码。提供的AC代码使用C++实现这一功能。
239 0
|
JavaScript 索引
js【详解】arr.splice() 数组拼接
js【详解】arr.splice() 数组拼接
1010 0
|
NoSQL Java 应用服务中间件
技术笔记:Profiles简介
技术笔记:Profiles简介
250 0
|
机器学习/深度学习 自然语言处理 算法
【论文泛读】 知识蒸馏:Distilling the knowledge in a neural network
【论文泛读】 知识蒸馏:Distilling the knowledge in a neural network
【论文泛读】 知识蒸馏:Distilling the knowledge in a neural network