效果

  android 4.4之后,系统是支持自己定义状态栏和导航栏的。举个最典型的样例就是bilibiliclient了(iOS版本号和android版本号能用两套全然不一样符合各自系统的设计ui,良心啊~),顶部状态栏为粉色,底部导航栏为半透明色:

  

  接着QQ最新的版本号6.2也使用了状态栏透明风格,可是出来的效果在不同版本号。不同手机上,显示的效果真是差异非常大(4.3版本号是无法使用状态栏透明风格的,仅仅是放出来做个对照):

  更新,QQ的6.2.1版本号已经又一次换成蓝色的bar了。

  

————————————————————————————————————

  

————————————————————————————————————

  

————————————————————————————————————

  

————————————————————————————————————

  

  这个我也不知道究竟是怎么适配的,希望有人给解答一下。

实现与分析

API 19~20

  接下来分析一下怎么自己定义状态栏和导航栏,这个在21版本号之前和之后能够使用不同的方式来实现,先看看19~20版本号的适配,状态栏和导航栏透明:

<?xml version="1.0" encoding="utf-8"?

>
<resources>
<style name="Activity_translucent_status_bar" parent="@style/Theme.AppCompat.Light.NoActionBar">
<item name="android:windowTranslucentStatus">true</item>
</style>
<style name="Activity_translucent_navigation_bar" parent="@style/Theme.AppCompat.Light.NoActionBar">
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
</resources>

  从代码看到,状态栏透明主要是使用android:windowTranslucentStatus属性,导航栏透明主要是使用android:windowTranslucentNavigation属性。当这个属性设置为true之后,系统栏会变成半透明,而且应用的内容区域也会扩充到系统栏中:

  

这样目的是达到了,可是效果肯定是不行的,怎么解决呢?来学习一下bilibili和QQ的布局就了解了:

  

  

从图片中能够非常清楚的看到bilibili和QQ都是在顶部放置了一个和status bar一样高度,自己定义颜色的view。status bar高度的获取方式:

int id = getResources().getIdentifier("status_bar_height", "dimen", "android");
int height = getResources().getDimensionPixelOffset(id);

这样思路就非常清楚了。全部的activity继承自一个基类activity,基类activity的布局文件进行相似的处理,最后也是能够达到和bilibiliclient一样的效果(吐槽一下华为p6的状态栏黑色阴影真心难看):

  

  github上也有相关库能够实现一样的效果。可是原理都差点儿相同。

API 21~++

  21版本号和21版本号之后,系统添加了很多其它的选项用来提供用户改动颜色:

  

所以能够通过android:colorPrimaryDark属性来使状态栏变成所需的颜色,android:navigationBarColor属性来改变导航栏所须要的颜色:

<item name="android:colorPrimaryDark">@color/bar_color</item>
<item name="android:navigationBarColor">@color/half_black_transparent</item>

最后效果:



貌似这个导航栏是无法使用透明颜色的,那么导航栏透明的方案这么做是行不通的。仅仅能继续使用19版本号的方案了:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Activity_translucent_status_bar" parent="@style/Theme.AppCompat.Light.NoActionBar">
<item name="android:colorPrimaryDark">@color/bar_color</item>
</style>
<style name="Activity_translucent_navigation_bar" parent="@style/Theme.AppCompat.Light.NoActionBar">
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
</resources>

最后也当然须要在顶部加入一个status bar高度的自己定义view了,最后不同版本号,不同机型适配效果:





  适配效果还算能够。假设有其它更好解决方法的。指点一下。谢谢~

源代码

  https://github.com/zhaozepeng/Android_framework

android 自己定义状态栏和导航栏分析与实现的更多相关文章

  1. Android 5.0状态栏和导航栏

    Material Design推出之后,app中也開始沿用这样的风格 今天来说一下状态栏颜色设置,在4.4的时候推出了透明状态栏和导航栏.在不使用第三方库的情况下,4.4还是没有全然解决存在actio ...

  2. Android隐藏状态栏、导航栏

    Android隐藏状态栏.导航栏 private void hideStatusNavigationBar(){ if(Build.VERSION.SDK_INT<16){ this.getWi ...

  3. Android 4.4 沉浸式透明状态栏与导航栏

    Android 系统自4.2 開始 UI 上就没多大改变,4.4 也仅仅是添加了透明状态栏与导航栏的功能,如图 那么如今我就来给大家解说下怎样使用这个新特性,让你的 app 尾随潮流,当然假设你不在乎 ...

  4. 兼容 Android 4.4 透明状态栏与导航栏

    http://www.apkbus.com/Android-163388-1-1.html?_dsign=73d41229 android 系统自4.2 开始 UI 上就没多大改变,4.4 也只是增加 ...

  5. Android状态栏和导航栏

    1.隐藏状态栏或导航栏 View decordView = getWindow().getDecorView(); /*SYSTEM_UI_FLAG_HIDE_NAVIGATION和SYSTEM_UI ...

  6. App开发流程之状态栏和导航栏

    记录状态栏和导航栏的设置和控制,统一在基类视图控制器中完成. 状态栏. 状态栏高度为20,iOS7以后背景完全透明. 样式枚举如下: typedef NS_ENUM(NSInteger, UIStat ...

  7. iphone状态栏,导航栏,标签栏高度一览表

    iphone状态栏,导航栏,标签栏高度一览表   设备分辨率 状态栏高度 导航栏高度 标签栏高度 iPhone6 plus  1242×2208 px 60px  132px  147px iPhon ...

  8. iOS获取状态栏和导航栏尺寸(宽度和高度)

    iPhone开发当中,有时需要获取状态栏和导航栏高度.宽度信息,方便布局其他控件.下面介绍一下如何获取这些信息: // 状态栏(statusbar) CGRect rectStatus = [[UIA ...

  9. iOS 状态栏、导航栏、工具栏、选项卡大小

    1.状态栏状态栏一般高度为20像素,在打手机或者显示消息时会放大到40像素高,注意,两倍高度的状态栏在好像只能在纵向的模式下使用.如下图用户可以隐藏状态栏,也可以将状态栏设置为灰色,黑色或者半透明的黑 ...

随机推荐

  1. ArcGIS api for javascript——查询,然后单击显示信息窗口

    描述 本例展示如何配置查询任务为示例的工作流程: 1.用户单击一个要素来加亮显示. 2.用户再一次单击要素来查看属性信息的 InfoWindow. 本例查询USA州,因此ESRI_StateCityH ...

  2. windows下laravel5安装

    第一步:安装composer    网上教程非常多,自行百度 第二步:使用composer create-project laravel/laravel learnlaravel5 5.0.22   ...

  3. [Recompose] Stream a React Component from an Ajax Request with RxJS

    Loading data using RxJS is simple using Observable.ajax. This lesson shows you how to take the ajax ...

  4. ios学习:swift中实现分享到微博、facebook,twitter等

    在swift中打开分享功能原来是如此的简单. 1.首先须要 import Social 2.在分享button事件以下 var controller:SLComposeViewController = ...

  5. ORA-01555错误总结(二)

    这篇文章紧接着上一篇"ORA-01555错误总结(一)".主要描写叙述延迟块清除导致的ORA-01555错误. 以下是一些简介(上一遍已经介绍过) ORA-01555错误是一种在o ...

  6. 多client并发登录

    //LoginClient.java package mySocket; import java.io.BufferedReader; import java.io.InputStreamReader ...

  7. vim使用(二):经常使用功能

    1. vim经常使用功能 vim的经常使用功能.包含块的选择.复制,多文件的编辑.多窗体等功能. 2. vim块选择 块选择是将文档中的一块能够选择复制,粘贴,不用整行的处理. 按下 v , V . ...

  8. C/C++(C++类型增强)

    C++类型增强 类型检查更严格 把一个const类型的指针赋给非const类型的指针.c语言中可以通的过,但是在c++中则编不过去 const int a = 10; a = 100;//const修 ...

  9. 关于springmvc重定向后Cannot create a session after the response has been committed问题

    首先先上代码吧,我在用springmvc进行response.sendRedirect(url);操作后报了Cannot create a session after the response has ...

  10. 及格的产品vs优秀的产品

    类似的产品,做了同样的一个功能,但是,我们还是可以很明显的感受到不同,这种不同我们常常把他叫做「用户体验」. 来看看2组类似产品相似功能的设计: 识别到歌名vs还可以滚动展示歌词 在很早的时候就存在一 ...