Windows Phone 8 - Creare un MessageBox Personalizzato

Chi sviluppa per Windows Phone 8, si sarà accorto che la classe MessageBox da la possibilità di creare finestre di popup con due semplici bottoni: OK, Cancel. Oggi vediamo come ampliare questa funzione, creando una finestra di popup tutta nostra.

Per prima cosa apriamo Visual Studio 2012 e creiamo un nuovo progetto C# per Windows Phone 8, dopodiché creiamo una nuova cartella all'interno della soluzione e la chiamiamo CustomMessageBox. La soluzione finale sarà così:

All'interno di questa cartella creiamo un nuovo file in questo modo:

Partiamo dalla grafica, quindi modifichiamo il file CustomMessageBox.xaml in questo modo:

Spiegazione: Inseriamo nel LayoutRoot tre righe che contengono il Titolo il Contenuto e l'ultima i Bottoni

Ora andiamo ad aprire il file CustomMessageBox.xaml.cs e aggiungiamo i seguenti using:

Poi questi due enumeratori:

Spiegazione: L'enum CustomMessageBoxButtonType dice quali tipi di bottoni il popup supporta. Il CustomMessageBoxButtonResult definisce i risultati che i bottoni restituiscono al click.

Inseriamo la variabile Result:

Spiegazione: Questa variabile restituisce il valore del bottone cliccato.

Andiamo ad aggiungere 3 tipi di costruttori:

Spiegazione: Ovviamente differiscono per il numero di parametri passati, se si chiama il primo, viene costruita una finestra con i valori di default e con un bottone OK. Con il secondo definiamo il Titolo e il Contenuto della finestra, ma il bottone è sempre quello di default. Infine con l'ultimo creiamo un popup con tutti i parametri personalizzati!

Passiamo alla funzione CreateButton che si occupa di aggiungere i bottoni al popup:

Spiegazione: A seconda del tipo di bottone, impostiamo il testo da visualizzare(Content) e al Click il tipo di valore da restituire, infine lo aggiungiamo all'utlima riga del popup.

L'ultima funzione che ci serve, è quella che controlla quando un bottone viene cliccato:

Spiegazione: Questa funzione lavora su un Thread secondario, di modo che possiamo aggiungere una keyword await quando la richiamiamo ed attendere il termine della funzione. La funzione non fa altro che controllare la variabile Result, appena cambia il valore da Null ad uno impostato dal bottone cliccato, la restituisce come risultato.

Utilizzo:
Passiamo a modificare il file MainPage.xaml:

Spiegazione: Abbiamo aggiunto(xmlns:local="clr-namespace:PhoneApp2.CustomMessageBox")lo spazione dei nomi per creare il popup. Abbiamo creato un bottone che al click visualizza il popup. In fondo al LayoutRoot abbiamo aggiunto un Canvas che sarà lo sfondo che oscura tutto tranne il popup.

Passiamo al MainPage.xaml.cs:

Spiegazione: La funzione ShowPopup crea un primo MessageBox chiedendo di cliccare su Sì o No, a seconda di dove si clicca viene visualizzato un nuovo popup con il risultato!

Ed ecco il risultato: