Atelier de programmation SystemUIOverlayWindow

Cette page explique comment créer une vue dans SystemUIOverlayWindow .

Avant de commencer

Le contenu fourni ci-dessous suppose que vous avez lu ces articles sur l'interface utilisateur système :

• Implémenter l'interface utilisateur du système
• Système de gestion de fenêtres SystemUIOverlay

Cet article:

• Suppose que vous connaissez les cas d'utilisation du système d'exploitation Android Automotive et de son SystemUIOverlayWindow .
• Fournit des exemples de certaines sous-classes de OverlayViewController .
• Ne concerne pas les sous-classes de OverlayViewController .
• N'explique pas comment configurer Android pour le développement.
• Ne décrit pas chaque option pouvant être remplacée dans les classes de base. Il décrit plutôt uniquement ceux nécessaires à la configuration d'une vue de base.

Terminer l'atelier de programmation

Étape 1 : Créer une mise en page pour OverlayViewController

Créez un fichier nommé frameworks/base/packages/CarSystemUI/res/layout/codelab_layout.xml pour contenir les éléments suivants :

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/codelab_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/black">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Code Lab View!"
            android:color="@*android:color/car_accent"
            android:textStyle="italic"
            android:textSize="34sp"/>
        <Button
            android:id="@+id/codelab_button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:text="Hide!"
            android:background="@*android:color/car_accent"/>
    </LinearLayout>
</FrameLayout>

Cette disposition crée la vue suivante :

Étape 2 : ajouter un ViewStub à SysUIOverlayWindow

Ajoutez la vue à votre fenêtre en ajoutant un ViewStub au SystemUIOverlayWindow .

Ajoutez le code suivant à frameworks/base/packages/CarSystemUI/res/layout/sysui_overlay_window.xml à la racine FrameLayout :

<ViewStub android:id="@+id/codelab_stub"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout="@layout/codelab_layout"/>

L'ordre dans lequel les ViewStubs sont définis dans le FrameLayout racine définit l'ordre Z des vues dans la fenêtre. Étant donné que cet atelier de programmation n'implique pas de superposition de vues, vous pouvez ajouter l'extrait de code n'importe où dans la racine FrameLayout .

Étape 3 : Créer un OverlayViewController

Pour être affichée et masquée, la nouvelle mise en page doit être liée à un OverlayViewController .

Pour créer un OverlayViewController injectable nommé frameworks/base/packages/CarSystemUI/src/com/android/systemui/car/codelab/CodeLabViewController.java avec le contenu suivant :

package com.android.systemui.car.codelab;

import com.android.systemui.R;
import com.android.systemui.car.window.OverlayViewController;
import com.android.systemui.car.window.OverlayViewGlobalStateController;
import com.android.systemui.dagger.SysUISingleton;

import javax.inject.Singleton;

@SysUISingleton
public class CodeLabViewController extends OverlayViewController {

    @Inject
    public CodeLabViewController(
            OverlayViewGlobalStateController overlayViewGlobalStateController) {
        super(R.id.codelab_stub, overlayViewGlobalStateController);
    }
}

Étape 4 : Créer un OverlayViewMediator

Un OverlayViewMediator à déclencher lorsqu'une nouvelle vue est affichée ou masquée est requis.

Créez un nouvel OverlayViewMediator injectable nommé frameworks/base/packages/CarSystemUI/src/com/android/systemui/car/codelab/CodeLabViewMediator.java avec le contenu suivant :

package com.android.systemui.car.codelab;


import android.bluetooth.BluetoothAdapter;
import android.content.BroadcastReceiver;
import android.content.Context;
import android.content.Intent;
import android.content.IntentFilter;


import com.android.systemui.car.window.OverlayViewMediator;
import com.android.systemui.dagger.SysUISingleton;


import javax.inject.Inject;


@SysUISingleton
public class CodeLabViewMediator implements OverlayViewMediator {
    Context mContext;
    CodeLabViewController mCodeLabViewController;


    @Inject
    public CodeLabViewMediator(Context context, CodeLabViewController codeLabViewController) {
        mContext = context;
        mCodeLabViewController = codeLabViewController;
    }


    @Override
    public void registerListeners() {
        // no-op
    }


    @Override
    public void setupOverlayContentViewControllers() {
        // no-op
    }
}

Étape 5 : Afficher la vue

Pour faciliter la compréhension et déclencher notre affichage, utilisez Bluetooth lorsque l'état est désactivé.

Remplacez // no-op dans CodeLabViewMediator#registerListeners par ce qui suit :

// Register Show Listener
mContext.registerReceiver(new BroadcastReceiver() {
    @Override
    public void onReceive(Context context, Intent intent) {
        final String action = intent.getAction();


        if (action.equals(BluetoothAdapter.ACTION_STATE_CHANGED)) {
            final int state = intent.getIntExtra(BluetoothAdapter.EXTRA_STATE,
                    BluetoothAdapter.ERROR);
            switch (state) {
                case BluetoothAdapter.STATE_OFF:
                    // Show OverlayViewController
                    mCodeLabViewController.start();
                    break;
            }
        }
    }
}, new IntentFilter(BluetoothAdapter.ACTION_STATE_CHANGED));

Étape 6 : Masquer la vue

La vue sera masquée lorsque l'option « Masquer ! » le bouton est cliqué. Étant donné que cette action concerne uniquement le bouton de la vue gonflée, ajoutez-la directement à votre OverlayViewController .

Ajoutez la méthode suivante à CodeLabViewController :

@Override
protected void onFinishInflate() {
    getLayout().findViewById(R.id.codelab_button).setOnClickListener(v -> {
        stop();
    });
}

Étape 7 : Configurez le nouveau OverlayViewMediator

1. Pour ajouter le nouveau OverlayViewMediator à OverlayWindowModule, ajoutez le code suivant à OverlayWindowModule :

   /** Injects CodeLabViewMediator. */
   @Binds
   @IntoMap
   @ClassKey(CodeLabViewMediator.class)
   public abstract OverlayViewMediator bindCodeLabViewMediator(
           CodeLabViewMediator overlayViewsMediator);
   

2. Pour ajouter le nouveau OverlayViewMediator à config_carSystemUIOverlayViewsMediators, ajoutez la ligne suivante à config_carSystemUIOverlayViewsMediators dans frameworks/base/packages/CarSystemUI/res/values/config.xml :

   <item>com.android.systemui.car.codelab.CodeLabViewMediator</item>
   

Résultat

Toutes nos félicitations! Vous avez créé une vue dans SystemUIOverlayWindow :

Ressources additionnelles

Pour en savoir plus, consultez les ressources fournies ci-dessous.

Exemple de OverlayViewController

Considérez le sélecteur d'utilisateurs plein écran comme une application simple de SystemUIOverlayWindow: :

• FullScreenUserSwitcherViewController
• Plein écranUserSwitcherViewMediator

Autres OverlayViewControllers

OverlayPanelViewController

Un OverlayPanelViewController est utilisé pour fournir une animation de glissement de base lors de l'affichage et du masquage de vues dans SystemUIOverlayWindow . Consultez le panneau de notification pour en savoir plus :

• NotificationPanelViewController
• NotificationPanelViewMediator