Alessandro Del Sole's Blog

{ A programming space about Microsoft® .NET® }
posts - 1909, comments - 2047, trackbacks - 352

My Links

News

Your host

This is me! Questo spazio è dedicato a Microsoft® .NET®, di cui sono molto appassionato :-)

Cookie e Privacy

Microsoft MVP

My MVP Profile

Microsoft Certified Professional

Microsoft Specialist

Xamarin Certified Mobile Developer

Il mio libro su VB 2015!

Pre-ordina il mio libro su VB 2015 Pre-ordina il mio libro "Visual Basic 2015 Unleashed". Clicca sulla copertina per informazioni!

Il mio libro su WPF 4.5.1!

Clicca sulla copertina per informazioni! E' uscito il mio libro "Programmare con WPF 4.5.1". Clicca sulla copertina per informazioni!

These postings are provided 'AS IS' for entertainment purposes only with absolutely no warranty expressed or implied and confer no rights.
If you're not an Italian user, please visit my English blog

Le vostre visite

I'm a VB!

Guarda la mia intervista a Seattle

Follow me on Twitter!

Altri spazi

GitHub
I miei progetti open-source su GitHub

Article Categories

Archives

Post Categories

Image Galleries

Privacy Policy

Costruire un Wizard con WPF

A volte capita di voler creare una procedura guidata, definita anche Wizard, in cui si guida l'utente passo per passo ad eseguire delle operazioni in un ordine prestabilito.

In WPF, oltre alla possibilità di creare dei controlli personalizzati, possiamo sfruttare un controllo nativo che si chiama Page Function e che ci consente di creare una Navigation Application. Dopo aver creato un'applicazione WPF in Visual Basic, selezioniamo il comando Add new item del menu Project e selezioniamo il controllo Page Function chiamandolo WizardMain.Xaml, come in figura:

Fatto questo, diciamo al nostro progetto di utilizzare, come startup, la nuova pagina creata. Andiamo quindi nella scheda Application della finestra My Project e selezioniamo il nuovo oggetto:

Supponiamo, quindi, di voler creare una procedura guidata con tre schermate. Ciascuna schermata è costituita da un oggetto Page, ognuno dei quali verrà sfogliato tramite l'infrastruttura per la navigazione offerta da WPF. Iniziamo con la prima, selezionando il comando Add Page del menu Project:

Nella prima pagina così creata, definiamo il seguente XAML, davvero molto semplice, che mostra un messaggio all'utente circa le operazioni da fare e il pulsante per passare alla schermata successiva:

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition/>

            <RowDefinition Height="40"/>

        </Grid.RowDefinitions>

       

        <TextBlock Grid.Row="0" Margin="5" Text="Prima schermata"/>

       

        <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right">

            <Button Name="NextButton" Content="Next>" Width="100" Height="30" Margin="5" />

        </StackPanel>

    </Grid>

Fatto questo, nel code-behind specifichiamo il codice per passare alla schermata successiva:

    Private Sub NextButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) _

                                 Handles NextButton.Click

        Me.NavigationService.Navigate(SecondaSchermata)

    End Sub

Ovviamente, se l'utente deve inserire delle informazioni, sarà necessario prevedere codice che verifichi la validità delle informazioni stesse. In questo frangente ci serve osservare l'esistenza dell'oggetto NavigationService, che espone dei metodi statici per la navigazione tra pagine all'interno di una Navigation Application. SecondaSchermata è l'identificatore dell'istanza, che dichiareremo in seguito, della seconda pagina che aggiungiamo con le modalità viste sopra e che definiamo come segue:

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition/>

            <RowDefinition Height="40"/>

        </Grid.RowDefinitions>

 

        <TextBlock Grid.Row="0" Margin="5" Text="Seconda schermata"/>

 

        <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right">

            <Button Name="BackButton" Content="&lt;Back" Width="100" Height="30" Margin="5" />

            <Button Name="NextButton" Content="Next>" Width="100" Height="30" Margin="5" />

        </StackPanel>

    </Grid>

Di nuovo qui abbiamo un pulsante che ci permette di tornare indietro. Ecco il contenuto del code-behind:

    Private Sub NextButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) _

                                 Handles NextButton.Click

        Me.NavigationService.Navigate(TerzaSchermata)

    End Sub

 

    Private Sub BackButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

                                 Handles BackButton.Click

        Me.NavigationService.GoBack()

    End Sub

Notate l'utilizzo del metodo GoBack che permette di andare indietro. La terza pagina, quella finale e che va creata con le modalità viste in precedenza, può essere proposta in questo modo:

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition/>

            <RowDefinition Height="40"/>

        </Grid.RowDefinitions>

 

        <TextBlock Grid.Row="0" Margin="5" Text="Terza schermata"/>

 

        <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right">

            <Button Name="BackButton" Content="&lt;Back" Width="100" Height="30" Margin="5" />

            <Button Name="FinishButton" Content="Finish!" Width="100" Height="30" Margin="5" />

        </StackPanel>

    </Grid>

Quindi un pulsante per tornare indietro e uno per concludere, che possono essere gestiti in questo modo:

    Private Sub FinishButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) _

                                   Handles FinishButton.Click

        MessageBox.Show("You're done!")

        Application.Current.Shutdown()

 

    End Sub

 

    Private Sub BackButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) _

                                 Handles BackButton.Click

        Me.NavigationService.GoBack()

    End Sub

Da ultimo, possiamo dichiarare le istanze delle varie pagine. Per praticità lo faccio in un modulo, ma potete prevedere una modalità differente:

Module Module1

 

    Friend PrimaSchermata As New Page1

    Friend SecondaSchermata As New Page2

    Friend TerzaSchermata As New Page3

End Module

Prima di avviare l'applicazione dobbiamo però comunicare alla pagina di avvio quale Page utilizzare. Nel file WizardMain.xaml.vb digitiamo quanto segue:

    Private Sub WizardMain_Loaded(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles Me.Loaded

        Me.NavigationService.Navigate(PrimaSchermata)

    End Sub

Se ora provate ad avviare l'applicazione, noterete come, contestualmente allo spostamento tra pagine, viene anche attivata l'interfaccia di navigazione che potete vedere esemplificata nella seguente figura:

Chiaramente quello dell'utilizzo del NavigationService è solo un possibile spunto. Potete scaricare il codice da questo indirizzo dell'area Download di Visual Basic Tips & Tricks.

Alessandro

Print | posted on lunedì 18 maggio 2009 03:00 | Filed Under [ Visual Basic Windows Presentation Foundation ]

Powered by:
Powered By Subtext Powered By ASP.NET