玩转沉浸模式&全屏显示

简介

System Bar,系统状态栏,用来展示通知、表现设备状态和完成设备导航的屏幕区域。通常上来说,系统栏(System bar)包括状态栏和导航栏,一般都是与程序同时显示在屏幕上的。但有些场景,譬如视频播放、小说阅读等,可以通过暂时隐藏系统栏,来为用户提供一个更加专注的体验环境。
设置隐藏、显示状态栏的的操作,系统提供了两种方式来实现:
Window#setFlagsView#setSystemUiVisibility (Android 3.0开始提供),但要用好这两个API ,需要先熟悉对应的Flag 的含义才能够用的得心应手。这些Flag的介绍可以参考之前的文章:
System UI Flag
Window Flag 含义
接下来会详细介绍一下,不同场景的诉求和对应的Flag 使用。

不同场景的诉求和实现

透明状态栏

为了追求更好的UI体验效果,一般UI设计师都有诉求,希望状态栏的部分也能展示很内容部分同样的颜色或者背景,具体的实现方式如下:

getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);


这种实现方式,有一缺陷,就是内容部分被状态栏盖住了。解决方式有两种:
1)、setFitsSystemWindows(true)
2)、根部容器设置一个padding
最终的显示效果是:

注意,setFitsSystemWindows会调整自己的 padding 用于避开系统控件,但是会带来其他的影响,因为其实现原理是系统在特定的时机从根View派发WindowInsets,一旦有一个View 的 fitSystemWindows 设置为 true,它就会根据WindowInsets来调整自己的 padding,并消耗WindowInsets,不在向下分发 WindowInsets,WindowInsets的派发过程也就结束。
需要注意的是这样子设置会让View原本的padding失效。

全屏模式

一般用于小说阅读或者视频播放场景,具体的设置是:

        int flag = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN;
        mContentView.setSystemUiVisibility(flag);

这里具体介绍下,在小说和视频场景的详细实现(点击内容区域,能够呼出或者隐藏系统栏),

  • 小说
    一般都会增加View.SYSTEM_UI_FLAG_IMMERSIVE,除非是用户的自动手势呼气导航栏或者状态栏,否则其他操作仍会处于隐藏状态。
private void enterFullScreen() {
        isFullScreen = true;
        int flag = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                | View.SYSTEM_UI_FLAG_IMMERSIVE;
        mContentView.setSystemUiVisibility(flag);
    }

    private void hideFullScreen() {
        isFullScreen = false;
        mContentView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                |View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                |View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
    }


  • 视频播放
    一般都会增加View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY,用户唤起之后,如果无其他操作,会自动隐藏。
    private void enterFullScreen() {
        isFullScreen = true;
        int flag = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY;
        mContentView.setSystemUiVisibility(flag);
    }

    private void hideFullScreen() {
        isFullScreen = false;
        mContentView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                |View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                |View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
    }

呼出工具栏场景,这里没有兼容适配导航栏和状态栏的高度。只需要根据对应的高度,设置对应的padding 即可。这里就不再额外处理。

参考链接

1、http://hukai.me/android-training-course-in-chinese/ui/system-ui/index.html
2、https://developer.android.com/training/system-ui/immersive.html
3、https://blog.csdn.net/lmj623565791/article/details/48649563

你可能感兴趣的:(Android开发)