WPF – Il controllo Rectangle

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 di tipo Rectangle è un contenitore rettangolare con un bordo e con un’area interna dove possono essere disposti i controlli e che può essere variamente colorata con un gradiente o riempita con un’immagine (ved. figura seguente).

27.23

La definizione XAML predefinita è la seguente:

   1:  <Rectangle
   2:    Height="100"
   3:    HorizontalAlignment="Left"
   4:    Margin="10,10,0,0"
   5:    Name="Rectangle1"
   6:    Stroke="Black"
   7:    VerticalAlignment="Top"
   8:    Width="200" />

 

Vediamo ora un esempio di codice XAML con un gradiente ovale e alcune etichette:

   1:  <!-- Esempio: 27.11 -->
   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="237" Width="362">
   6:    <Grid
   7:      Height="198"
   8:      Width="335">
   9:    <Rectangle
  10:      Height="182"
  11:      HorizontalAlignment="Left"
  12:      Margin="10,10,0,0"
  13:      Name="Rectangle1"
  14:      VerticalAlignment="Top"
  15:      Width="318"
  16:      OpacityMask="#FF00009D">
  17:      <Rectangle.Stroke>
  18:      <LinearGradientBrush
  19:        EndPoint="1,0.5"
  20:        StartPoint="0,0.5">
  21:       <GradientStop
  22:          Color="Black"
  23:          Offset="0.344" />
  24:        <GradientStop
  25:          Color="#FF902C2C"
  26:          Offset="0.754" />
  27:      </LinearGradientBrush>
  28:      </Rectangle.Stroke>
  29:      <Rectangle.Fill>
  30:        <RadialGradientBrush>
  31:          <GradientStop
  32:             Color="#AD000074"
  33:             Offset="0.828" />
  34:           <GradientStop
  35:             Color="White"
  36:             Offset="0" />
  37:        </RadialGradientBrush>
  38:      </Rectangle.Fill>
  39:    </Rectangle>
  40:    <Label
  41:      Content="Terra"
  42:      Height="28"
  43:      HorizontalAlignment="Left"
  44:      Margin="202,41,0,0"
  45:      Name="Label1"
  46:      VerticalAlignment="Top"
  47:      Foreground="#FFF5EFEF"
  48:      FontWeight="Bold"
  49:      FontSize="15" />
  50:    <Label
  51:      Content="Sole"
  52:      Height="36"
  53:      HorizontalAlignment="Left"
  54:      Margin="120,65,0,0"
  55:      Name="Label2"
  56:      VerticalAlignment="Top"
  57:      Foreground="#FF030300"
  58:      FontSize="18"
  59:      FontWeight="Bold" />
  60:    <Label
  61:      Content="Luna"
  62:      Height="28"
  63:      HorizontalAlignment="Left"
  64:      Margin="232,65,0,0"
  65:      Name="Label3"
  66:      VerticalAlignment="Top"
  67:      Foreground="#FFF5ECEC"
  68:      FontWeight="Bold"
  69:      FontSize="14" />
  70:    </Grid>
  71:  </Window>

 

In questo caso non abbiamo inserito del codice, in quanto gli eventi sono abbastanza simili a quelli del controllo Border che abbiamo già visto in precedenza, in questo stesso capitolo. La seguente figura mostra il risultato.

27.24

Pubblicato il 26 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: