A partire da Chrome 59, le notifiche inviate tramite l'API Notifications o Verrà mostrata l'API delle estensioni chrome.notifications direttamente dal sistema di notifica nativo macOS anziché da quello di Chrome.
Grazie a questa modifica, Chrome su macOS si integra meglio nella piattaforma e corregge una serie di bug di lunga data, ad esempio il mancato rispetto di Chrome impostazione Non disturbare di sistema.
Di seguito esamineremo le differenze introdotte da questa modifica API.
Centro notifiche
Uno dei vantaggi di questa modifica è che le notifiche verranno visualizzate Centro notifiche di macOS.
![Le notifiche di Google Chrome vengono visualizzate nel centro notifiche di macOS](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/google-chrome-notificatio-0dd272728498d.png?authuser=6&hl=it)
Differenze
Dimensioni e posizionamento delle icone
L'aspetto delle icone cambierà. Saranno più piccole e la spaziatura interna è applicati. Ti consigliamo di passare a un'icona di sfondo trasparente invece di un colore a tinta unita per risultare esteticamente piacevole.
![Prima e dopo per Chrome su Mac: icone di notifica visualizzate da Chrome e visualizzate da
macOS.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-chrome-ma-8f7a9faf4b135.png?authuser=6&hl=it)
Icone di azione
Prima di questa modifica, i pulsanti di azione e le icone venivano visualizzati nella notifica. Con le notifiche native, le icone dei pulsanti di azione non saranno utilizzato; l'utente dovrà passare il mouse sopra la notifica e selezionare "Altro" per vedere le azioni disponibili.
![Prima e dopo dei pulsanti di azione della notifica con icone visualizzate da
Confronto tra Chrome e Mac OS.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-notificati-acefa2d32d351.png?authuser=6&hl=it)
Logo di Chrome
Il logo di Chrome viene sempre visualizzato e non può essere sostituito né alterato. Questo è un requisito per le applicazioni di terze parti su macOS.
Immagini
L'opzione image
non sarà più supportata su macOS. Se definisci un'immagine
proprietà: la notifica sarà ancora visualizzata, ma l'immagine verrà ignorata
(vedi l'esempio di seguito).
![Prima e dopo dell'immagine di notifica per Chrome su macOS.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-notificati-35cb1f20a7481.png?authuser=6&hl=it)
Puoi utilizzare il seguente codice per la funzionalità di rilevamento del supporto delle immagini:
if ('image' in Notification.prototype) {
// Image is supported.
} else {
// Image is NOT supported.
}
Modifiche alle estensioni di Chrome
Le estensioni di Chrome si basano sul concetto di modelli di notifica che si comporterà in modo diverso con questa modifica.
Il modello di notifica immagine non mostrerà più l'immagine. Devi assicurarti che le immagini sono supplementari e non devono essere utili per gli utenti.
![Prima e dopo per i modelli di immagine nell'API chrome.notification.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-image-temp-ea8d68fe9acc.png?authuser=6&hl=it)
Il modello di notifica dell'elenco mostra solo il primo elemento nell'elenco. Tu può essere utile tornare allo stile di notifica di base e usare il corpo di testo per riassumere l'insieme di modifiche.
![Prima e dopo per i modelli di elenco nell'API chrome.notification.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-list-templ-58a8124f4c8f9.png?authuser=6&hl=it)
Le notifiche di avanzamento aggiungerà un valore percentuale al titolo della notifica per indicare l'avanzamento invece di una barra di avanzamento.
![Prima e dopo per i modelli di avanzamento nell'API chrome.notification.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-progress-t-aeb9eb61ae795.png?authuser=6&hl=it)
L'ultima differenza nell'UI di notifica è che appIconMarkUrl
non viene più utilizzato su macOS.
![Prima e dopo per appIconMarkUrl nell'API chrome.notification.](https://developer.chrome.google.cn/static/blog/native-mac-os-notifications/image/before-after-appiconmar-74e3f48314cd4.png?authuser=6&hl=it)