axure制作菜单下拉、隐藏、点击选中效果

news2024/10/6 8:32:09

在高保真原型中,制作导航栏菜单时,需要达到点击下拉按钮,子菜单自动弹出,点击其中一个子菜单项可栏目变为选中状态且跳转到对应的子页面。制作材料可以从antdesign中去下载,以下述网络配置菜单为例。在箭头处添加互动效果,为方便起见,先将路由列表,网关配置,向导配置几个组件选中,命名为网络配置子菜单,如下图所示。
在这里插入图片描述

在这里插入图片描述
按照上述设置后,可以进行上下伸缩菜单,下面开始添加鼠标悬浮在子菜单上时的效果,以及被选中时展示深色的效果。选中子菜单组件框,在interaction栏目中的style effect中选择mouseover,selected,这里颜色设置为深蓝色

在这里插入图片描述

再为组件设置点击事件,
在这里插入图片描述
将这个效果复制到每个子菜单里,做到这一步时,虽然能鼠标悬浮高亮,点击选中高亮,但会出现点击多个栏目后会同时高亮的情况,此时需要通过设置selection group的方式,让这几个组件只能同时一个被选中,右击组件—selection group,可以命名为主导航菜单选项组,将后续所有菜单里的组件都加到这个组件里。此时就能达到文章开头时说的效果了,但美中不足的是,打开页面时默认所有子菜单都是展开的,需要通过设置一个动画将其默认收起。点击页面空白处,在OnPageLoad里设置Show Hide的效果,如下图所示。至此大功告成!
在这里插入图片描述

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

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

相关文章

Pytest和Unitest框架对比

在学到自动化的时候,很多同学都遇到了Pytest和Unitest框架,有的人是两个都学,但是学的不精只是知道分别怎么用.不了解两个区别是什么.有的是犹豫到底要学习那个框架.其实要做好自动化测试,是有必要了解不同框架之间的差异化的. Pytest 特点: Pytest采用了更简洁、更灵活的语法…

C语言 | Leetcode C语言题解之第187题重复的DNA序列

题目: 题解: #define MAXSIZE 769/* 选取一个质数即可 */ typedef struct Node {char string[101];int index;struct Node *next; //保存链表表头 } List;typedef struct {List *hashHead[MAXSIZE];//定义哈希数组的大小 } MyHashMap;List * …

【建设方案】大数据湖一体化建设方案(ppt原件)

1、背景:大数据湖的发展背景与建设理念 2、体系:大数据湖体系规划与建设思路 3、生态圈:探索新兴业务入湖建设模式 4、共享:大数据湖统一访问共享规划 5、运营:大数据湖一体化运营管理建设 (本方案及更多方…

交通大数据分析与挖掘实训【对提供的CSV格式数据使用pandas库分析-Matplotlib库绘图】

背景: 《交通大数据分析与挖掘》实训 指 导 书 编著 二○二四年五月 一、实训目的 1、掌握python开发环境(如Anaconda)及Numpy等常见第三方库的使用; 2、熟悉Anaconda在线编程平台,学会基本的python程序编写…

CMake笔记之CMAKE_INSTALL_PREFIX详解以及ROS中可执行文件为什么会在devel_lib中

CMake笔记之CMAKE_INSTALL_PREFIX详解以及ROS中可执行文件为什么会在devel_lib中 code review! 文章目录 CMake笔记之CMAKE_INSTALL_PREFIX详解以及ROS中可执行文件为什么会在devel_lib中1.CMAKE_INSTALL_PREFIX详解变量作用设置 CMAKE_INSTALL_PREFIX示例影响范围常见用法特别…

OpenHarmony 应用开发FullSDK获取与替换

DevEco Studio是OpenHarmony应用集成开发环境。public-SDK是提供给应用开发的工具包,跟随DevEco Studio下载,不包含系统应用所需要的高权限API。full-SDK是提供给OEM厂商开发应用的工具包,不能随DevEco Studio下载,包含了系统应用…

了解请求参数与响应参数的区别:初学者指南

在 Web 的开发领域,无论你是前端开发还是后端开发人员,把握请求与响应参数的核心差异是极其重要的。这些参数在客户端和服务器之间的互动中扮演着关键角色。 请求参数的定义及类别 定义 当客户端向服务器提交信息时所使用的数据被称为请求参数。这些参…

Fine-tuning在垂直领域的最佳实践指南

对于Fine-tuning是深度学习和机器学习领域一个特别重要的概念,并且每个企业的实践方式也会有所不同,今天我们就来聊一聊Fine-tuning。 什么是Fine-tuning Fine-tuning指的是模型微调,通常是指在一个预训练模型的基础上,通过在特…

【剖析】为什么说RBF神经网络的误差为0

本文来自《老饼讲解-BP神经网络》https://www.bbbdata.com/ 机器学习中的模型非常的多,但如果要问有没有这样的一个模型,它的训练误差为0,那么就非RBF神经网络莫属了!下面我们来聊聊,为什么RBF神经网络的训练误差为0。…

Springboot多模块项目从0构建打包运行

今天复习了一下Springboot的多模块的构建,其实一直以来都对单体项目使用多模块感到不太理解,不知道到底有什么样的优势,目前切身体会到的优势就是确实可以让依赖的划分更加清晰(每个模块下的pom文件只引入该模块需要的依赖&#x…

数据分析的线上云端数据库搭建及Excel和Tableau连接

数据分析的线上云端数据库搭建及Excel和Tableau连接 SQL基础知识 线上SQL训练: SQlZOO: https://www.sqlzoo.net/wiki/SQL_Tutorial 牛客网SQL真题:https://www.nowcoder.com/ta/sql select,from,where, order by, limit, group by, having, substr(),…

HTML 之<title> 标签

一.HTML <title> 标签 二.实例 为您的 HTML 文档定义标题&#xff1a; <html> <head> <meta charset"utf-8"> <title>文档标题</title> </head> <body> 文档内容...... </body> </html> 尝试一下 三…

[问题记录]Qt QGraphicsItem 移动时出现残影

目录 1.问题现象 2.问题原因 3.修改方案 1.问题现象 自定义 QGraphicsItem 时&#xff0c;绘制rect&#xff0c;对象移动时出现残影。 2.问题原因 直接原因是view未刷新的问题&#xff0c;所以网上有人使用方案 setViewportUpdateMode(QGraphicsView::FullViewportUpdate…

周末设计高端企业_集团官网主题Discuz模板

风格名称: 周末设计_高端企业_集团官网 适用版本: Discuz! X3.0、X3.1、X3.2、X3.3、F1.0 风格编码: 使用语言包结构&#xff0c;适合全部编码 周末设计高端企业_集团官网主题Discuz模板

黑苹果EFI详细配置说明

先上网址: https://dortania.github.io/OpenCore-Install-Guide/installer-guide/opencore-efi.html 1: 了解作用 ACPI作用: 总结: ACPI是UEFI引导方式和操作系统之间的硬件抽象接口,概述了硬件设备,如 USB 控制器、CPU 线程、嵌入式控制器、系统时钟等 硬件设备识别和驱动:…

html--好看的手机充值单页

<!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><title>线上充值-首页</title><meta content"widthdevice-width,initial-scale1.0,maximum-scale1.0,user-scalable0" name"viewport&…

【树形dp 换根法 BFS】2581. 统计可能的树根数目

本文涉及知识点 CBFS算法 动态规划汇总 图论知识汇总 树形dp 换根法 BFS LeetCode 2581. 统计可能的树根数目 Alice 有一棵 n 个节点的树&#xff0c;节点编号为 0 到 n - 1 。树用一个长度为 n - 1 的二维整数数组 edges 表示&#xff0c;其中 edges[i] [ai, bi] &#xf…

2.树莓派4b+ubuntu18.04(ros版本melodic)+arduino mega自制两轮差速小车,实现建图导航功能

这篇文章介绍arduino使用和安装arduino_bridge 将arduino与树莓派连接 查看arduino的端口号&#xff0c;我们这里查看到的时ttyUSB0 ll /dev/ttyUSB*将当前用户添加进dialout组 sudo usermod -a -G dialout your_user_name然后重启树莓派&#xff0c;然后才能生效 然后如果你…

【ajax核心02】底层原理-Promise对象

目录 一&#xff1a;promise对象是什么 二&#xff1a;语法&#xff08;Promise使用步骤&#xff09; 三&#xff1a;Promise-三种状态 一&#xff1a;promise对象是什么 Promise 对象代表异步操作最终的完成&#xff08;或失败&#xff09;以及其结果值。 即Promise对象是…

安卓逆向经典案例—H5appXX运维

H5app的class不一定是android.webkit.WebView 也可能是腾讯X5内核或者是uc webview 殊途同归也要去hook webview的系统函数和可调式方法setWebContentsDebuggingEnabled。突破sign算法&#xff0c;输出协议和加密算法的作用是什么&#xff1f;分析c-sign值 在加密的位置下断点 …