Creare una notifica con una barra di appigli
Mantieni tutto organizzato con le raccolte
Salva e classifica i contenuti in base alle tue preferenze.
Il componente barra di notifica serve come breve notifica visualizzata nella parte inferiore dello schermo. Fornisce feedback su un'operazione o un'azione senza interrompere l'esperienza utente. Le barre di appostamento scompaiono dopo alcuni secondi. L'utente può anche ignorarli con un'azione, ad esempio toccando un pulsante.
Considera questi tre casi d'uso in cui potresti utilizzare una barra di appunti:
- Conferma dell'azione: dopo che un utente ha eliminato un'email o un messaggio, viene visualizzata una barra di notifica per confermare l'azione e offrire un'opzione "Annulla".
- Stato della rete: quando l'app perde la connessione a internet, viene visualizzata una barra di notifica che indica che è offline.
- Invio dei dati: dopo aver inviato un modulo o aggiornato le impostazioni, una barra di notifica indica che la modifica è stata salvata correttamente.
Compatibilità delle versioni
Questa implementazione richiede che il valore minSDK del progetto sia impostato sul livello API 21 o superiore.
Dipendenze
Creare una barra degli avvisi di base
Per implementare una barra di notifica, crea prima SnackbarHost, che include una proprietà
SnackbarHostState. SnackbarHostState fornisce l'accesso alla funzione
showSnackbar() che puoi utilizzare per visualizzare la barra di notifica.
Questa funzione di sospensione richiede un CoroutineScope, ad esempio con l'utilizzo di rememberCoroutineScope, e può essere chiamata in risposta agli eventi dell'interfaccia utente per mostrare un Snackbar in Scaffold.
Creare una barra di app con un'azione
Puoi fornire un'azione facoltativa e regolare la durata del Snackbar.
La funzione snackbarHostState.showSnackbar() accetta parametri actionLabel
e duration aggiuntivi e restituisce un SnackbarResult.
Puoi fornire un Snackbar personalizzato con il parametro snackbarHost. Per ulteriori informazioni, consulta la documentazione di riferimento dell'API SnackbarHost.
Risultati
Figura 1. Notifiche nella barra di app con azione.
Raccolte che contengono questa guida
Questa guida fa parte di queste raccolte di guide rapide selezionate che coprono obiettivi di sviluppo Android più ampi:
Mostrare componenti interattivi
Scopri come le funzioni composable possono aiutarti a creare facilmente magnifici componenti dell'interfaccia utente basati sul sistema di progettazione Material Design.
I campioni di contenuti e codice in questa pagina sono soggetti alle licenze descritte nella Licenza per i contenuti. Java e OpenJDK sono marchi o marchi registrati di Oracle e/o delle sue società consociate.
Ultimo aggiornamento 2025-02-06 UTC.
[[["Facile da capire","easyToUnderstand","thumb-up"],["Il problema è stato risolto","solvedMyProblem","thumb-up"],["Altra","otherUp","thumb-up"]],[["Mancano le informazioni di cui ho bisogno","missingTheInformationINeed","thumb-down"],["Troppo complicato/troppi passaggi","tooComplicatedTooManySteps","thumb-down"],["Obsoleti","outOfDate","thumb-down"],["Problema di traduzione","translationIssue","thumb-down"],["Problema relativo a esempi/codice","samplesCodeIssue","thumb-down"],["Altra","otherDown","thumb-down"]],["Ultimo aggiornamento 2025-02-06 UTC."],[],[],null,["\u003cbr /\u003e\n\nThe [snackbar component](https://material.io/components/snackbars) serves as a brief notification that appears at the\nbottom of the screen. It provides feedback about an operation or action without\ninterrupting the user experience. Snackbars disappear after a few seconds. The\nuser can also dismiss them with an action, such as tapping a button.\n\nConsider these three use cases where you might use a snackbar:\n\n- **Action confirmation:** After a user deletes an email or message, a snackbar appears to confirm the action and offer an \"Undo\" option.\n- **Network status:** When the app loses its internet connection, a snackbar pops up to note that it is now offline.\n- **Data submission:** Upon successfully submitting a form or updating settings, a snackbar notes that the change has saved successfully.\n\nVersion compatibility\n\nThis implementation requires that your project minSDK be set to API level 21\nor higher.\n\nDependencies\n\nCreate a basic snackbar\n\nTo implement a snackbar, you first create [`SnackbarHost`](/reference/kotlin/androidx/compose/material3/package-summary#SnackbarHost(androidx.compose.material3.SnackbarHostState,androidx.compose.ui.Modifier,kotlin.Function1)), which includes a\n[`SnackbarHostState`](/reference/kotlin/androidx/compose/material3/SnackbarHostState) property. `SnackbarHostState` provides access to the\n[`showSnackbar()`](/reference/kotlin/androidx/compose/material3/SnackbarHostState#showsnackbar) function which you can use to display your snackbar.\n\nThis suspending function requires a `CoroutineScope` such as with using\n[`rememberCoroutineScope`](/reference/kotlin/androidx/compose/runtime/package-summary#remembercoroutinescope) --- and can be called in response to UI events to\nshow a [`Snackbar`](/reference/kotlin/androidx/compose/material3/package-summary#snackbar) within `Scaffold`.\n\nCreate a snackbar with action\n\nYou can provide an optional action and adjust the duration of the `Snackbar`.\nThe `snackbarHostState.showSnackbar()` function accepts additional `actionLabel`\nand `duration` parameters, and returns a [`SnackbarResult`](/reference/kotlin/androidx/compose/material3/SnackbarResult).\n\nYou can provide a custom `Snackbar` with the `snackbarHost` parameter. See the\n[`SnackbarHost` API reference docs](/reference/kotlin/androidx/compose/material/package-summary#snackbarhost) for more information.\n\nResults\n\n\n**Figure 1.** Snackbar notifications with action.\n\n\u003cbr /\u003e\n\nCollections that contain this guide\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\nDisplay interactive components \nLearn how composable functions can enable you to easily create beautiful UI components based on the Material Design design system. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-interactive-components) \n\nHave questions or feedback \nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]
