如何使用高扩展组件制作APP原型的标签栏?

news2024/11/30 6:57:15

原型项目中的组件(亦称元件、控件),是指通过基础图层拼装而成,可供用户进行交互或用于展示复杂内容的元素。

在原型设计工作中,组件的使用是非常重要的部分,其不仅关乎项目内容的呈现,更会影响编辑操作效率。

作为一款高效易用的在线原型设计工具,摹客RP内置了丰富多样的预设组件,并且这些组件全都具有极高的扩展性,能极大地提升产品原型制作效率,现在就一起来看看吧。

什么是高扩展组件?

高扩展组件具有以下几个特性:

  • 自带交互特性:摹客RP中的预设组件,都自带交互属性,无需添加任何复杂的设置,就能呈现出真实的动态效果。无论是点击切换列表选项、对下拉菜单进行选择、对滑块进行拖动,都能轻松实现。

 

  • 高自由度的编辑方式:摹客RP的预设组件,支持非常便捷的内容编辑及样式编辑。只需双击组件,就能在内容编辑窗口中对选项完成新增、删除、编辑、排序、设置默认选中项等操作。

 

  • 支持扩展属性编辑:在属性面板中,除了可以调整边框、填充等常用属性外,每个组件还支持不同的扩展属性,帮助大家设置完善丰富的样式效果。

 

高扩展组件的必要性

了解了什么是高扩展组件,那么高扩展组件在我们的日常工作中具体能发挥什么作用呢?

  • 快速创建项目:摹客RP提供的高扩展组件库使你能在任何时候找到所需要的组件,快速完成项目的搭建,并且随心编辑属性样式,非常方便地呈现完善的内容与精美的效果。

  • 极大提升设计效率:预设组件意味着不用手动拼装,自带的交互特性更是免去了复杂的交互设置,便捷的文本内容及属性样式调整同样有助于显著地节约设计时间。

  • 遵循设计规范:摹客RP的高扩展组件的各类特性都是参考通用的各类组件的样式、交互规范来提供的,更符合行业的通用要求。使用高扩展组件,就不用再担心组件使用不规范,设计质量受影响的问题了。

摹客RP的高扩展组件有哪些?

摹客RP中的预设组件类型多样,数量丰富。无论是制作网页项目、移动项目、线框原型还是中高保真界面设计,摹客RP都能为你提供便利。下面我们一起来看看摹客RP有哪些高扩展组件吧!

  • 常用分类的组件:在此分类中,你可以找到搭建界面中经常用到的各种组件,从简单的复选框、开关、到下拉框、选项卡再到表格、导航菜单、时间选择器、轮播图等等组件,全部都可以找到。拖拽即可添加交互,方便快捷。

 

  • 图表组件:对于经常制作后台项目的小伙伴,摹客RP自带的图表组件更会让你的设计效率飙升。多种类型的图表组件,每一个都支持超高自由度的数据编辑,并且提供丰富的元素结构设置项。在演示时,图表组件同样自带非常细致的载入效果及可交互的数据查看效果。

 

  • 批注组件和各类常用的形状组件:这一类组件能够帮助大家在为原型项目添加文档说明、绘制流程图等内容时提供极大的便利。

 

组件库对比 -- 摹客RP vs Axure

在选选择原型工具的时候,不少小伙伴会第一时间去熟悉并比较组件库,接下来我们看看摹客RP组件库与Axure的对比:

  • 摹客RP的预设组件数量更多。Axure的预设组件库,只直接提供了相对基础的常用组件,而并没有从国内用户的使用习惯出发,提供足够的适合不同项目需求的组件,比如图表等高频使用的组件则是完全缺失的。而摹客RP中,你可以轻松地找到各类所需的组件,更快地完成设计工作。

  • 摹客RP的组件编辑自由度更高。相较于Axure的预设组件,摹客RP组件所提供的扩展属性更为丰富,能够更广泛地覆盖大家的使用场景,并且编辑效率更高。

  • 摹客RP的组件操作更便捷。除了基础的文本编辑、样式编辑,摹客RP所提供的拖拽式交互设置,更适用于带有多个选项的复合组件。比起Axure需要选中选项,一个个点击添加按钮、选择目标的方式,摹客RP拖拽交互链接点,快速选取交互目标的操作,让日常的组件交互设置,快了不止一点点!

如何使用高扩展组件制作APP原型的标签栏?

APP原型标签栏是很常见的UI界面元素,它的核心功能在于导航App界面核心功能,通常位于屏幕的底部,通常的样式是以图文形式展示,也有文本标签页和图标标签页,且具有相对完备的交互效果:

  • 进入页面后,默认选中并展示第一个标签对应的页面;

  • 点击任意标签,跳转至该标签对应的界面,并且该标签处于选中状态;

  • 有且仅有一个标签页处于选中状态;

  • 标签页在页面滑动时,通常固定展示在底部,不跟随页面滚动。

APP标签页在手机运用上随处可见,我们常用的微信、淘宝、QQ等界面均有:

 

那么,如何快速制作一个App标签页呢?推荐使用摹客RP的高扩展性组件,我们一起看看吧~

第一步:选择组件在左侧组件库中,选择适用于自己设计需求的组件,拖拽至画板即可,这里我们选择图文选项卡;Tip! 选项卡、分段控件等组件都支持制作APP标签噢

 

第二步:编辑图文选项卡

  • 替换图标:双击图文选项卡>在弹窗内选中图标>在左侧图标库里选择图标>点击替换;

  • 编辑文本:双击图文选项卡>在弹窗内双击文本>编辑文本替换;

TIP! 可在弹窗内点击+号新增选项标签;点击箭头移动选项标签顺序;点击垃圾桶删除选项标签。

 

第三步: 设置组件交互双击图文选项卡>拖拽交互点至想要跳转的页面>设置“触发”“效果”“动效”和“时长”,即可完成交互设置;

 

第四步:编辑属性样式选中图文选项卡>在右侧属性面板中设置图标和文本的“颜色”、“样式”等属性,即可完成APP标签栏的属性编辑。

 

简单几步,就可以制作一个APP原型中标签栏的内容、样式及交互设置,快速完成界面搭建与交互设计。摹客RP中还有导航菜单、树组件、表格等更多高级完善的组件,每一个都能够大大提高你的设计效能,赶紧来试试吧!

下载地址:

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

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

相关文章

网络货运平台源码 管理平台端+司机端APP+货主端APP源码

网络货运平台系统源码,网络货运平台源码 管理平台端司机端APP货主端APP 遵循政策要求的八项基本功能,结合货主、实际承运人、监管方等多方业务场景,构建人、车、货、企一体的标准化网络货运平台系统。具有信息发布、线上交易、全程监控、金融…

网络安全工程师能拿高薪的秘密!

网络安全是一门具有很强实践性的学科,但是网络安全传统过程对实践能力培养环节比较薄弱,缺少适应新需求的实践与创新平台。所以,很多网络安全专业的学生学习的基本都是理论知识,而最重要的实战能力薄弱。仅仅只会一点基础的专业知…

景区虚拟人智能互动导览提升客户服务体验

数字化浪潮下,文旅产正积极拥业数字化转型。虚拟数字人作为元宇宙的交互入口,其在文旅产业中的应用,对文旅产业的发展具有非常重要的意义。将超写实虚拟人化身为景点讲解员有哪些好处呢? 视觉冲击力更强,吸引眼球 超写实虚拟人的…

jvm之JMX

写在前面 本文来看先jmx相关内容。 1:jmx介绍 jvm在运行的过程中有很多的信息,比如堆内存,线程数,加载的类信息,CPU的使用量等,如果我们想要将这些信息暴漏让外界获取,该怎么做呢?此时就需要…

springAop原理分析-动态代理对象创建过程分析

概念 AspectJ Aspect 切面(由多个切点组成,多个点组成面) 启用AspectJ支持后,Spring 会自动检测出在应用程序上下文中定义的任何 Bean,如下使用Aspect 定义的一个切面示例。 package org.xyz; import org.aspectj.…

STM8、STM8S003F3P6 实现PWM控制电机HAS10227

背景 有个项目需要控制一台风机的转速,使用STM8S003F3P6 输出PWM控制,这里就详细记录一下调试记录 原理图 原理图比较简单,电机接口CN3 电机接口原理图 与MCU管脚连接位置如下图 首先我们要明白电机的原理 电机 简单来说就是 实现电能与…

闲置手机建站 - 安卓Termux+Hexo搭建属于你自己博客网站【cpolar实现公网访问】

文章目录 1. 安装 Hexo2. 安装cpolar内网穿透3. 公网远程访问4. 固定公网地址 Hexo 是一个用 Nodejs 编写的快速、简洁且高效的博客框架。Hexo 使用 Markdown 解析文章,在几秒内,即可利用靓丽的主题生成静态网页。 下面介绍在Termux中安装个人hexo博客并…

助力工业物联网,工业大数据之一站制造业务主题划分【十三】

文章目录 01:一站制造业务主题划分02:一站制造业务维度设计03:一站制造业务主题维度矩阵 01:一站制造业务主题划分 目标:掌握一站制造的主题域及主题的划分实施 来源 主题域划分:业务或者部门划分 业务&am…

PHP基于xlswriter支持无限表头层级Excel导出

本章介绍基于PHP扩展xlswriter的Vtiful\Kernel\Excel类可以支持无限层级的复杂表头导出! 废了九牛二虎之力,终于把这个功能类写完了…后续会持续更新优化 准备xlswriter扩展 windows系统: 到PECL网站下载符合自己本地PHP环境的ddl文件下载地…

Java内部类(成员内部类、静态嵌套类、方法内部类、匿名内部类)

文章目录 一、内部类的共性二、为什么需要内部类三、静态内部类(静态嵌套类)四、成员内部类五、局部内部类(方法内部类)六、匿名内部类 Java 类中不仅可以定义变量和方法,还可以定义类,这样定义在类内部的类…

WSL2+windows terminal

WSL2的安装与使用-Windows与Linux双系统的新选择 既要使用Windows系统满足日常生活,协作办公,又要使用Linux系统满足开发工作,双系统来回重启好麻烦,双主机成本高,远程服务器好多限制,WSL也许是更好的解决…

“智慧赋能 强链塑链”——打造电力特色智慧供应链体系

构建业务数智化、资源集约化、运营一体化、发展绿色化的智慧供应链体系,是电力企业实现智慧供应链建设的使命和目标。同时,在国内外双循环、一带一路、建立统一大市场的政策背景推动下,企业经营和居民生活对电力的需求仍然强劲并持续增长&…

Seata AT模式源码解析一(Seata Server端启动流程)

文章目录 启动类 ServerSessionHolder初始化DefaultCoordinator初始化初始化NettyRemotingServer 启动类 Server seata-server的入口类在Server类中,源码如下: public class Server {/*** The entry point of application.** param args the input arg…

Intel Realsense D405 在Ubuntu18.04下使用kalibr标定

目录 一. 在ubuntu下使用kalibr标定realsense_ros的安装总结下面是标定步骤 一. 在ubuntu下使用kalibr标定 在Realsense官网上librealsense现在D405只接受ROS2下的环境(相机确实很新) 在ROS1下我想到了改设备ID号的方式进行标定 这里需要注意libreals…

蓝桥杯并查集总结

本文先是给出三篇并查集原理解释文章链接,又提供了python代码模版;而后给出了一份蓝桥杯并查集的题单,并附有部分题目及其求解思路、代码。 目录部分 并查集原理 python代码 并查集题单 蓝桥幼儿园 题目描述 输入描述 输出描述 输入…

ERP有哪些系统?运用在哪些行业?

国内目前市面上ERP系统五花八门,但能真正快速匹配企业业务,且可以进行快速迭代二次开发的系统并不多见。 所以在选择ERP系统的时候可以参考下面这张表格中的内容: 目前常见的ERP软件大概可以分为三大类: ① 标准ERP应用&#xf…

白银实时价格应该在最适合的地方下注

小时候我们看战争片,总是发现主角们带兵打仗,战无不胜,偶尔有一场大的失利,但是总是能耐化险为夷,逢凶化吉,甚至最后成功反扑、反败为胜。后来小编一琢磨,发现,其实这些将才们打仗&a…

如何使用C++ 在Word文档中创建列表

列表分类是指在Word文档中使用不同格式排序的列表,来帮助我们一目了然地表达出一段文字的主要内容。比如,当我们描述了某个主题的若干点,就可以用列表把它们一一表达出来,而不是写成完整的段落形式。同时,列表也可以帮…

如何查看mysql里面的锁(详细)

通过查询表统计信息查看 information_schema库下相关事务表和锁相关信息表介绍innodb_trx存储了当前正在执行的事务信息trx_id:事务ID。trx_state:事务状态,有以下几种状态:RUNNING、LOCK WAIT、ROLLING BACK 和 COMMITTING。trx…

各位自学网络安全的同学,你们的学习路线真的对吗

最近在知乎上看到很多问题,都是小白想要转行网络安全行业咨询学习路线和学习资料的,作为一个培训机构,学习路线和免费学习资料肯定是很多的。机构里面的不是顶级的黑阔大佬就是正在学习的同学,也用不上这些内容,每天都…