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:
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:
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:
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: systemBarsBehavior
Hay 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:
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: