Masquer les barres système pour le mode immersif

Certains contenus sont plus agréables à regarder en plein écran, sans aucun indicateur dans la barre d'état ni dans la barre de navigation. Il peut s'agir, par exemple, de vidéos, de jeux, de galeries d'images, de livres ou de diapositives de présentation. C'est ce qu'on appelle le mode immersif. Cette page explique comment impliquer davantage les utilisateurs avec du contenu en plein écran.

Figure 1. Exemple de mode immersif.

Le mode immersif permet aux utilisateurs d'éviter les sorties accidentelles pendant un jeu et offre une expérience immersive pour profiter des images, des vidéos et des livres. Toutefois, soyez attentif à la fréquence à laquelle les utilisateurs entrent et sortent des applications pour consulter les notifications, effectuer des recherches impromptues ou effectuer d'autres actions. Étant donné que le mode immersif empêche les utilisateurs d'accéder facilement à la navigation du système, n'utilisez-le que lorsque l'avantage pour l'expérience utilisateur va au-delà de la simple utilisation d'un espace d'écran supplémentaire.

Utilisez WindowInsetsControllerCompat.hide() pour masquer les barres système et WindowInsetsControllerCompat.show() pour les afficher à nouveau.

L'extrait de code suivant montre un exemple de configuration d'un bouton permettant de masquer et d'afficher les barres système.

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.
    ViewCompat.setOnApplyWindowInsetsListener(window.decorView) { 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())
            }
        }
        ViewCompat.onApplyWindowInsets(view, 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.
    ViewCompat.setOnApplyWindowInsetsListener(
        getWindow().getDecorView(),
        (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 ViewCompat.onApplyWindowInsets(view, windowInsets);
    });
}

Vous pouvez également spécifier le type de barres système à masquer et déterminer leur comportement lorsqu'un utilisateur interagit avec elles.

Spécifier les barres système à masquer

Pour spécifier le type de barres système à masquer, transmettez l'un des paramètres suivants à WindowInsetsControllerCompat.hide().

Spécifier le comportement des barres système masquées

Utilisez WindowInsetsControllerCompat.setSystemBarsBehavior() pour spécifier le comportement des barres système masquées lorsque l'utilisateur interagit avec elles.