android 沉浸式设计方案总结

沉浸式设计已经应用到几乎所有的app,但是各种百度出来的资料都是不全面的,无奈之下只好自己从头总结一番,包括的内容有:
- 4.4以及5.0以上各种情况解决方案
- 设置状态栏黑色字体

修改状态栏、导航栏颜色

4.4实现方案

values-v19/style.xml:

<style name="TranslucentTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
</style>

4.4的运行效果
这里写图片描述

布局占了整个屏幕,根布局里加上android:fitsSystemWindows=”true”后效果
这里写图片描述
系统自动给根布局加了一个padding,可以看到显示的还是根布局的颜色。但是实际项目不推荐这么做,实际使用在顶部和底部加一个View来占位以及修改状态栏和导航栏的颜色,通过代码来实现,省下在每个布局里添加。

         getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
        setContentView(R.layout.activity_main);
        // 获得状态栏 导航栏高度
        int statusResourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
        float statusHeight = getResources().getDimensionPixelSize(statusResourceId);
        int navigateResourceId = getResources().getIdentifier("navigation_bar_height", "dimen", "android");
        float navigateHeight = getResources().getDimensionPixelSize(navigateResourceId);
        ViewGroup decorView = (ViewGroup) getWindow().getDecorView();
        //添加状态栏
        View statusBar = new View(this);
        statusBar.setBackgroundColor(0xff00ff00);
        FrameLayout.LayoutParams statusP = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) statusHeight);
        statusBar.setLayoutParams(statusP);
        statusP.gravity = Gravity.TOP;
        decorView.addView(statusBar, statusP);
        //添加导航栏
        View navigateBar = new View(this);
        navigateBar.setBackgroundColor(0xff00ff00);
        FrameLayout.LayoutParams naviP = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) navigateHeight);
        navigateBar.setLayoutParams(naviP);
        naviP.gravity = Gravity.BOTTOM;
        decorView.addView(navigateBar, naviP);
        //设置padding
        ViewGroup parent = (ViewGroup) decorView.findViewById(android.R.id.content);
        ViewGroup root = (ViewGroup) parent.getChildAt(0);
        if (root != null) {
            root.setFitsSystemWindows(true);
            root.setPadding(root.getPaddingLeft(), root.getPaddingTop(), root.getPaddingRight(), root.getPaddingBottom() + navigateResourceId);
        }

注意setContentView的位置,这样写的效果。

这里写图片描述

以上可以解决4.4版本的绝大部分需求,同样可以按照项目实际情况来自己定制一个。

5.0及以上实现方案

1.直接修改状态栏和导航栏颜色
5.0修改状态栏颜色十分简单,主题里定义了很多颜色,直接修改就可以实现。
进入style.xml右上角就会弹出通知
这里写图片描述
点击Open editor就会进入主题编辑页面
这里写图片描述
这里直接找到对应的色块进行修改就能实现效果,注意很多是有api限制的,需要看仔细。
代码实现主要调用这两个api就可以直接修改了

    getWindow().setStatusBarColor();
        getWindow().setNavigationBarColor();

这里设置导航栏全透明在主题里设置会出现一个错位的现象,我也不知道是为什么,如果要把导航栏设置全透明最好在代码里设置

        Window window = getWindow();
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
        window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        window.setNavigationBarColor(Color.TRANSPARENT);

2.实现全透明状态栏
修改主题
values-v21/style.xml:

<style name="TranslucentTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:windowTranslucentStatus">false</item>
    <item name="android:windowTranslucentNavigation">true</item>
    <!--Android 5.x开始需要把颜色设置透明,否则导航栏会呈现系统默认的浅灰色-->
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

5.0及以上的运行效果
这里写图片描述

代码实现

    getWindow().setStatusBarColor(Color.TRANSPARENT);
        getWindow().getDecorView()
                   .setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);

dialog的透明实现,需要5.0以上要多加一个属性。


private void setTranslucentStatus() {
        if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {//5.0 全透明实现
            Window window = getWindow();
            window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                    | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
            window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            window.setStatusBarColor(Color.TRANSPARENT);
        } else {//4.4 全透明状态栏
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        }
    }

浅色状态栏解决方案

浅色状态栏的问题就是状态栏的字体会看不清,这时候就需要把状态栏的自己变为黑色,这个是6.0才有的api。
values-v23/style.xml:

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

代码实现:

getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);

6.0一下MIUI和Flyme提供了修改方法

 /**
     * 设置状态栏字体图标为深色,需要MIUIV6以上
     *
     * @param window 需要设置的窗口
     * @param dark   是否把状态栏字体及图标颜色设置为深色
     * @return boolean 成功执行返回true
     */
    public static boolean MIUISetStatusBarLightMode(Window window, boolean dark) {
        boolean result = false;
        if (window != null) {
            Class clazz = window.getClass();
            try {
                int darkModeFlag = 0;
                Class layoutParams = Class.forName("android.view.MiuiWindowManager$LayoutParams");
                Field field = layoutParams.getField("EXTRA_FLAG_STATUS_BAR_DARK_MODE");
                darkModeFlag = field.getInt(layoutParams);
                Method extraFlagField = clazz.getMethod("setExtraFlags", int.class, int.class);
                if (dark) {
                    extraFlagField.invoke(window, darkModeFlag, darkModeFlag);//状态栏透明且黑色字体
                } else {
                    extraFlagField.invoke(window, 0, darkModeFlag);//清除黑色字体
                }
                result = true;
            } catch (Exception e) {

            }
        }
        return result;
    }
/**
     * 设置状态栏图标为深色和魅族特定的文字风格
     * 可以用来判断是否为Flyme用户
     *
     * @param window 需要设置的窗口
     * @param dark   是否把状态栏字体及图标颜色设置为深色
     * @return boolean 成功执行返回true
     */
    public static boolean FlymeSetStatusBarLightMode(Window window, boolean dark) {
        boolean result = false;
        if (window != null) {
            try {
                WindowManager.LayoutParams lp = window.getAttributes();
                Field darkFlag = WindowManager.LayoutParams.class
                        .getDeclaredField("MEIZU_FLAG_DARK_STATUS_BAR_ICON");
                Field meizuFlags = WindowManager.LayoutParams.class
                        .getDeclaredField("meizuFlags");
                darkFlag.setAccessible(true);
                meizuFlags.setAccessible(true);
                int bit = darkFlag.getInt(null);
                int value = meizuFlags.getInt(lp);
                if (dark) {
                    value |= bit;
                } else {
                    value &= ~bit;
                }
                meizuFlags.setInt(lp, value);
                window.setAttributes(lp);
                result = true;
            } catch (Exception e) {

            }
        }
        return result;
    }

使用这两个方法可以将状态栏的字体设置为深色。

总结

沉浸式设计的大多数情况都已经列举了,基本可以满足需求,网上还有不少的解决方案,其实完全可以自己写一个工具类来实现功能。Ok,文章就到这里了~~

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值