Axure 列表左右滑动交互-删除、置顶

简介: Axure 列表左右滑动交互-删除、置顶

Axure 列表左右滑动交互

  • 左滑:删除、标记
  • 右滑:置顶、回复

拖一个动态面板,命名为【滑动面板】,添加三个状态,并分别命名为:正常状态、向左状态、向右状态

添加元件

正常状态

向左状态

  1. 将【正常状态】里的元件复制到 【向左状态】 中,并进行组合,方便调整
  2. 并将组合元件向左移动,右边留出两个按钮空间
  3. 在组合元件右侧添加两个按钮,分别为:【标为已读】、【删除】

向右状态

将【向左状态】的组合复制到【向右状态】中,参考上面方法,添加的元件,并增加【置顶】、【回复】两矩形

交互事件

给动态面版添加两个交互【向左拖动】、【向右拖动】

向左拖动分两种情况

  • 正常状态,需要向左滑动,对该条数据进行删除等
  • 已经被滑到右边了,需要向左滑动到正常状态。

向右拖动分两种情况:

  • 正常状态,需要向右滑动,进行回复、置顶
  • 已经被滑到左边了,需要向右滑动,恢复正常状态。

详细事件如下:

目录
相关文章
|
10月前
|
存储 JavaScript 前端开发
Axure设计之日期时间范围选择器
在产品设计和原型制作中,日期时间范围选择器是常见需求。本文介绍如何使用Axure的动态面板、中继器、文本框、按钮及时间函数,快速制作一个功能完备的日期时间范围选择器。详细步骤包括创建基本框架、设置时间函数、载入时获取当前时间、添加时间选择功能、更新文本框值和验证格式化。通过这些步骤,你可以在Axure中轻松实现这一功能。
1047 0
|
Apache
Axure rp9 引入Echarts图表 |手动引入图表 Apache Echarts
Axure rp9 引入Echarts图表 |手动引入图表 Apache Echarts
831 1
|
消息中间件 程序员 Kafka
抢购不再卡顿!揭秘异步处理如何优化秒杀流程!
本文由程序员小米分享,详细介绍了如何通过异步处理简化秒杀请求中的业务流程,提高系统效率与稳定性。主要内容包括秒杀场景的挑战、核心思路、核心业务(生成订单、扣减库存)及次要业务(发放优惠券、增加积分)的异步处理方法,并探讨了使用消息队列的优势及优化用户体验的策略。通过异步处理,系统能更好地应对高并发请求,提升响应速度和稳定性。
243 4
抢购不再卡顿!揭秘异步处理如何优化秒杀流程!
|
开发框架 JavaScript 前端开发
Angular 与 Ionic 简直太牛啦!双剑合璧构建高性能移动应用,开启跨平台开发新征程!
【8月更文挑战第31天】Angular是由Google维护的前端开发框架,使用TypeScript提供组件化开发、依赖注入等功能,适合构建复杂Web应用。Ionic则是基于Angular和Cordova的开源移动应用框架,提供丰富的UI组件以实现跨平台移动应用的快速构建。结合使用Angular与Ionic不仅能够显著提升开发速度并简化流程,还能够保证应用在iOS、Android及Web等多个平台上的良好运行,同时两者都有成熟的社区支持与资源可供利用。为了开始使用这两款工具,开发者需先安装Node.js和npm,接着利用Angular CLI和Ionic CLI创建项目并进行开发工作。
225 1
|
Unix Go 数据库
influxdb: unable to parse points 异常解决总结
influxdb: unable to parse points 异常解决总结
186 3
|
小程序 前端开发 JavaScript
微信小程序|音乐播放器小程序设计与实现
微信小程序|音乐播放器小程序设计与实现
171 2
|
数据处理
软件工程——需求分析(生存周期),需求规格说明书,数据流图
在前面我们进行了项目的软件计划,完成了可行性研究报告,知道了要做什么的问题,而下一步,我们就需要进一步的了解项目具体要怎么做,回答必须要做什么的问题了。
|
机器学习/深度学习 搜索推荐 知识图谱
大模型与搜索引擎的互补性
【2月更文挑战第21天】大模型与搜索引擎的互补性
424 1
大模型与搜索引擎的互补性
|
存储 缓存
本地缓存和分布式缓存区别
【2月更文挑战第16天】
716 2
本地缓存和分布式缓存区别
|
NoSQL 分布式数据库 Redis
数据中台之OneID (ID-Mapping)架构设计细节全解
数据中台之OneID (ID-Mapping)架构设计细节全解