Ocultar barras de sistema para o modo imersivo

Alguns conteúdos são mais bem visualizados em tela cheia, sem indicadores na barra de status ou de navegação. Alguns exemplos são vídeos, jogos, galerias de imagens, livros e slides de apresentação. Esse modo é conhecido como modo imersivo. Esta página mostra como interagir mais profundamente com os usuários com conteúdo em tela cheia.

Figura 1. Exemplo de modo imersivo.

O modo imersivo ajuda os usuários a evitar saídas acidentais durante um jogo e oferece uma experiência imersiva para curtir imagens, vídeos e livros. No entanto, preste atenção à frequência com que os usuários entram e saem dos apps para conferir notificações, fazer pesquisas de improviso ou realizar outras ações. Como o modo imersivo faz com que os usuários percam o acesso fácil à navegação do sistema, use esse modo somente quando o benefício da experiência do usuário for além de apenas usar espaço extra na tela.

Use WindowInsetsControllerCompat.hide() para ocultar as barras do sistema e WindowInsetsControllerCompat.show() para trazê-las de volta.

O snippet abaixo mostra um exemplo de configuração de um botão para ocultar e mostrar as barras do sistema.

Kotlin

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

    val windowInsetsController =
        WindowCompat.getInsetsController(window, window.decorView)
    // Configure the behavior of the hidden system bars.
    windowInsetsController.systemBarsBehavior =
        WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE

    // Add a listener to update the behavior of the toggle fullscreen button when
    // the system bars are hidden or revealed.
    window.decorView.setOnApplyWindowInsetsListener { view, windowInsets ->
        // You can hide the caption bar even when the other system bars are visible.
        // To account for this, explicitly check the visibility of navigationBars()
        // and statusBars() rather than checking the visibility of systemBars().
        if (windowInsets.isVisible(WindowInsetsCompat.Type.navigationBars())
            || windowInsets.isVisible(WindowInsetsCompat.Type.statusBars())) {
            binding.toggleFullscreenButton.setOnClickListener {
                // Hide both the status bar and the navigation bar.
                windowInsetsController.hide(WindowInsetsCompat.Type.systemBars())
            }
        } else {
            binding.toggleFullscreenButton.setOnClickListener {
                // Show both the status bar and the navigation bar.
                windowInsetsController.show(WindowInsetsCompat.Type.systemBars())
            }
        }
        view.onApplyWindowInsets(windowInsets)
    }
}

Java

@Override
protected void onCreate(Bundle savedInstanceState) {
    ...

    WindowInsetsControllerCompat windowInsetsController =
            WindowCompat.getInsetsController(getWindow(), getWindow().getDecorView());
    // Configure the behavior of the hidden system bars.
    windowInsetsController.setSystemBarsBehavior(
            WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
    );

    // Add a listener to update the behavior of the toggle fullscreen button when
    // the system bars are hidden or revealed.
    getWindow().getDecorView().setOnApplyWindowInsetsListener((view, windowInsets) -> {
        // You can hide the caption bar even when the other system bars are visible.
        // To account for this, explicitly check the visibility of navigationBars()
        // and statusBars() rather than checking the visibility of systemBars().
        if (windowInsets.isVisible(WindowInsetsCompat.Type.navigationBars())
                || windowInsets.isVisible(WindowInsetsCompat.Type.statusBars())) {
            binding.toggleFullscreenButton.setOnClickListener(v -> {
                // Hide both the status bar and the navigation bar.
                windowInsetsController.hide(WindowInsetsCompat.Type.systemBars());
            });
        } else {
            binding.toggleFullscreenButton.setOnClickListener(v -> {
                // Show both the status bar and the navigation bar.
                windowInsetsController.show(WindowInsetsCompat.Type.systemBars());
            });
        }
        return view.onApplyWindowInsets(windowInsets);
    });
}

Também é possível especificar o tipo de barras do sistema a serem ocultadas e determinar o comportamento delas quando um usuário interage com elas.

Especificar quais barras do sistema serão ocultadas

Para especificar o tipo de barras do sistema a serem ocultadas, transmita um dos parâmetros abaixo para WindowInsetsControllerCompat.hide().

Especificar o comportamento das barras de sistema ocultas

Use WindowInsetsControllerCompat.setSystemBarsBehavior() para especificar como as barras de sistema ocultas se comportam quando o usuário interage com elas.