Pantalla completa de Android y pantalla inmersiva

En el desarrollo de aplicaciones, con el fin de proporcionar mejores efectos visuales, la visualización de pantalla completa y la visualización inmersiva son comunes. En mi experiencia de desarrollo anterior, generalmente uso ImmersionBar , una biblioteca de tres partes, para lograr esto. Hoy, presentaré cómo implementarlo a través de la API oficial.

Pantalla inmersiva

La pantalla inmersiva significa que aún puede ver la barra de estado, pero el fondo de la barra de estado es transparente y no hay una separación obvia de la interfaz de usuario de la aplicación.

Imagen no inmersiva:

no_pantalla_completa.png

El código inmersivo se implementa de la siguiente manera:

//修改全局主题中statusBarColor和navigationBarColor为透明
<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.ExampleDemo" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:navigationBarColor">@android:color/transparent</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

class ImmersionActivity : AppCompatActivity() {

    private lateinit var windowInsetsController: WindowInsetsControllerCompat

    lateinit var binding: LayoutImmersionActivityBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = DataBindingUtil.setContentView(this, R.layout.layout_immersion_activity)

        WindowCompat.setDecorFitsSystemWindows(window, false)
        windowInsetsController = WindowCompat.getInsetsController(window, window.decorView)
        windowInsetsController.isAppearanceLightNavigationBars = false

        binding.btnChangeToLightBar.setOnClickListener {
            //顶部布局为亮色
            lightBar()
        }

        binding.btnChangeToDarkBar.setOnClickListener {
            //顶部布局为深色
            darkBar()
        }
    }

    private fun lightBar() {
        binding.topView.setBackgroundColor(ContextCompat.getColor(this, R.color.white))
        binding.tvTitle.setTextColor(ContextCompat.getColor(this, R.color.black))
        setBarStatus(true)
    }

    private fun darkBar() {
        binding.topView.setBackgroundColor(ContextCompat.getColor(this, R.color.color_23242a))
        binding.tvTitle.setTextColor(ContextCompat.getColor(this, R.color.white))
        setBarStatus(false)
    }

    //改变状态栏文字和图标的颜色(根据顶部布局的背景色来决定)
    private fun setBarStatus(light: Boolean) {
        windowInsetsController.isAppearanceLightStatusBars = light
    }
}

El efecto es como se muestra en la figura:

1e9c7603289e48be8c4b52997b25e525_.gif

establecer espaciado

Se puede ver que el título y la barra de estado en la parte superior de la aplicación son muy pequeños, lo cual es diferente del efecto que quiero, y el control de puntos en la parte inferior también está bloqueado por la barra de navegación transparente. El funcionario proporciona la API correspondiente para hacer frente a estas situaciones.

el código se muestra a continuación:

//重复的部分省略了
class ImmersionActivity : AppCompatActivity() {
    ...
    private var hadChange = false

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        ...

        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { _, windowInsets ->
            //此回调会触发多次,所以用布尔值来控制仅触发一次
            if (!hadChange) {
                hadChange = true
                val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
                //状态栏高度
                val statusBarHeight = insets.top
                //调整顶部控件的高度
                binding.topView.run {
                    updateLayoutParams<ConstraintLayout.LayoutParams> {
                        height += statusBarHeight
                    }
                    updatePadding(top = paddingTop + statusBarHeight)
                }
                binding.tvTitle.run {
                    updateLayoutParams<ConstraintLayout.LayoutParams> {
                        topMargin += statusBarHeight
                    }
                }

                //导航栏高度
                val navigationBarHeight = insets.bottom
                //调整圆点控件不被导航栏遮挡
                binding.bottomView.run {
                    updateLayoutParams<ConstraintLayout.LayoutParams> {
                        bottomMargin += navigationBarHeight
                    }
                }
            }
            WindowInsetsCompat.CONSUMED
        }
        ...
    }
    ...
}

El efecto es como se muestra en la figura:

Captura de pantalla_20220716_111503.png

visualización de pantalla completa

La visualización de pantalla completa significa ocultar la barra de estado y la barra de navegación. La última API oficial es muy simple.

el código se muestra a continuación:

class FullScreenActivity : AppCompatActivity() {

    lateinit var binding: LayoutFullScreenActivityBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = DataBindingUtil.setContentView(this, R.layout.layout_full_screen_activity)
        
        val windowInsetsController = WindowCompat.getInsetsController(window, window.decorView)
        //控制系统栏的行为
        windowInsetsController.systemBarsBehavior = WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
        windowInsetsController.hide(WindowInsetsCompat.Type.systemBars())
    }
}

Nota: systemBarsBehaviorHay tres tipos de cambios en la barra del sistema que se utilizan para controlar el comportamiento del usuario:

  • WindowInsetsControllerCompat.BEHAVIOR_SHOW_BARS_BY_TOUCH
  • WindowInsetsControllerCompat.BEHAVIOR_SHOW_BARS_BY_SWIPE
  • WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE

BEHAVIOR_SHOW_BARS_BY_TOUCH y BEHAVIOR_SHOW_BARS_BY_SWIPE se muestran al tocar o deslizar, por lo que la barra del sistema no se ocultará automáticamente después de que aparezca. El efecto es el siguiente:

22c78146cb8ec9e453add4b805029574_.gif

BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE se muestra como un toque o deslizamiento que hace que aparezca la barra del sistema, y ​​se ocultará automáticamente en poco tiempo. El efecto es el siguiente:

3275d5d9ae9de444422a627b9451995a_.gif

Supongo que te gusta

Origin juejin.im/post/7120815750880690190
Recomendado
Clasificación