Conseils sur l’interface utilisateur du système Android pour Surface Duo

  • Article

Dans cet article, nous montrons comment contrôler la barre d’état et la barre de navigation, ou prendre en charge l’affichage plein écran dans votre application.

Plein écran

@Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    if(hasFocus) {
        getWindow().getDecorView().setSystemUiVisibility(
              View.SYSTEM_UI_FLAG_LAYOUT_STABLE
            | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
            | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_FULLSCREEN
            | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);

Pour plus d’informations, consultez la documentation Android sur le plein écran.

Barre d'état

Consultez la documentation Android pour estomper ou masquer la barre d’état.

window.statusBarColor = Color.TRANSPARENT;

Dans styles.xml, ajoutez ces éléments dans le thème d’application :

<item name="android:windowTranslucentStatus">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>

Pour définir une couleur, le fichier styles.xml doit contenir une référence de couleur :

<item name="android:windowTranslucentStatus">false</item>
<item name="android:statusBarColor">@color/colorPillBar</item>

qui doit exister dans colors.xml (rouge dans le cas présent) :

<color name="colorPillBar">#ff0000</color>

Red status bar

Conseil

Les applications partagent la barre d’état avec l’application sur l’autre écran (sauf si elles sont réparties sur les deux écrans). Les applications qui nécessitent le plein écran ou qui manipulent la barre d’état ont ces paramètres pris en compte quand elles sont réparties ou quand elles sont l’application active sur un seul écran. Quand l’application se trouve sur un seul écran et que l’autre écran devient actif, les paramètres de l’interface utilisateur du système de l’application focalisée s’appliquent et la barre d’état peut s’afficher sur l’application qui avait demandé le plein écran

Masquer la barre de navigation.

Dans styles.xml, ajoutez ces éléments dans le thème d’application :

<item name="android:windowTranslucentNavigation">true</item>
<item name="android:navigationBarColor">@android:color/transparent</item>

Pour définir une couleur, le fichier styles.xml doit contenir une référence de couleur :

<item name="android:windowTranslucentNavigation">false</item>
<item name="android:navigationBarColor">@color/colorPillBar</item>

qui doit exister dans colors.xml (rouge dans le cas présent) :

<color name="colorPillBar">#ff0000</color>

Red navigation bar