WPF – Il controllo Image

Questo testo fa parte del capitolo 27 del libro “Visual Basic 2010 spiegato a mia nonna” che sarà pubblicato fra poche settimane. Trovate l’esempio di codice tra gli esempi liberamente scaricabili al seguente indirizzo:https://deghetto.wordpress.com/2011/02/05/libro-visual-basic-2010-spiegato-a-mia-nonna/

Un controllo Image di WPF ha la stessa funzione del suo omologo di Windows Forms: visualizzare delle immagini. Nella seguente figura potete vedere il controllo in fase di progettazione.

27.15

La definizione XAML predefinita è la seguente:

   1:  <Image
   2:    Height="150"
   3:    HorizontalAlignment="Left"
   4:    Margin="10,10,0,0"
   5:    Name="Image1"
   6:    Stretch="Fill"
   7:    VerticalAlignment="Top"
   8:    Width="200" />

 

Vediamo ora un esempio che permette di visualizzare un insieme di immagini incluse nell’applicazione. A ogni click che l’utente farà sull’immagine, quest’ultima passerà alla visualizzazione dell’immagine successiva. All’ultima immagine, infine, la visualizzazione tornerà alla prima immagine. Il codice XAML è il seguente:

   1:  <!—Esempio 27.07 -->
   2:    <Window x:Class="MainWindow"
   3:      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   4:      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   5:      Title="MainWindow" Height="393" Width="482">
   6:      <Grid>
   7:        <Image
   8:          Height="301"
   9:          HorizontalAlignment="Center"
  10:          Margin="28,12,30,0"
  11:          Name="Image1"
  12:          Stretch="Uniform"
  13:          VerticalAlignment="Top"
  14:          Width="402"
  15:          Source="/27.07;component/Koala.jpg"
  16:          ClipToBounds="True" />
  17:        <Label
  18:          Content="Clicca sull'immagine per cambiarla"
  19:          Height="28"
  20:          HorizontalAlignment="Center"
  21:          Margin="28,314,30,0"
  22:          Name="Label1"
  23:          VerticalAlignment="Top"
  24:          Width="402"
  25:          FontWeight="Normal" />
  26:      </Grid>
  27:    </Window>

 

Il codice Visual Basic, invece, è il seguente:

   1:  ' Esempio: 27.07
   2:  Class MainWindow
   3:    Private indice As Integer = 1
   4:    Private arrayImmagini(2) As String
   5:    Public Sub New()
   6:      ' Chiamata richiesta dalla finestra di progettazione.
   7:      InitializeComponent()
   8:      ' Aggiungere le eventuali istruzioni di inizializzazione
   9:      ' dopo la chiamata a InitializeComponent().
  10:      arrayImmagini(0) = ".\Koala.jpg"
  11:      arrayImmagini(1) = ".\Lighthouse.jpg"
  12:      arrayImmagini(2) = ".\Penguins.jpg"
  13:      Call CaricaImmagine()
  14:    End Sub
  15:    Private Sub Image1_MouseDown(
  16:        ByVal sender As Object,
  17:        ByVal e As _
  18:          System.Windows.Input.MouseButtonEventArgs) _
  19:        Handles Image1.MouseDown
  20:      Call CaricaImmagine()
  21:    End Sub
  22:    Private Sub CaricaImmagine()
  23:      Dim i As Image = New Image()
  24:      Dim src As BitmapImage = New BitmapImage()
  25:      src.BeginInit()
  26:      src.UriSource = New Uri(
  27:        arrayImmagini(indice),
  28:        UriKind.Relative)
  29:      src.CacheOption =
  30:        BitmapCacheOption.OnLoad
  31:      src.EndInit()
  32:      Me.Image1.Source = src
  33:      Me.Image1.Stretch =
  34:        Stretch.Uniform
  35:      ' scorrimento dell'immagine
  36:      indice += 1
  37:      If indice = 3 Then
  38:        indice = 0
  39:      End If
  40:    End Sub
  41:  End Class

Nella seguente figura potete osservare il funzionamento dell’applicazione.

27.16

Pubblicato il 17 febbraio 2011 su Novità. Aggiungi ai preferiti il collegamento . Lascia un commento.

Lascia un commento

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...

%d blogger cliccano Mi Piace per questo: