Axure实现菜单抽屉效果

news/2024/5/20 2:39:08

Axure是怎么实现如下效果的?

  • 菜单打开和收起
  • 侧边栏菜单
  • 抽屉效果

实现效果

请添加图片描述

两级菜单,点击菜单收起其他菜单,打开当前菜单。

实现原理

  1. 单击一级菜单时,1)切换当下二季菜单的显示/隐藏状态 2)隐藏其他菜单的子菜单
  2. 推/拉动下方原件效果

实现步骤

  1. 在页面上添加一个矩形作为一级菜单

  2. 在一级菜单下面添加多个矩形作为当前一级菜单的二级菜单

  3. 将二级菜单进行组合,设置组合名称为G-sub table,转成动态面板,之后设置为隐藏

  4. 将一个菜单和二级菜单进行组合,多复制几个

  5. 按照倒叙将组合好的菜单叠放,如下:
    在这里插入图片描述
    注意:第三个菜单放最下面,第二个叠在三的上面,第一个在最上层。

  6. 分别给1、2、3这三个一级菜单添加点击动作(以菜单1为例)
    1)交互->单击时->显示/隐藏->隐藏其他菜单的子级动态面板,设置“拉动原件”,选择“下方”
    在这里插入图片描述
    2)将当前菜单的子菜单的组合设置为“切换”
    在这里插入图片描述

总的设置如下:
在这里插入图片描述

总结

实际上就是堆叠了几个动态面板,适当的时候让其显示或者隐藏,用时拉或者推送下方原件上移或者下移,即可实现此效果。


http://www.mrgr.cn/p/33318358

相关文章

网络安全之ACL

ACL:访问控制列表——控制列表(策略列表),是一个控制工具。 功能:!、定义感兴趣路由(控制层面)。2、定义感兴趣流量(数据层面)。 例如: 假设在该…

【MsSQL】数据库基础 库的基本操作

目录 一,数据库基础 1,什么是数据库 2,主流的数据库 3,连接服务器 4,服务器,数据库,表关系 5,使用案例 二,库的操作 1,创建数据库 2,创建…

【攻防技术系列+Python】-- 用 Python 控制系统进程

用 Python 控制系统进程 由于注册表几乎可以决定整个操作系统的运行,因此它成为安全工具与恶意软件对抗的主要战场之一。除了注册表之外,对系统进程的控制也是安全工具和恶意软件的必争之地。这里我们首先要了解程序和进程的区别。程序是静态的,进程是动态的。进程可以分为系…

两个手机在一起ip地址一样吗?两个手机是不是两个ip地址

在数字时代的浩瀚海洋中,手机已经成为我们生活中不可或缺的一部分。随着移动互联网的飞速发展,IP地址成为了连接手机与互联网的桥梁。那么,两个手机在一起IP地址一样吗?两个手机是不是两个IP地址?本文将带您一探究竟&a…

【快速入门Linux】10_Linux命令—Vi编辑器

文章目录 一、vi 简介1.1 vi1.2 vim1.3查询软连接命令(知道) 二、打开和新建文件(重点)2.1 打开文件并且定位行2.2 异常处理 三、vi三种工作模式(重点)3.1 末行模式-命令 四、常用命令4.0 命令线路图4.1 移…

图像涂哪就动哪!Gen-2新功能“神笔马良”爆火,网友:急急急

AI搞视频生成,已经进化到这个程度了?! 对着一张照片随手一刷,就能让被选中的目标动起来! 明明是一辆静止的卡车,一刷就跑了起来,连光影都完美还原: 原本只是一张火灾照片&#xff0…

STM32快速入门(串口传输之USART)

STM32快速入门(串口传输之USART) 前言 USART串口传输能实现信息在设备之间的点对点传输,支持单工、半双工、全全双工,一般是有三个引脚:TX、RX、SW_RX(共地)。不需要一根线来同步时钟。最大优…

Hadoop3:集群搭建及常用命令与shell脚本整理(入门篇,从零开始搭建)

一、集群环境说明 1、用VMware安装3台Centos7.9虚拟机 2、虚拟机配置:2C,2G内存,50G存储 3、集群架构设计 从表格中,可以看出,Hadoop集群,主要有2个模块服务,一个是HDFS服务,一个是…

基于web的物流管理系统

文章目录 项目介绍主要功能截图:部分代码展示设计总结项目获取方式 🍅 作者主页:超级无敌暴龙战士塔塔开 🍅 简介:Java领域优质创作者🏆、 简历模板、学习资料、面试题库【关注我,都给你】 &…

特斯拉CEO马斯克访华,或加速FSD技术在中国的落地

特斯拉首席执行官埃隆马斯克于4月底进行了中国之旅,这一访问被业内人士认为可能加速特斯拉FSD(Full Self-Drive,完全自动驾驶)技术在中国的应用。业内专家指出,马斯克的此番到访可能会对中国自动驾驶市场产生深远影响&…

VMware如何将虚拟机的端口服务映射出去

我们有时候在VMware起了一个服务,想要局域网的朋友同事访问 这时候就需要i端口映射 选择NAT模式 VMnet8点击 NAT设置 然后点击添加然后映射传入端口对话框 红色部分是 你主机本机,也就是你在用的电脑的空闲端口(可以打开cmd 输入命令 : netstat -ano 查看已用端口都有哪些…

c++多线程2小时速成

简介 c多线程基础需要掌握这三个标准库的使用&#xff1a;std::thread,std::mutex, andstd::async。 1. Hello, world #include <iostream> #include <thread>void hello() { std::cout << "Hello Concurrent World!\n"; }int main() {std::th…

CSS 伪类、伪元素的应用实例:电池充电、高能进度条

一、目的 本文通过 CSS 伪类、伪元素&#xff0c;结合动画 animation 和 Vue 动态样式属性&#xff08;通过 CSS 变量&#xff09;的写法&#xff0c;来实现电池充电、高能进度条的效果&#xff0c;如下图所示。 二、基础知识 1、CSS 伪类、伪元素 简单概括成以下 4 点&#x…

亚马逊Amazon商品详情和关键词搜索API接口分享

一、亚马逊Amazon商品详情API接口 亚马逊商品详情API接口是亚马逊平台为开发者提供的一项重要服务&#xff0c;它允许开发者通过程序调用API来获取亚马逊商品的相关数据。这个接口为获取商品数据提供了便利的途径&#xff0c;有助于用户进行商品搜索、商品分类以及数据分析等操…

基于改进MFCC特征和卷积递归神经网络的心音分类

具体的软硬件实现点击http://mcu-ai.com/MCU-AI技术网页_MCU-AI人工智能 心音分类在心血管疾病的早期发现中起着至关重要的作用,特别是对于小型初级卫生保健诊所。尽管近年来心音分类取得了很大进展,但其中大多数都是基于传统的分段特征和基于浅层结构的分类器。这些传统的声…

2024最详细全面的发卡平台对比调研

最近在调研目前市面上的发卡平台&#xff0c;对一些主流的托管式发卡平台与github上开源的发卡项目做了横向对比&#xff0c;本文主要介绍各自特点以及需要注意避免的坑。 直接上表格&#xff0c;一目了然。 对比独角数卡***发卡/泛发卡平台iDataRiver发卡稳定性/跑路风险自己…

QT day2 作业

头文件 #ifndef MYWIDGET_H #define MYWIDGET_H#include <QWidget> #include <QDebug> #include<QIcon> #include<QLabel> #include<QMovie> #include<QLineEdit> #include<QPushButton> QT_BEGIN_NAMESPACE namespace Ui { class …

ansible------inventory 主机清单

目录 inventory 中的变量 2&#xff09;组变量[webservers:vars] #表示为 webservers 组内所有主机定义变量&#xff0c;所有组内成 员都有效 ansible_userrootansible_passwordabc1234 3&#xff09; [all:vars…

Golang | Leetcode Golang题解之第71题简化路径

题目&#xff1a; 题解&#xff1a; func simplifyPath(path string) string {stack : []string{}for _, name : range strings.Split(path, "/") {if name ".." {if len(stack) > 0 {stack stack[:len(stack)-1]}} else if name ! "" &am…

Redis线程模型

文章目录 &#x1f496; Redis 单线程模型⭐ 单线程监听大量的客户端连接⭐ Redis 6.0 之前为什么不用多线程&#xff1f; &#x1f496; Redis多线程⭐ Redis 后台线程⭐ Redis 网络IO多线程 对于读写命令来说&#xff0c;Redis 一直是单线程模型。不过&#xff0c;在 Redis 4…