Le Universal App consentono di replicare facilmente la user experience di un'applicazione su tablet e telefono, condividendo gran parte del codice e facilitando lo sviluppo.
Rendendo possibile un'unica definizione del markup e del codice, diventa necessario che i controlli siano in grado di adattarsi alle differenti caratteristiche di Windows e Windows Phone. Un'area in cui è particolarmente differente la resa è quello della application bar, un'area in basso alla schermo dedicata ai comandi, data la differenza di spazio a disposizione.
Per implementare questa funzionalità su entrambe le piattaforme, ci basta utilizzare il controllo CommandBar, impostato come application bar inferiore della pagina:
<Page.BottomAppBar> <CommandBar> <CommandBar.PrimaryCommands> <AppBarButton Icon="Refresh" Label="Aggiorna" /> </CommandBar.PrimaryCommands> <CommandBar.SecondaryCommands> <AppBarButton Icon="ContactInfo" Label="Contatti" /> </CommandBar.SecondaryCommands> </CommandBar> </Page.BottomAppBar>
L'effetto che otteniamo è che Windows avremo un'app bar con i primary command a destra e quelli secondari a sinistra (come da guidelines), mentre su Windows Phone i primary command diventeranno le icone (fino a 4) e i secondary command saranno accessibili come link nel menu a scomparsa.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Eseguire operazioni sui blob con Azure Storage Actions
Limitare le richieste lato server con l'interactive routing di Blazor 8
Verificare la provenienza di un commit tramite le GitHub Actions
Sottoscrizione agli eventi sul contenitore in JavaScript
Ottimizzare la latenza in Blazor 8 tramite InteractiveAuto render mode
Linting di un Dockerfile con un workflow di GitHub
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Miglioramenti agli screen reader e al contrasto in Angular
Utilizzare flat e flatMap per appiattire array innestati in array
Reactive form tipizzati con modellazione del FormBuilder in Angular
Generare file per il download da Blazor WebAssembly
Utilizzare ChatGPT con Azure OpenAI