Axure实现菜单抽屉效果

news2025/1/10 2:50:59

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

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

实现效果

请添加图片描述

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

实现原理

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

实现步骤

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

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

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

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

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

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

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

总结

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1647507.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

[Android]四大组件简介

在 Android 开发中,“四大组件”(Four Major Components)是指构成 Android 应用程序的四种核心组件,它们通过各自的方式与系统交互,实现应用的多样功能。这些组件是:Activity、Service、Broadcast Receiver…

青春送温暖 立夏寄真情

(通讯员:赵灿飞 图:杨美、孙红浪) 在青春洋溢的五月,为传承中华民族尊老敬老的传统美德,促进当代青年与老人的跨代交流,增强青年的社会责任感和使命感,传递正能量和关爱困难群体…

组播应用:SW1、SW2、RT1、RT2、AC1运行PIM-SM

SW1、SW2、RT1、RT2、AC1运行PIM-SM,SW1 Vlan10为C-BSR和C-RP;SW1产品网络(PC1)启用组播,用VLC工具串流播放视频文件“1.mp4”,模拟组播源,设置此视频循环播放,组地址232.1.1.1,端口1234,实现总公司和分公司收看视频,用PC2测试。 一、SW1、SW2、RT1、RT2、AC1配置如…

功能全面的外发文件控制方案,拿走不谢

在日常办公中,很多企业往往只采取各种措施来确保存储数据的安全,却忽略了文件外发的安全。因此企业由于自身的安全防护机制不严谨,引发的数据安全事件频发,经常导致严重的经济损失。使用较多的外发方式有邮件、IM通讯工具、网盘、…

docker的commit命令使用制作镜像

docker run -it ubuntu 最基础的ubuntu启动后安装vim 的命令 apt-get update apt-get -y install vim docker commit -m"my_test_ubuntu" -a"za" 80977284a998 atljw/myubuntu:1.0 将本地镜像推送到阿里云 首先登录阿里云服务-控制台 记得一定要设定设…

鸢尾花分类-pytorch实现

前言 本文用pytorch实现了鸢尾花分类,数据不多,只做代码展示用,后续有升级版本。 代码 -*- coding: utf-8 -*- File : main.py Author: Shanmh Time : 2024/05/06 上午9:37 Function:import torch from sklearn import datase…

uniapp生成二维码(uQRCode)与自定义绘制样式与内容

二维码生成使用了一款基于Javascript环境开发的插件 uQRCode ,它不仅适用于uniapp,也适用于所有Javascript运行环境的前端应用和Node.js。 uQRCode 插件地址:https://ext.dcloud.net.cn/plugin?id1287 目录 1、npm安装 2、通过import引…

fabric搭建生产网络

fabric搭建生产网络 一、生成组织结构与身份证书 解包 hyperledger-fabric-linux-amd64-2.5.0.tar.gz 1.1、crypto-config.yaml配置文件 ./bin/cryptogen showtemplate > crypto-config.yaml 将crypto-config.yaml内容修改为: # -------------------------…

pygame实现鼠标绘制并调节画笔大小

pygame实现鼠标绘制并调节画笔大小 pygame介绍调节画笔大小鼠标绘制效果 pygame介绍 Pygame是一个开源的Python库,专为电子游戏开发而设计。它建立在SDL(Simple DirectMedia Layer)的基础上,允许开发者使用Python这种高级语言来实…

微信个人号开发api接口-视频号矩阵接口-VIdeosApi

友情链接:VIdeosApi 获取用户主页 接口地址: http://api.videosapi.com/finder/v2/api/finder/userPage 入参 { "appId": "{{appid}}", "lastBuffer": "", "toUserName": "v2_060000231003b2…

03、 Kafaka单机环境部署

03、 Kafka单机环境部署 1、 Docker 安装单机版本搭建 (1)安装Zookeeper docker pull zookeeper(2)启动zookeeper docker run -d --name zookeeper -p 2181:2181 zookeeper(3)安装 Kafka docker pull …

酷开科技线上出游,用酷开系统云逛博物馆!

五一假期,当全国各地的旅游景点迎来人潮高峰期时,酷开科技为那些寻求宁静假期体验的消费者带来了一个独特的解决方案——“云逛博物馆”。通过酷开系统,消费者可以在家中的电视上,体验维也纳艺术史博物馆的沉浸式画展,…

AI图书推荐:Zapier和AI融合来自动化业务流程

这本书《Zapier和AI融合来自动化业务流程》(Automate It with Zapier and Generative AI)由Kelly Goss撰写,这本书是为想要使用Zapier和AI集成功能来自动化重复性任务、提高生产力的微型、小型或中型企业的业务所有者、运营经理和团队准备的。…

抖音爆火的QQ价格评估前端源码

最近抖音很火直播给别人测qq价值多少,这个源码只有前端, 包含激活码验证页,评估页 源码免费下载地址抄笔记 (chaobiji.cn)

【新手入门】Github与Git使用教程

Github与Git 一、Github基础教程 1.1 基本操作 点击代码文件可以直接查看文件的内容,支持在线修改文件,只需要点击(文件内容)右上角的编辑按钮即可进行编辑。 README.md一般介绍项目的功能,用法,注意事项;有时还有…

【LLM第四篇】名词解释:SFT

看到京东的一段开场白,觉得很有道理: 2023年,大语言模型以前所未有的速度和能力改变我们对智能系统的认知,成为技术圈最被热议的话题。但“百模大战”终将走向“落地为王”,如何将大语言模型的强大能力融入实际业务、…

【Django学习笔记(八)】MySQL的数据管理

MySQL的数据管理 前言正文1、新增数据2、删除数据3、修改数据4、查询数据5、案例:员工管理5.1 创建表结构5.1.1 创建数据库5.1.2 创建数据表 5.2 Python操作MySQL5.2.1 pymysql 的基本操作步骤5.2.2 优化 pymysql 的基本操作步骤5.2.3 查询数据5.2.4 修改数据5.2.5 …

数据结构之栈的超详细讲解

目录 引言 一.栈的概念 二.栈的结构 三.栈的实现 栈结构的实现 栈操作函数的声明 栈中方法的实现 栈的初始化 栈的销毁 入栈 出栈 取栈顶元素 判断栈中是否为空 获取栈中数据个数 四.测试 代码展示: 结构展示: 五.小结 六.完整代码 Stack.h Stack.c text…

看Diffusion模型如何提升端到端自动驾驶的能力

文章链接:https://openreview.net/pdf?idyaXYQinjOA 自动驾驶领域在分割和规划模型性能方面取得了显著进展,这得益于大量数据集和创新的架构。然而,这些模型在遇到罕见子群,比如雨天条件时,往往表现不佳。获取必要的…

编程入门(六)【Linux系统基础操作二】

读者大大们好呀!!!☀️☀️☀️ 🔥 欢迎来到我的博客 👀期待大大的关注哦❗️❗️❗️ 🚀欢迎收看我的主页文章➡️寻至善的主页 文章目录 🔥前言🚀文件与目录的操作命令cd change directory的缩…