Tra le parti di UI che contraddistinguono un applicazione Windows Phone, c'è sicuramente la barra delle applicazioni, chiamata ApplicationBar.
Anche se è possibile ricrearne una tramite HTML, JavaScript e CSS, riproducendone il look & feel, il compito non è sicuramente semplice. Infatti ci sono alcuni aspetti da tenere in considerazione:
- l'animazione in entrata;
- la rotazione dei pulsanti e del testo in base all'orientamento del device;
- il rispetto dei temi light & dark.
E', quindi, più conveniente utilizzare quanto già presente in Windows Phone e accedervi mediante JavaScript.
Per prima cosa dobbiamo aggiungere l'ApplicationBar nella pagina che contiene il browser utilizzato da Phone Gap:
<phone:PhoneApplicationPage.ApplicationBar> <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" Opacity="0.5"> <shell:ApplicationBarIconButton IconUri="/icons/appbar.add.rest.png" x:Name="AppbarAdd" Text="add" Click="AppbarAdd_Click"/> </shell:ApplicationBar> </phone:PhoneApplicationPage.ApplicationBar>
Aggiungiamo un event handler per l'evento Click e, nel corpo del metodo, inseriamo il seguente codice:
PGView.Browser.InvokeScript("appbar_Add");
L'oggetto PGView è il controllo WebBrowser utilizzato da PhoneGap, mentre il metodo InvokeScript si limita a chiamare la funzione JavaScript specificata come argomento, cercandola nel documento caricato correntemente.
Aggiungiamo quindi la seguente funzione tra i tag script della pagina HTML caricata:
function appbar_Add() { document.getElementById("welcomeMsg").innerHTML = "Hai premuto il pulsante della barra delle applicazioni "; }
E' sufficiente far tap sul pulsante della barra delle applicazioni per visualizzare il messaggio nel controllo browser utilizzato per renderizzare la pagina.
Link e riferimenti utili
Il nostro speciale sullo sviluppo web mobilehttps://www.aspitalia.com/focuson/1267/Speciale-Web-Mobile-Costruire-Applicazioni-ASP.NET-JQuery-Mobile.aspx
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Assegnare un valore di default a un parametro di una lambda in C#
Generare token per autenicarsi sulle API di GitHub
Short-circuiting della Pipeline in ASP.NET Core
Autenticarsi in modo sicuro su Azure tramite GitHub Actions
Eseguire attività basate su eventi con Azure Container Jobs
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Reactive form tipizzati con modellazione del FormBuilder in Angular
Code scanning e advanced security con Azure DevOps
Sfruttare MQTT in cloud e in edge con Azure Event Grid
Effettuare lo stream della risposta in ASP.NET Core tramite IAsyncEnumerable
Limitare le richieste lato server con l'interactive routing di Blazor 8
Esportare ed analizzare le issue di GitHub con la CLI e GraphQL