【Axure RP9】动态面板使用------案例:包括轮播图和多方式登入及左侧菜单栏案例

目录

一  动态面板简介

1.1 动态面板是什么

二 轮播图

2.1 轮播图是什么

2.2 轮播图应用场景 

2.3 制作实播图

三 多方式登入

3.1多方式登入是什么

3.3 多方式登入实现

四 左侧菜单栏

4.1左侧菜单栏是什么

4.2 左侧菜单栏实现


一  动态面板简介

1.1 动态面板是什么

      动态面板是一种特殊的UI组件,它可以包含多个子部件,并且可以显示或隐藏这些子部件。动态面板的主要特点是它可以在不同的状态之间切换,每个状态可以包含不同的子部件。通过切换状态,动态面板可以显示或隐藏不同的子部件,从而实现不同的功能

二 轮播图

2.1 轮播图是什么

      轮播图是一种常见的网页设计元素,用于展示多张图片或内容,通过自动或手动切换实现轮流显示,以提高网页的视觉效果和用户体验。轮播图通常以水平或垂直排列的方式呈现,可以同时显示多个内容点或图片缩略图,用户可以通过点击或滑动来触发切换效果

2.2 轮播图应用场景 

  • 首页轮播图:

   用于首页的头图,通常呈现的是品牌形象、产品特点、最新活动等信息。

  • 图片展示:

     用于图片展示区域,例如产品画廊、公司实景展示等。

  • 广告推广

      用于网站或应用内的广告推广位,通过精准定位、多张广告轮播,为广告主提供广阔的曝光机会。

  • 新闻资讯:

    用于新闻中轮播多张图片或文章标题,吸引用户的点击或浏览。

2.3 制作实播图

效果图:

注意:使用动态的时候会有遮罩它不在浏览器中呈现。

全部概要:

注意: 不包含在动态面板中会在每个状态中显示  State(状态) 下的元件是切换到本状态的时候会全部显示  所以上图我的State(状态)有五种  然后再>元件中新建交互选择动态面板 设置相关的事件等等即可

三 多方式登入

3.1多方式登入是什么

     多方式登录是指用户可以使用多种方式进行登录,例如使用用户名和密码、手机验证码、社交媒体账号等。这种登录方式可以增加用户的安全性和便利性,因为用户可以使用自己最熟悉或最方便的方式进行登录。

3.3 多方式登入实现

全部概要:  

实现流程:

本登入实现有两个动态面板 下划线面板(其中两个状态)  控制内容一个面板(两个状态)

附带ERP登入案例:

四 左侧菜单栏

4.1左侧菜单栏是什么

左侧菜单栏是一种用户界面设计元素,通常位于应用程序或网站的左侧,用于提供用户导航和访问不同功能或页面的选项。这种设计可以使得用户更方便地找到他们需要的信息或功能,提高用户体验。左侧菜单栏通常包含一系列链接或按钮,每个链接或按钮都代表一个特定的功能或页面

4.2 左侧菜单栏实现

效果:

全部概要: 

实现流程: 在一整个动态面板中 嵌套三个不同的动态不同的动态有着两个状态来控制子菜单的显示和收起  

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

配置VRRP负载分担示例

一、组网需求: HostA和HostC通过Switch双归属到SwitchA和SwitchB。为减轻SwitchA上数据流量的承载压力,HostA以SwitchA为默认网关接入Internet,SwitchB作为备份网关;HostC以SwitchB为默认网关接入Internet,SwitchA作为…

【教程】从零开始的ORB-SLAM3的安装与配置

引言 最近项目需求需要接触vslam,博主选择从ORB-SLAM3下手并且记录下安装的基本流程。不得不说,这安装流程就像二大娘的裹脚布。 大致环境前提:Ubuntu20.04 一、ORB-SLAM3的源码下载 1、首先,为了方便管理文件,我们…

【infiniband】ibdump抓包

ibdump用于捕获和转储InfiniBand网络的流量。 这种工具通常用于调试和分析InfiniBand网络问题,包括性能瓶颈和配置错误。ibdump工具在Mellanox InfiniBand环境中较为常用,现由NVIDIA提供支持。 使用ibdump的基本步骤 请注意,您需要在安装了…

MATLAB六轴机械臂机器人的动力学分析

1、概述 动力学以牛顿第二定律为核心,这个定律指出了力、加速度、质量三者间的关系。 质点动力学有两类基本问题: 一是已知作用于质点上的力,求质点的运动,这个就是正动力学。 二是已知质点的运动,求作用于质点上的力…

SpringMVC-02

SpringMVC-02 SSM 框架集成与测试环境配置添加源代码 SSM 框架集成与测试 环境配置 IDEA 下创建项⽬ 创建Maven对应的Web项⽬ 配置 pom.xml 2.1. 修改 JDK 版本 <properties><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding><mav…

【Matlab】如何使用MATLAB可视化二重积分(附完整MATLAB代码)

可视化二重积分 前言正文完整代码代码实现可视化结果 前言 二重积分是指在二维空间中对函数进行积分。二重积分的公式如下&#xff1a; ∫ a b ∫ c d f ( x , y ) d x d y ∫_a^b ∫_c^d f(x, y) dx dy ∫ab​∫cd​f(x,y)dxdy 其中&#xff0c; a a a 和 b b b 是 x x x…

maven打包插件maven-jar-plugin与spring-boot-maven-plugin

maven几种打包插件介绍 文章目录 &#x1f50a;1.spring-boot-maven-plugin打包后效果 &#x1f4d5;2.maven-jar-plugin打包后效果&#x1f58a;️最后总结 &#x1f50a;1.spring-boot-maven-plugin <plugins><plugin><groupId>org.springframework.boot&…

每日一题SQL

以下题目来源微信公众号【SQL数据库开发】 1、编写一个 SQL 查询来实现分数排名。如果两个分数相同&#xff0c;则两个分数排名&#xff08;Rank&#xff09;相同。请注意&#xff0c;平分后的下一个名次应该是下一个连续的整数值。换句话说&#xff0c;名次之间不应该有“间隔…

HTML5+CSS3+JS小实例:自适应瀑布流布局

实例:自适应瀑布流布局 技术栈:HTML+CSS+JS 效果: 源码: 【HTML】 <!DOCTYPE html> <html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><meta name="viewport" content=&quo…

九、 SpringBoot项目部署、项目打包、运行

5.5.1 项目打包 步骤1&#xff1a; 添加项目的pom.xml插件&#xff1b;在pom.xml要显式的加入插件spring-boot-maven-plugin&#xff0c;否则无法产生 jar 清单文件&#xff0c;导致打出来的 jar 无法使用命令运行&#xff1b; <build> <plugins> <!-- 打j…

2023 re:Invent使用 PartyRock 和 Amazon Bedrock 安全高效构建 AI 应用程序

前言 本篇文章授权活动官方亚马逊云科技文章转发、改写权&#xff0c;包括不限于在 亚马逊云科技开发者社区, 知乎&#xff0c;自媒体平台&#xff0c;第三方开发者媒体等亚马逊云科技官方渠道 “Your Data, Your AI, Your Future.&#xff08;你的数据&#xff0c;你的AI&…

接口自动化测试框架搭建

一、原理及特点 参数放在XML文件中进行管理用httpClient简单封装一个httpUtils工具类测试用例管理使用了testNg管理&#xff0c;使用了TestNG参数化测试&#xff0c;通过xml文件来执行case。测试报告这里用到第三方的包ReportNG 项目组织用Maven 二、准备 使用工具&#xff1…

2023-12-14 使用Qt画一条曲线(AI辅助)

点击 <C 语言编程核心突破> 快速C语言入门 使用Qt画一条曲线 前言一、Qchart简介二、代码总结 前言 要解决问题: 有一个函数, 生成一些点, 想画一条曲线. 想到的思路: 这个用Qchart比较简单. 其它的补充: 需要稍许配置 一、Qchart简介 QChart是Qt中的一个图表控件&a…

小白菜QQ云端机器人源码-去除解密授权

小白菜QQ云端机器人源码分享&#xff1a;解密授权学习版已去除 这款源码是专为群机器人爱好者设计的&#xff0c;它基于挂机宝机器人框架构建的网页站点。 用户可以通过网页登录QQ账号至挂机宝框架中&#xff0c;无需通过机器人实现登录。 而且&#xff0c;该源码解决了一个…

力扣 | 437. 路径总和 III

437. 路径总和 III mport java.util.ArrayList; import java.util.List;/*** int的取值范围&#xff1a;* -2^31 ~ 2^31-1* <p>* -2147483648 ~ 2147483647&#xff08;约等于10的9次方&#xff09;* <p>* long long的取值范围&#xff1a;* -2^63 ~ (2^63-1&…

HBase 详细图文介绍

目录 一、HBase 定义 二、HBase 数据模型 2.1 HBase 逻辑结构 2.2 HBase 物理存储结构 ​2.3 数据模型 2.3.1 Name Space 2.3.2 Table 2.3.3 Row 2.3.4 Column 2.3.5 Time Stamp 2.3.6 Cell 三、HBase 基本架构 架构角色 3.1 Master 3.2 Region Server 3.3 Zo…

弹性搜索引擎Elasticsearch:本地部署与远程访问指南

&#x1f308;个人主页&#xff1a;聆风吟 &#x1f525;系列专栏&#xff1a;网络奇遇记、Cpolar杂谈 &#x1f516;少年有梦不应止于心动&#xff0c;更要付诸行动。 文章目录 &#x1f4cb;前言系统环境1. Windows 安装Elasticsearch2. 本地访问Elasticsearch3. Windows 安装…

有教师资格证就可以当老师吗

我是一名在教育事业中摸爬滚打了多年的老鸟&#xff0c;最近看到很多人在讨论一个话题&#xff1a;有教师资格证就能当老师吗&#xff1f;今天我就来给大家科普一下。 我们得明白教师资格证是什么。教师资格证是国家教育部门为了规范教育行业&#xff0c;提高教育质量而设立的一…

详解—C++右值引用

目录 一、右值引用概念 二、 左值与右值 三、引用与右值引用比较 四、值的形式返回对象的缺陷 五、移动语义 六、右值引用引用左值 七、完美转发 八、右值引用作用 一、右值引用概念 C98中提出了引用的概念&#xff0c;引用即别名&#xff0c;引用变量与其引用实体公共…

多线程 (下) - 学习笔记

常见锁策略 乐观锁和悲观锁 悲观锁 总是假设最坏的情况, 每次去拿数据的时候都会认为会被别人修改, 因此会上锁, 防止数据在使用过程中被别的线程修改, 乐观锁 假设数据一般情况下不会产生并发冲突,因此在拿数据,操作数据的过程中不加锁, 而在数据进行提交更新的时候, 才会正…