Creare un layout di notifica personalizzato

Per fare in modo che le notifiche abbiano un aspetto ottimale nelle diverse versioni di Android, utilizza il modello di notifica standard per crearle. Se tu vuoi fornire più contenuti nella notifica, valuta la possibilità di utilizzare uno dei modelli di notifica espandibili.

Tuttavia, se i modelli di sistema non soddisfano le tue esigenze, puoi utilizzare il tuo layout per la notifica.

Creare un layout personalizzato per l'area dei contenuti

Se hai bisogno di un layout personalizzato, puoi applicare NotificationCompat.DecoratedCustomViewStyle alla notifica. Questa API ti consente di fornire un layout personalizzato per l'area dei contenuti normalmente occupata dal titolo e dal testo, pur utilizzando le decorazioni di sistema per l'icona della notifica, il timestamp, il sottotitolo e i pulsanti di azione.

Questa API funziona in modo simile ai modelli di notifica espandibili, basandosi sul layout di notifica di base come segue:

  1. Crea una notifica di base con NotificationCompat.Builder.
  2. Chiama setStyle() e passagli un'istanza di NotificationCompat.DecoratedCustomViewStyle.
  3. Espandi il layout personalizzato come istanza di RemoteViews.
  4. Chiama setCustomContentView() per impostare il layout per la notifica compressa.
  5. Facoltativamente, chiama anche setCustomBigContentView() per impostare un diverso layout per la notifica espansa.

Preparare i layout

Ti servono un layout small e uno large. Per questo esempio, il layout small potrebbe essere simile al seguente:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/notification_title"
        style="@style/TextAppearance.Compat.Notification.Title"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="Small notification, showing only a title" />
</LinearLayout>

Il layout large potrebbe essere simile al seguente:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="300dp"
    android:orientation="vertical">

    <TextView
        android:id="@+id/notification_title"
        style="@style/TextAppearance.Compat.Notification.Title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Large notification, showing a title and a body." />

    <TextView
        android:id="@+id/notification_body"
        style="@style/TextAppearance.Compat.Notification.Line2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="This is the body. The height is manually forced to 300dp." />
</LinearLayout>

Creare e mostrare la notifica

Una volta pronti i layout, puoi utilizzarli come mostrato nell'esempio seguente:

val notificationManager = getSystemService(Context.NOTIFICATION_SERVICE) as NotificationManager

// Get the layouts to use in the custom notification.
val notificationLayout = RemoteViews(packageName, R.layout.notification_small)
val notificationLayoutExpanded = RemoteViews(packageName, R.layout.notification_large)

// Apply the layouts to the notification.
val customNotification = NotificationCompat.Builder(context, CHANNEL_ID)
    .setSmallIcon(R.drawable.notification_icon)
    .setStyle(NotificationCompat.DecoratedCustomViewStyle())
    .setCustomContentView(notificationLayout)
    .setCustomBigContentView(notificationLayoutExpanded)
    .build()

notificationManager.notify(666, customNotification)

Tieni presente che il colore di sfondo della notifica può variare a seconda dei dispositivi e delle versioni. Applica gli stili della libreria di supporto, ad esempio TextAppearance_Compat_Notification per il testo e TextAppearance_Compat_Notification_Title per il titolo nel layout personalizzato, come mostrato nell'esempio seguente. Questi stili si adattano alle variazioni di colore, in modo da non avere testo nero su nero o bianco su bianco.

<TextView
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:text="@string/notification_title"
    android:id="@+id/notification_title"
    style="@style/TextAppearance.Compat.Notification.Title" />

Evita di impostare un'immagine di sfondo sull'oggetto RemoteViews, perché il testo potrebbe diventare illeggibile.

Quando attivi una notifica mentre l'utente sta utilizzando un'app, il risultato è simile alla Figura 1:

Un layout di notifica personalizzata compresso
Figura 1. Un piccolo layout di notifica viene visualizzato durante l'utilizzo di altre app.

Se tocchi la freccia di espansione, la notifica si espande, come mostrato nella Figura 2:

Un layout di notifica personalizzato espanso
Figura 2. Un layout di notifica di grandi dimensioni viene visualizzato durante l'utilizzo di altre app.

Una volta scaduto il timeout della notifica, la notifica è visibile solo nella barra di sistema, come mostrato nella Figura 3:

Una notifica compressa nella barra di sistema
Figura 3. Come viene visualizzato il piccolo layout di notifica appare nella barra di sistema.

Se tocchi la freccia di espansione, la notifica si espande, come mostrato nella Figura 4:

Una notifica espansa nella barra di sistema
Figura 4. Un layout di notifica di grandi dimensioni viene visualizzato in la barra di sistema.

Creare un layout di notifica completamente personalizzato

Se non vuoi che la notifica sia decorata con l'icona e l'intestazione della notifica standard , segui i passaggi precedenti, ma non chiamare setStyle().