Axure9中继器内部实现批量操作

复选框情形

右键 > 创建动态面板。

面板内部有两种状态,一种是勾选,一种是未勾选(默认状态)。

为动态面板新建交互,分两种不同的情况,如果当前状况是未勾选,那么面板状态切换至已勾选;反之亦然。

将外部创建好的复选框复制到中继器内部。

总复选框控制其他分支

在表头的复选框新建一个交互,控制中继器内部复选框状态。

两个部分的复选框状态必须一致。

勾选数据点击按钮一键删除

首先,创建一个全局变量,作为计数器,方便计算用户勾选的需要删除的数据。

进入中继器 > 选中复选框 > 新建交互 > 设置变量值

与之相反,当用户取消勾选的时候,值应该 -1

图中按钮需要设为隐藏,只有当用户勾选数据大于等于2的时候按钮才会出现。

交互设置完成之后,必须在中继器内部的复选框设置一个触发事件,触发按钮。

当然,此时在中继器内部的复选框设置触发事件是不够的,同样也需要在表头的复选框设置相同的触发事件

由于每一页固定显示数据是10,全选的话就相当于选中的数值为10。

需要删除的条数也应该动态的显示在按钮之上。

选中 >=2 的情况 > 设置文本

为删除按钮创建交互,实现删除效果。

由于设置删除按钮交互的时候是删除标记行,那么需要再中继器内部设置动态标记行。

勾选上的数据删除成功之后需要隐藏按钮。

全选状况下的标记行(难点)

函数还需要进行一个判断,只有它的值为rue才能够标记可见的。

当然在没有勾选的状况下还需要取消标记,此时直接取消全部标记即可。

外部复选框点击勾选之后,切换页面需要将切换勾选状态。

批量操作整体效果实现

相关推荐
艺艺生辉2 小时前
从if-else到策略模式
后端·设计模式
小林ixn2 小时前
单例模式:从弹窗管理到全局状态,一个模式搞定
前端·javascript·设计模式
AI人工智能+电脑小能手4 小时前
大白话说Java设计模式-17-装饰器模式(源码剖析篇)
java·spring·设计模式·装饰器模式·源码分析·io流
workflower6 小时前
案例 :某交通厅基于AI技术的智能安全运营实践
网络·人工智能·安全·设计模式·机器人
星期一研究室10 小时前
一个Emoji让你的文档阅读量提升300%!
微服务·产品·设计
AI人工智能+电脑小能手11 小时前
大白话说Java设计模式-16-装饰器模式(业务实战篇)
java·设计模式·装饰器模式·功能扩展·动态增强
workflower1 天前
例二:某汽车制造企业深度融合AI智能体,构建园区网络的智能运维体系
人工智能·机器学习·设计模式·机器人·云计算·汽车·制造
ly76891 天前
Java 设计模式详解:从原则到 23 种经典模式
java·开发语言·设计模式
AI人工智能+电脑小能手1 天前
大白话说Java设计模式-14-适配器模式(业务实战篇)
java·设计模式·适配器模式·系统兼容·多渠道对接
略略略咯咯2 天前
(总结)设计模式
设计模式