【Axure RP9】元件应用(图文并茂)----含登入,个人简历案例

news2024/11/18 8:26:22

目录 :

一,元件基本介绍

1.1 元件概述

1.2 元件操作

1.3 快捷键大全

二,基本元件的应用

2.1 形状

2.2 图片

2.3 文本

2.4 线段原件

2.5 热区

2.5.1 热区应用

三, 表单型元件的应用

3.1 文本框

3.2 文本域

3.3 下拉列表

3.4 列表框

3.5 复选框

3.6 单选按钮

四,表单案例

4.1 登入

4.1.1 组件

4.2 个人简历

4.2.1 组成元件


一,元件基本介绍

1.1 元件概述

  • 在Axure RP中,元件是构建原型图的基础模块。 将元件从元件库里拖拽到画布中,即可添加元件到你的原型图中。

  • 软件自带了三个官方元件库,分别是默认元件库(Default)、流程元件库(Flow)和图标元件库(Icons)

1.2 元件操作

  • 使用:如果想使用某个元件,我们只需要将它从元件库中拖入画布摆放即可。

  • 旋转:元件的旋转可以通过按下<Ctrl>键的同时,拉动元件任意一个边界点来实现

  • 圆角:矩形元件可以编辑圆角,通过鼠标指针拖动矩形左上方的小三角形图标即可改变圆角的大小

  • 改变形状:形状类元件都可以通过点击鼠标右键,在菜单中通过【选择形状】将当前形状改变为其他形状。

  • 改变尺寸:可以通过鼠标拖动指针拖动元件的边界点任意改变

  • 元件的尺寸;也可以按住<Shift>不放,同时鼠标指针拖动元件边界点等比例改变元件的尺寸

1.3 快捷键大全

在使用Axure RP9元件前我们需要来学习相关的快捷键 ,在我们后面学习中可以提高效率和原型图质量

  1. 隐藏工作区域网格:Ctrl+
  2. 快速复制粘贴:Ctrl+D  或者单击拖拽+Ctrl
  3. 选中图层移动到顶层: ctrl + shift + [
  4. 保存项目:Ctrl+O
  5. 新建工程:Ctrl+N
  6. 查找:Ctrl+F
  7. 替换:Ctrl+H
  8. 复制:Ctrl+C
  9. 剪切:Ctrl+X
  10. 粘贴:Ctrl+V
  11. 撤销:Ctrl+Z
  12. 重做:Ctrl+Y
  13. 全选:Ctrl+A
  14. 组件定位: Ctrl+k
  15. 原型预览:Fn+F5
  16. 保存图片比例: Shift+单击拖拽  
  17. 回位画布: Shift+9
  18. 另存为:Ctrl+Shift+S
  19. 退出:Alt+F4
  20. 打印:Ctrl+P
  21. 拼写检查:Fn+F7

二,基本元件的应用

2.1 形状

包括了矩形、圆形、矩形的应用比较广泛,它可以用来做很多的工作,比如作为页面的背景,只需要将矩形填充相应的颜色即可

2.2 图片

使用方法,图片元件的操作比较简单,可以通过双击选择本地磁盘中图片,将图片载入到编辑区,axure会自动提示将大图片进行优化,以避免原型文件过大

提示: 图片可以添加文字内容,需要在元件上点击鼠标右键,从菜单中选择【编辑文本】进入文字编辑状态

2.3 文本

文本元件包括文本标签、文本段落、一级标题、二级标题和三级标题,用来表示页面中的一些文字内容 实际上文本元件也是形状元件,给文本元件添加边框,就变成了矩形元件

文本标签: 使用该文本标签默认不会在画布显示边框

文本段落: 文字输入一行会自动跨行 , 不能跨空格

一级标题: 相比其他标题更大

二级标题: 比三级标题大 比一级标题小

2.4 线段原件

水平线、垂直线。选择水平线或垂直线,可以作为表示页面一些区域分割时使用,比如在两块不同区域之间添加一条水平线,来明显的区分

使用方法:将水平线或者垂直线拖拽到右侧画布中,然后按下 Ctrl 键,将鼠标置于线段末端,进行旋转

2.5 热区

热区是一个透明的元件,通过属性设置就可实现类似超链接的功能。

常用操作:比如在一张图片中的两个位置上添加点击跳转的效果,就可以在这两个位置上放置两个热区,然后为热区添加点击跳转的交互

2.5.1 热区应用

1.可以添加成链接,用作链接跳转,在一定程度上减少工作量

2.跳转到层或区域,比如滑动网页时回到顶部(跳转)

3.可以添加交互,比如翻看网页时,自动加载

4.用作跳转,如果每个标题都需要添加一个跳转链接太繁琐,可以添加一个热区 ,通过热区来达到跳转

案例:

通过热区实现跳转不同页面

三, 表单型元件的应用

表单是需要用户填写的,所以表单型元件都是用于获取用户输入数据的元件

3.1 文本框

用于输入一行文字内容。 比较常见的使用场景是用户登录功能中用户名与密码的输入框

3.2 文本域

文本域,也叫多行文本框,用于大量文字段落的输入

3.3 下拉列表

用于多个选项的单项选择,往往也会有多个下拉

想添加选项, 双击编辑即可

3.4 列表框

直接呈现选项的选择框,可以支持单选或多选

注意:列表框元件与文本域元件在画布中外观一样,但是功能不一样。在交互功能面板中会显示元件的类型,注意分辨

3.5 复选框

用于一个或多个选项的选择,可以选中和取消选中状态

3.6 单选按钮

用于多个选项的单项选择,有些时候可以用下拉列表替代

比如: 个人简历选择男女性别的时候单选按钮只能选择一个, 肯定是不能选择两个的, 那怎么去让它只能选择一个呢. 

右击画布单选按钮----指定按钮单选的组---填写组名称

最后在另外一个单选按钮,右击画布复选框----指定按钮单选的组--下拉选择组名  这样就会默认这两个单选按钮为一组

四,表单案例

4.1 登入

4.1.1 组件

1个矩形   1张图片 1个圆形   4个线段  1个三级标题  2个文本标签  2个文本框  2个图标 

1个主要按钮  2个链接按钮

4.2 个人简历

4.2.1 组成元件

2个矩形    6个文本标签   3个文本框   2个单选  4个下拉列表  2个按钮 1个三级标题  1张图片

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

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

相关文章

mysql EXPLAIN命令的输出列简介

MySQL :: MySQL 8.2 Reference Manual :: 8.8.2 EXPLAIN Output Format explain命令提供了mysql数据库如何执行SQL语句的信息&#xff0c;可以跟 SELECT, DELETE, INSERT, REPLACE, UPDATE, 和 TABLE一起使用。 explain命令可能输出多行&#xff0c;每行涉及一个表 。 先来看…

嵌入式工程师是否需要学历和基础?

今日话题&#xff1a;嵌入式工程师是否需要学历和基础&#xff1f;想要成为一位真正独当一面的嵌入式工程师&#xff0c;不一定需要特定的学历和基础&#xff0c;但需要耐心和时间。通常&#xff0c;至少需要五年的坚定学习和实践。这个过程中&#xff0c;你将面临各种挑战&…

Linux CentOS7 Docker安装Jenkins

1 sudo yum update #确保yum包更新到最新 service network restart #重启网络 2、查询镜像 docker search jenkins 3、拉取镜像 docker pull jenkins/jenkins #拉取镜像 4、创建Jenkins工作目录&#xff0c;并将容器内目录挂载到此目录…

人工智能中的顺序学习:概念、应用和未来方向

一、介绍 人工智能 &#xff08;AI&#xff09; 中的顺序学习是一个关键研究领域&#xff0c;近年来引起了人们的极大兴趣。它指的是人工智能系统从数据序列中学习的能力&#xff0c;其中数据点的顺序至关重要。本文将探讨人工智能中顺序学习的概念、其重要性、应用、方法、挑战…

数字化管理系统:引领企业智能化时代

随着数字化和智能化的风潮席卷而来&#xff0c;企业数字化管理系统成为提升竞争力、提高效率的不可或缺的工具。在服装管理系统、仓储管理系统等方面应用的RFID技术和数字大屏更是为企业带来了前所未有的便利和优势。 数字化管理系统的重要性&#xff1a; 数字化管理系统是企…

CNS0创建交货单没有WBS元素

1、问题 CNS0创建交货单带不出WBS&#xff0c;但是交货单过账之后&#xff0c;又可以读取到WBS。 2、原因 2.1、项目挂料 创建项目挂料时&#xff0c;当物料为通用料&#xff0c;则在网络中挂料时&#xff0c;采购类型为网络预留 当物料为专用料&#xff0c;则在网络中挂料时…

linux中的od命令与hexdump命令

初步解读两个命令 在Linux中&#xff0c;"od"和"hexdump"命令都用于以十六进制和其他格式显示文件的内容。它们提供了对文件进行二进制查看和分析的功能。以下是它们的简要说明&#xff1a; od命令&#xff1a; “od”&#xff08;octal dump&#xff09;…

在javaweb项目中resource目录和webapp目录的区别

resource存放的是一些配置文件&#xff0c;这些文件一般都是与java代码相关的配置文件&#xff0c;比如这里的jdbc配置文件,在java中可以使用这个目录下的文件&#xff0c;不用写全路径 webapp存放的是web的资源文件&#xff0c;如jsp,html,css&#xff0c;js文件,在网页请求会…

并发编程-线程等待唤醒机制

目录 前言 ​编辑 线程等待和唤醒的方法 wait() 方法&#xff1a; notify() 方法&#xff1a; 注意事项和建议&#xff1a; 我的其他博客 前言 程等待唤醒机制是多线程编程中用于线程之间协调和通信的一种机制。在多线程环境中&#xff0c;有时候一个线程需要等待某个条件…

ResourceSat2卫星数据下载

印度5米遥感卫星数据开放下载 简介 印度国家遥感中心( NRSC )于近期开放了ResourceSat2卫星的LISS4传感器的数据下载权限&#xff0c;最高分辨率为5米。此次可供下载的有3个波段&#xff08;近红外/红/绿&#xff09;&#xff0c;下载附带3个GeoTIFF和一个元数据文件&#xf…

OpenCV极坐标变换函数warpPolar的使用

学更好的别人&#xff0c; 做更好的自己。 ——《微卡智享》 本文长度为1702字&#xff0c;预计阅读4分钟 前言 前阵子在做方案时&#xff0c;得了几张骨钉的图片&#xff0c;骨科耗材批号效期管理一直是比较麻烦的&#xff0c;贴RFID标签成本太高&#xff0c;所以一般考虑还是…

大数据技术之Hive(超级详细)

第1章 Hive入门 1.1 什么是Hive Hive&#xff1a;由Facebook开源用于解决海量结构化日志的数据统计。 Hive是基于Hadoop的一个数据仓库工具&#xff0c;可以将结构化的数据文件映射为一张表&#xff0c;并提供类SQL查询功能。 本质是&#xff1a;将HQL转化成MapReduce程序 …

微信小程序使用camera扫码获取相机权限

确保用户隐私指引已经明确使用相机功能 “mp-weixin”: "permission": {"scope.camera": {"desc": "需要使用相机功能&#xff0c;请授权"}}wx.authorize({scope: scope.camera,success(res) {console.log(res, 用户成功授权)// 用户…

在Node.js中MongoDB插入数据的方法

本文主要介绍在Node.js中MongoDB插入数据的方法。 目录 Node.js中MongoDB插入数据使用MongoDB原生驱动插入数据使用Mongoose插入数据 Node.js中MongoDB插入数据 在Node.js中&#xff0c;可以使用MongoDB原生驱动或Mongoose库来连接和操作MongoDB数据库。 以下是在Node.js中使用…

【洛谷算法题】P1422-小玉家的电费【入门2分支结构】

&#x1f468;‍&#x1f4bb;博客主页&#xff1a;花无缺 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! 本文由 花无缺 原创 收录于专栏 【洛谷算法题】 文章目录 【洛谷算法题】P1422-小玉家的电费【入门2分支结构】&#x1f30f;题目描述&#x1f30f;输入格…

医学检验系统LIS源码,C# +.Net+Oracle

LIS是HIS的一个组成部分&#xff0c;通过与HIS的无缝连接可以共享HIS中的信息资源&#xff0c;使检验科能与门诊部、住院部、财务科和临床科室等全院各部门之间协同工作。  体系结构&#xff1a;Client/Server架构 客户端&#xff1a;WPFWindows Forms 服务端&#xff1a;C…

【网络安全】Suspicious DNS Query(可疑的DNS查询)

文章目录 名词解释可能原因分析Action sinkhole在防火墙里面查询Suspicious DNS Query预防Suspicious DNS查询带来的风险推荐阅读 名词解释 “Suspicious DNS Query&#xff08;可疑的DNS查询&#xff09;”通常指的是在网络中检测到的可能具有风险或异常行为的DNS&#xff08…

在国内,现在月薪1万是什么水平?

看到网友发帖问&#xff1a;现在月薪1W是什么水平&#xff1f; 在现如今的情况下&#xff0c;似乎月薪过万这个标准已经成为衡量个人能力的一个标准了&#xff0c;尤其是现在互联网横行的时代&#xff0c;好像年入百万&#xff0c;年入千万就应该是属于大众的平均水平。 我不是…

电子秤ADC芯片CS1237技术资料问题合集

问题11&#xff1a;实际应用中&#xff0c;多个称重传感器应该怎么与ADC连接&#xff1f; 解答&#xff1a;如果传感器是测量同一物体&#xff08;例如&#xff1a;厨房垃圾处理器&#xff09;&#xff0c;一般建议使用并联的方式。则相同类型的信号线连接在一起。对于传感器的…

stateflow 之图函数、simulink函数和matlab函数使用及案例分析

目录 前言 1. 图函数graph function 2.simulink function 3.matlab function 4.调用stateflow中的几种函数方式 前言 对于stateflow实际上可以做simulink和matlab的所有任务&#xff0c;可以有matlab的m语言&#xff0c;也可以有simulink的模块&#xff0c;关于几种函数在…