Android官方底部Tab栏设计规范

简介: 上一篇《仿微信底部Tab栏》中粗略的讲了下底部Tab栏的封装,不少同学在实际运用中发现了一些问题,比如我demo中的title用了actionbar,所以如果新建的Activity的Theme...

上一篇《仿微信底部Tab栏》中粗略的讲了下底部Tab栏的封装,不少同学在实际运用中发现了一些问题,比如我demo中的title用了actionbar,所以如果新建的Activity的Theme不包含actionbar就回出现空指针;再比如假如底部的Tab对应的并不全都是Fragment,而是一部分Fragment,一部分Activity,就不适用了,但办法总比困难多,这个也是可以解决的;还有一个很常见的需求,就是底部有些Tab可能会有个小红点,之前的Demo并没有把这些问题包含进去,后续有时间再优化,今天来介绍下Google官方的Bottom navigation bars。

首先官方并没有一个叫Bottom navigation bars的控件,但是却出了一套关于Bottom navigation bars的标准,可见官方并不推荐把APP设计成这个样子。如果你非要设计成底部Tab栏的方式,我们也不横加干涉,我出一套标准,参照我的标准来,但官方不提供控件支持,这大概就是Google的内心独白了。

下面我们看看Bottom navigation bars的设计标准吧。

位置

可以放在底部,也可以放在侧边栏。一般是APP的首页。
这里写图片描述
这里写图片描述

Tab个数

(√)推荐底部可以放置3到5个。

这里写图片描述
这里写图片描述
(×)下面这种2个或者6个是不推荐使用的。

这里写图片描述
这里写图片描述

Icons and text

When the view is in focus, display that view’s icon and text label
When there are only three actions, display both icons and text labels at all times
If there are four or five actions, display inactive views as icons only
选中的Tab同时显示icon和text。
如果只有三个Tab,无论选中未选中,一直显示icon和文字。
如果有四到五个Tab,选中的Tab显示文字和icon,未选中的Tab只显示icon。

颜色

(√)推荐选中的图标或者文字为APP的主色调,如果Tab栏本身就是彩色,推荐黑色和白色作为图标或者文字。

这里写图片描述

这里写图片描述
(×)彩色图标不推荐使用

这里写图片描述
这里写图片描述

文字

文字要求言简意赅

这里写图片描述

(×)这样都是不推荐的

这里写图片描述
这里写图片描述
这里写图片描述

尺寸

Bottom navigation bars的高度推荐为56dp,icon的尺寸为24*24,这种Google一般推荐使用8的倍数。选中tab的字体大小为14sp,未选中为12sp。

这里写图片描述

这里写图片描述
以上就是相关的规范,具体的详细内容大家可以看这里,但说了这么多,这么炫酷高颜值的Bottom navigation bars哪里有呢,官方又没有控件,但是github上有啊。

先上几张图,大家随意感受下。

这里写图片描述

这里写图片描述

这里写图片描述
有没有很高颜值,很炫酷。

使用方法也很简单:

Step 1. Add the JitPack repository to your build file Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {

maven { url “https://jitpack.io” }
}
}
Step 2. Add the dependency
dependencies { compile ‘com.github.RoyWallace:BottomNavigationBar:v0.1’}

Step 3
include 布局

具体大家可以看这里。。。

相关文章
|
Android开发
Android 使用ViewPager实现手动左右切换页面和底部点点跟随切换效果
Android 使用ViewPager实现手动左右切换页面和底部点点跟随切换效果
202 0
|
5月前
|
XML Android开发 数据格式
Android 中如何设置activity的启动动画,让它像dialog一样从底部往上出来
在 Android 中实现 Activity 的对话框式过渡动画:从底部滑入与从顶部滑出。需定义两个 XML 动画文件 `activity_slide_in.xml` 和 `activity_slide_out.xml`,分别控制 Activity 的进入与退出动画。使用 `overridePendingTransition` 方法在启动 (`startActivity`) 或结束 (`finish`) Activity 时应用这些动画。为了使前 Activity 保持静止,可定义 `no_animation.xml` 并在启动新 Activity 时仅设置新 Activity 的进入动画。
147 12
|
5月前
|
存储 数据库 Android开发
🔥Android Jetpack全解析!拥抱Google官方库,让你的开发之旅更加顺畅无阻!🚀
【7月更文挑战第28天】在Android开发中追求高效稳定的路径?Android Jetpack作为Google官方库集合,是你的理想选择。它包含多个独立又协同工作的库,覆盖UI到安全性等多个领域,旨在减少样板代码,提高开发效率与应用质量。Jetpack核心组件如LiveData、ViewModel、Room等简化了数据绑定、状态保存及数据库操作。引入Jetpack只需在`build.gradle`中添加依赖。例如,使用Room进行数据库操作变得异常简单,从定义实体到实现CRUD操作,一切尽在掌握之中。拥抱Jetpack,提升开发效率,构建高质量应用!
84 4
|
4月前
|
监控 开发工具 Android开发
结合GB/T28181规范探讨Android平台设备接入模块心跳实现
本文介绍了GB28181标准中的状态信息报送机制,即心跳机制,用于监控设备与服务器间的连接状态。根据国标GB/T28181-2016,设备在异常时需立即发送状态信息,在正常状态下则按固定间隔(默认60秒)定期发送。若连续三次(默认值)未收到心跳,则视为离线。文章展示了在Android平台的GB28181设备接入模块(SmartGBD)中,如何调整心跳间隔为20秒及超时次数为3次,并给出了心跳消息的示例和异常处理代码片段。对于希望深入了解或遇到问题的开发者,作者提供了进一步交流的机会。
|
5月前
|
Android开发 UED
Android采用Scroller实现底部二楼效果
Android采用Scroller实现底部二楼效果
44 0
Android采用Scroller实现底部二楼效果
|
6月前
|
Android开发 UED
|
6月前
|
XML API Android开发
android上FragmentTabHost实现自定义Tab Indicator
android上FragmentTabHost实现自定义Tab Indicator
39 1
|
7月前
|
XML Java Android开发
Android Studio App开发之实现底部标签栏BottomNavigationView和自定义标签按钮实战(附源码 超详细必看)
Android Studio App开发之实现底部标签栏BottomNavigationView和自定义标签按钮实战(附源码 超详细必看)
713 0
|
7月前
|
安全 数据处理 Android开发
安卓隐私权政策和Google Play规范更新
【4月更文挑战第14天】谷歌针对安卓平台的隐私权政策和Google Play规范进行重要更新,强化用户隐私保护和安全标准。新政策强调最小化数据收集,要求开发者明确告知用户敏感数据用途,并限制不必要的后台数据处理。Google Play规范更新要求应用详述数据收集方式,增加安全审查机制,确保无恶意代码。开发者面临调整,但有机会提升应用安全标准,赢得用户信任。用户数据安全得到提升,移动生态系统将更健康、可持续。
148 1
|
7月前
|
JSON Android开发 数据格式
Android框架-Google官方Gson解析,android开发实验报告总结
Android框架-Google官方Gson解析,android开发实验报告总结