Android KITKAT 以上实现沉浸式状态栏

作者: lguipeng | 来源:发表于2015-04-15 22:39 被阅读42947次
    • 代码未行,效果先上

    Flyme4.2 Android4.4.4上运行效果
    • 如何实现

    在 [KITKAT][null-link] 之后,Android Window支持了一些新的属性,其中有两个是这样的 .

    WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS
    WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION
    

    正如它们的变量名的意思,使用这两个属性,可以使得状态栏和导航栏变为透明,导航栏指的就是Android下方的三大按键,当然只使用第一个属性也可以达到今天所要完成的效果。下面的示例代码将使状态栏和导航栏变得透明

      @Override
      protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           initWindow();
      }
    
     @TargetApi(19)
     private void initWindow(){
           if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){
               getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
               getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);   
        }
    

    直接运行之后,状态栏直接透明了,但是并不是我们想要的效果,状态栏原本应该占有的位置没了。


    Flyme4.2 Android4.4.4上运行效果

    这个问题也很好解决,在 style theme 添加

    <item name="android:fitsSystemWindows">true</item>
    

    之后我们再运行,却又发现,状态栏的位置出来了,但是。。。

    Flyme4.2 Android4.4.4上运行效果
    实际上,状态栏已经透明了,只是状态栏底下没有颜色呀!
    Google 了之后在 Github 找到了一个开源项目 SystemBarTint ,代码就变成下面这个样子:
       private SystemBarTintManager tintManager;
       @TargetApi(19)
       private void initWindow(){
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){
                getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
                getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
                tintManager = new SystemBarTintManager(this);
                tintManager.setStatusBarTintColor(getColor(R.color.app_main_color));
                tintManager.setStatusBarTintEnabled(true);
            }
        }
    

    运行之后,发现运行效果跟第一张图一样,达到我们想要的效果了。

    跟踪进去查看 SystemBarTint 的源代码,会发现 SystemBarTintManager 的构造方法里面除了获取 ActionBar 的高度等等这些配置之外,还有一个重要的方法 setupStatusBarView

        @TargetApi(19)
        public SystemBarTintManager(Activity activity) {
            Window win = activity.getWindow();
            ViewGroup decorViewGroup = (ViewGroup) win.getDecorView();
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            //省去部分代码...
            if (mStatusBarAvailable) {
                setupStatusBarView(activity, decorViewGroup);
            }
            if (mNavBarAvailable) {
                setupNavBarView(activity, decorViewGroup);
            }
        }
    

    于是接着查看 setupStatusBarView 的代码

    private void setupStatusBarView(Context context, ViewGroup decorViewGroup) {
            mStatusBarTintView = new View(context);
            LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, mConfig.getStatusBarHeight());
            params.gravity = Gravity.TOP;
            if (mNavBarAvailable && !mConfig.isNavigationAtBottom()) {
                params.rightMargin = mConfig.getNavigationBarWidth();
            }
            mStatusBarTintView.setLayoutParams(params);
            mStatusBarTintView.setBackgroundColor(DEFAULT_TINT_COLOR);
            mStatusBarTintView.setVisibility(View.GONE);
            decorViewGroup.addView(mStatusBarTintView);
        }
    

    可以发现这个开源项目能够解决我们的问题的原因在这,就是往 DecorView 加入一个 View, 而在代码中我们将这个 View 的背景设置成 ActionBar 一样的颜色,所以就达到了沉浸式的效果。到这里,基本也就分析完成了。

    • 源代码

    附上源代码地址: Github 源代码 .
    项目是我最近刚建不久的,主要放了一些 Android 方面的练习,最近更新了[RecycleView滚动时隐藏Toolbar和状态栏,类似pocket][null-link] 和 [滑动菜单栏,支持设置左右滑动呼出][null-link]
    [null-link]: chrome://not-a-link

    相关文章

      网友评论

      • 捡淑:mark
      • 你家鹏大大:你好,请问有WebView沉浸式的Demo么?
        你家鹏大大: @r17171709 😂。就是滑动的处理不太一致。好吧。我自己再弄下。
        皮球二二:@你家鹏大大 有区别吗?
      • fe2a5bcdf6ea:问题是用过系统的toast也上移了
        皮球二二:@蹦蹦跳跳真可爱 在contentView的第一个child设置fitSystemWindow
        fe2a5bcdf6ea:@lguipeng 我是在theme里面设置的fits 这个属性
        lguipeng:@蹦蹦跳跳真可爱 那是因为 fitsSystemWindows 在them 中设置了,改成在layout中设置就可以
      • jim1991:楼主你好,我在你的MainActivity最下方添加一个EditText文本输入框,当该输入框获得焦点时,输入法会弹出来,此时界面的整个布局将会被向上平移了,导致整个头部也被推上去了,该如何解决?让头部标题栏和状态栏不被推上去,只是把EditText推上来,只是中间的RecyclerView高度变化?楼主你怎么看,解决了跟我说一下,1036479707@qq.com,谢谢! :clap:
        f66a190500cc:@lguipeng 这个问题我最近也碰到了,用了scrollView,但是发现如果里面还有listview会影响edit的布局变化,最后用了Framelayout,直接把EditText浮在屏幕最下面,和Android百度贴吧一样实现的。请问,您在用scrollView的时候里面有listView吗?如果有请问是怎么解决冲突的?
        lguipeng:@城空丨梦旧 用 ScrollView 包裹, 然后设置 android:windowSoftInputMode="adjustResize"
        99ee2c2b5264:@jim1991 这个问题也困扰了我好久请问解决了吗
      • DamonZh:沉浸式应该就是状态栏和导航栏都被隐藏掉了,整个界面就只有你的app界面。楼主说的这个应该只是改变状态栏和导航栏颜色。个人愚见

      本文标题:Android KITKAT 以上实现沉浸式状态栏

      本文链接:https://www.haomeiwen.com/subject/uiysfttx.html