Cenni preliminari sui pennelli di WPF
Tutti gli elementi visibili sullo schermo possono essere visualizzati poiché sono stati disegnati con un pennello. Ad esempio, un pennello viene utilizzato per descrivere lo sfondo di un pulsante, il primo piano di un testo e il riempimento di una forma. In questo argomento vengono presentati i concetti di disegno con i pennelli di Windows Presentation Foundation (WPF) e illustrati alcuni esempi. I pennelli consentono di disegnare oggetti dell'user interface (UI) utilizzando colori semplici e a tinta unita, ma anche set complessi di modelli e immagini.
Disegno con un pennello
Brush "disegna" un'area con un output specifico. Tipi differenti di pennelli generano tipi di output diversi. Alcuni pennelli disegnano un'area con un colore a tinta unita, altri con una sfumatura, un modello, un'immagine o un disegno. Nell'immagine riportata di seguito vengono illustrati esempi di tutti i diversi tipi di Brush.
Esempi di pennello
.jpg "Tipi di pennello")
La maggior parte degli oggetti visivi consente di specificare il modo in cui vengono disegnati. Nella tabella riportata di seguito vengono elencati alcuni oggetti e proprietà comuni con cui è possibile utilizzare un oggetto Brush.
Classe |
Proprietà del pennello |
|---|---|
Nella sezione riportata di seguito vengono descritti i vari tipi di Brush e viene fornito un esempio per ciascuno di essi.
Disegnare con un oggetto Color a tinta unita
SolidColorBrush disegna un'area con un oggetto Color a tinta unita. Sono disponibili molti modi per specificare l'oggetto Color di un oggetto SolidColorBrush: ad esempio, è possibile specificare i canali alfa, rosso, blu e verde oppure utilizzare uno dei colori predefiniti forniti dalla classe Colors.
Nell'esempio seguente viene utilizzato un oggetto SolidColorBrush per disegnare l'oggetto Fill di Rectangle. Nell'immagine riportata di seguito viene illustrato il rettangolo disegnato.
Rettangolo disegnato con un oggetto SolidColorBrush
.png "Rettangolo disegnato utilizzando SolidColorBrush")
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a SolidColorBrush and use it to
' paint the rectangle.
Dim myBrush As New SolidColorBrush(Colors.Red)
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a SolidColorBrush and use it to
// paint the rectangle.
SolidColorBrush myBrush = new SolidColorBrush(Colors.Red);
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<SolidColorBrush Color="Red" />
</Rectangle.Fill>
</Rectangle>
Per ulteriori informazioni sulla classe SolidColorBrush, vedere Cenni sul disegno con colori a tinta unita e sfumature.
Disegnare con una sfumatura lineare
LinearGradientBrush disegna un'area con una sfumatura lineare. Una sfumatura lineare consente di fondere due o più colori lungo una linea definita asse di sfumatura. Per specificare i colori della sfumatura e le relative posizioni, utilizzare gli oggetti GradientStop.
Nell'esempio seguente viene utilizzato LinearGradientBrush per disegnare l'oggetto Fill di Rectangle. Nell'immagine riportata di seguito viene illustrato il rettangolo disegnato.
Rettangolo disegnato con un oggetto LinearGradientBrush
.jpg "Rettangolo disegnato utilizzando LinearGradientBrush")
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a LinearGradientBrush and use it to
' paint the rectangle.
Dim myBrush As New LinearGradientBrush()
myBrush.GradientStops.Add(New GradientStop(Colors.Yellow, 0.0))
myBrush.GradientStops.Add(New GradientStop(Colors.Orange, 0.5))
myBrush.GradientStops.Add(New GradientStop(Colors.Red, 1.0))
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a LinearGradientBrush and use it to
// paint the rectangle.
LinearGradientBrush myBrush = new LinearGradientBrush();
myBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 0.0));
myBrush.GradientStops.Add(new GradientStop(Colors.Orange, 0.5));
myBrush.GradientStops.Add(new GradientStop(Colors.Red, 1.0));
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<LinearGradientBrush>
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Orange" Offset="0.5" />
<GradientStop Color="Red" Offset="1.0" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
Per ulteriori informazioni sulla classe LinearGradientBrush, vedere Cenni sul disegno con colori a tinta unita e sfumature.
Disegnare con una sfumatura radiale
RadialGradientBrush disegna un'area con una sfumatura radiale. Una sfumatura radiale consente di fondere due o più colori in un cerchio. Come per la classe LinearGradientBrush, per specificare i colori della sfumatura e le relative posizioni, utilizzare GradientStop.
Nell'esempio seguente viene utilizzato RadialGradientBrush per disegnare l'oggetto Fill di un oggetto Rectangle. Nell'immagine riportata di seguito viene illustrato il rettangolo disegnato.
Rettangolo disegnato con un oggetto RadialGradientBrush
.jpg "Rettangolo disegnato utilizzando RadialGradientBrush")
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a RadialGradientBrush and use it to
' paint the rectangle.
Dim myBrush As New RadialGradientBrush()
myBrush.GradientOrigin = New Point(0.75, 0.25)
myBrush.GradientStops.Add(New GradientStop(Colors.Yellow, 0.0))
myBrush.GradientStops.Add(New GradientStop(Colors.Orange, 0.5))
myBrush.GradientStops.Add(New GradientStop(Colors.Red, 1.0))
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a RadialGradientBrush and use it to
// paint the rectangle.
RadialGradientBrush myBrush = new RadialGradientBrush();
myBrush.GradientOrigin = new Point(0.75, 0.25);
myBrush.GradientStops.Add(new GradientStop(Colors.Yellow, 0.0));
myBrush.GradientStops.Add(new GradientStop(Colors.Orange, 0.5));
myBrush.GradientStops.Add(new GradientStop(Colors.Red, 1.0));
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="0.75,0.25">
<GradientStop Color="Yellow" Offset="0.0" />
<GradientStop Color="Orange" Offset="0.5" />
<GradientStop Color="Red" Offset="1.0" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
Per ulteriori informazioni sulla classe RadialGradientBrush, vedere Cenni sul disegno con colori a tinta unita e sfumature.
Disegnare con un oggetto Image
ImageBrush disegna un'area con un oggetto ImageSource.
Nell'esempio seguente viene utilizzato un oggetto ImageBrush per disegnare l'oggetto Fill di un oggetto Rectangle. Nell'immagine riportata di seguito viene mostrato il rettangolo disegnato.
Rettangolo disegnato con un oggetto Image
.jpg "Rettangolo disegnato utilizzando ImageBrush")
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create an ImageBrush and use it to
' paint the rectangle.
Dim myBrush As New ImageBrush()
myBrush.ImageSource = New BitmapImage(New Uri("sampleImages\pinkcherries.jpg", UriKind.Relative))
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create an ImageBrush and use it to
// paint the rectangle.
ImageBrush myBrush = new ImageBrush();
myBrush.ImageSource =
new BitmapImage(new Uri(@"sampleImages\pinkcherries.jpg", UriKind.Relative));
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<ImageBrush ImageSource="sampleImages\pinkcherries.jpg" />
</Rectangle.Fill>
</Rectangle>
Per ulteriori informazioni sulla classe ImageBrush, vedere Disegnare con oggetti Image, Drawing e Visual.
Disegnare con un oggetto Drawing
DrawingBrush disegna un'area con un oggetto Drawing. Drawing può contenere forme, immagini, testi e contenuti multimediali.
Nell'esempio seguente viene utilizzato DrawingBrush per disegnare l'oggetto Fill di un oggetto Rectangle. Nell'immagine riportata di seguito viene mostrato il rettangolo disegnato.
Rettangolo disegnato con un oggetto DrawingBrush
.jpg "Rettangolo disegnato utilizzando DrawingBrush")
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a DrawingBrush and use it to
' paint the rectangle.
Dim myBrush As New DrawingBrush()
Dim backgroundSquare As New GeometryDrawing(Brushes.White, Nothing, New RectangleGeometry(New Rect(0, 0, 100, 100)))
Dim aGeometryGroup As New GeometryGroup()
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(0, 0, 50, 50)))
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(50, 50, 50, 50)))
Dim checkerBrush As New LinearGradientBrush()
checkerBrush.GradientStops.Add(New GradientStop(Colors.Black, 0.0))
checkerBrush.GradientStops.Add(New GradientStop(Colors.Gray, 1.0))
Dim checkers As New GeometryDrawing(checkerBrush, Nothing, aGeometryGroup)
Dim checkersDrawingGroup As New DrawingGroup()
checkersDrawingGroup.Children.Add(backgroundSquare)
checkersDrawingGroup.Children.Add(checkers)
myBrush.Drawing = checkersDrawingGroup
myBrush.Viewport = New Rect(0, 0, 0.25, 0.25)
myBrush.TileMode = TileMode.Tile
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a DrawingBrush and use it to
// paint the rectangle.
DrawingBrush myBrush = new DrawingBrush();
GeometryDrawing backgroundSquare =
new GeometryDrawing(
Brushes.White,
null,
new RectangleGeometry(new Rect(0, 0, 100, 100)));
GeometryGroup aGeometryGroup = new GeometryGroup();
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(0, 0, 50, 50)));
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(50, 50, 50, 50)));
LinearGradientBrush checkerBrush = new LinearGradientBrush();
checkerBrush.GradientStops.Add(new GradientStop(Colors.Black, 0.0));
checkerBrush.GradientStops.Add(new GradientStop(Colors.Gray, 1.0));
GeometryDrawing checkers = new GeometryDrawing(checkerBrush, null, aGeometryGroup);
DrawingGroup checkersDrawingGroup = new DrawingGroup();
checkersDrawingGroup.Children.Add(backgroundSquare);
checkersDrawingGroup.Children.Add(checkers);
myBrush.Drawing = checkersDrawingGroup;
myBrush.Viewport = new Rect(0, 0, 0.25, 0.25);
myBrush.TileMode = TileMode.Tile;
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<DrawingBrush Viewport="0,0,0.25,0.25" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="White">
<GeometryDrawing.Geometry>
<RectangleGeometry Rect="0,0,100,100" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing>
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,50,50" />
<RectangleGeometry Rect="50,50,50,50" />
</GeometryGroup>
</GeometryDrawing.Geometry>
<GeometryDrawing.Brush>
<LinearGradientBrush>
<GradientStop Offset="0.0" Color="Black" />
<GradientStop Offset="1.0" Color="Gray" />
</LinearGradientBrush>
</GeometryDrawing.Brush>
</GeometryDrawing>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Rectangle.Fill>
</Rectangle>
Per ulteriori informazioni sulla classe DrawingBrush, vedere Disegnare con oggetti Image, Drawing e Visual.
Disegnare con un oggetto Visual
VisualBrush disegna un'area con Visual. Button, Page e MediaElement rappresentano esempi di oggetti Visual. VisualBrush consente inoltre di proiettare il contenuto da una parte dell'applicazione in un'altra area; questa funzione è molto utile per la creazione di effetti reflection e per l'ingrandimento di parti dello schermo.
Nell'esempio seguente viene utilizzato VisualBrush per disegnare l'oggetto Fill di un oggetto Rectangle. Nell'immagine riportata di seguito viene illustrato il rettangolo disegnato.
Rettangolo disegnato con un oggetto VisualBrush
.jpg "Rettangolo disegnato utilizzando VisualBrush")
Dim exampleRectangle As New Rectangle()
exampleRectangle.Width = 75
exampleRectangle.Height = 75
' Create a VisualBrush and use it
' to paint the rectangle.
Dim myBrush As New VisualBrush()
'
' Create the brush's contents.
'
Dim aPanel As New StackPanel()
' Create a DrawingBrush and use it to
' paint the panel.
Dim myDrawingBrushBrush As New DrawingBrush()
Dim aGeometryGroup As New GeometryGroup()
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(0, 0, 50, 50)))
aGeometryGroup.Children.Add(New RectangleGeometry(New Rect(50, 50, 50, 50)))
Dim checkerBrush As New RadialGradientBrush()
checkerBrush.GradientStops.Add(New GradientStop(Colors.MediumBlue, 0.0))
checkerBrush.GradientStops.Add(New GradientStop(Colors.White, 1.0))
Dim checkers As New GeometryDrawing(checkerBrush, Nothing, aGeometryGroup)
myDrawingBrushBrush.Drawing = checkers
aPanel.Background = myDrawingBrushBrush
' Create some text.
Dim someText As New TextBlock()
someText.Text = "Hello, World"
Dim fSizeConverter As New FontSizeConverter()
someText.FontSize = CDbl(fSizeConverter.ConvertFromString("10pt"))
someText.Margin = New Thickness(10)
aPanel.Children.Add(someText)
myBrush.Visual = aPanel
exampleRectangle.Fill = myBrush
Rectangle exampleRectangle = new Rectangle();
exampleRectangle.Width = 75;
exampleRectangle.Height = 75;
// Create a VisualBrush and use it
// to paint the rectangle.
VisualBrush myBrush = new VisualBrush();
//
// Create the brush's contents.
//
StackPanel aPanel = new StackPanel();
// Create a DrawingBrush and use it to
// paint the panel.
DrawingBrush myDrawingBrushBrush = new DrawingBrush();
GeometryGroup aGeometryGroup = new GeometryGroup();
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(0, 0, 50, 50)));
aGeometryGroup.Children.Add(new RectangleGeometry(new Rect(50, 50, 50, 50)));
RadialGradientBrush checkerBrush = new RadialGradientBrush();
checkerBrush.GradientStops.Add(new GradientStop(Colors.MediumBlue, 0.0));
checkerBrush.GradientStops.Add(new GradientStop(Colors.White, 1.0));
GeometryDrawing checkers = new GeometryDrawing(checkerBrush, null, aGeometryGroup);
myDrawingBrushBrush.Drawing = checkers;
aPanel.Background = myDrawingBrushBrush;
// Create some text.
TextBlock someText = new TextBlock();
someText.Text = "Hello, World";
FontSizeConverter fSizeConverter = new FontSizeConverter();
someText.FontSize = (double)fSizeConverter.ConvertFromString("10pt");
someText.Margin = new Thickness(10);
aPanel.Children.Add(someText);
myBrush.Visual = aPanel;
exampleRectangle.Fill = myBrush;
<Rectangle Width="75" Height="75">
<Rectangle.Fill>
<VisualBrush TileMode="Tile">
<VisualBrush.Visual>
<StackPanel>
<StackPanel.Background>
<DrawingBrush>
<DrawingBrush.Drawing>
<GeometryDrawing>
<GeometryDrawing.Brush>
<RadialGradientBrush>
<GradientStop Color="MediumBlue" Offset="0.0" />
<GradientStop Color="White" Offset="1.0" />
</RadialGradientBrush>
</GeometryDrawing.Brush>
<GeometryDrawing.Geometry>
<GeometryGroup>
<RectangleGeometry Rect="0,0,50,50" />
<RectangleGeometry Rect="50,50,50,50" />
</GeometryGroup>
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingBrush.Drawing>
</DrawingBrush>
</StackPanel.Background>
<TextBlock FontSize="10pt" Margin="10">Hello, World!</TextBlock>
</StackPanel>
</VisualBrush.Visual>
</VisualBrush>
</Rectangle.Fill>
</Rectangle>
Per ulteriori informazioni sulla classe VisualBrush, vedere Disegnare con oggetti Image, Drawing e Visual.
Disegnare utilizzando pennelli predefiniti e di sistema
Per motivi di praticità, in Windows Presentation Foundation (WPF) viene fornito un set di pennelli predefiniti e di sistema che può essere utilizzato per disegnare oggetti.
Per un elenco dei pennelli predefiniti disponibili, vedere la classe Brushes. Per un esempio in cui viene illustrato come utilizzare un pennello predefinito, vedere Procedura: disegnare un'area con un colore a tinta unita.
Per un elenco dei pennelli di sistema disponibili, vedere la classe SystemColors. Per un esempio, vedere Procedura: disegnare un'area con un pennello di sistema.
Funzionalità comuni dei pennelli
Gli oggetti Brush forniscono una proprietà Opacity che può essere utilizzata per rendere trasparente un pennello, in modo completo oppure parziale. Un valore Opacity pari a 0 rende un pennello completamente trasparente, mentre un valore Opacity pari a 1 lo rende completamente opaco. Nell'esempio seguente viene utilizzata la proprietà Opacity per rendere l'oggetto opaco al 25% SolidColorBrush.
<Rectangle Width="100" Height="100">
<Rectangle.Fill>
<SolidColorBrush Color="Blue" Opacity="0.25" />
</Rectangle.Fill>
</Rectangle>
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 100;
myRectangle.Height = 100;
SolidColorBrush partiallyTransparentSolidColorBrush
= new SolidColorBrush(Colors.Blue);
partiallyTransparentSolidColorBrush.Opacity = 0.25;
myRectangle.Fill = partiallyTransparentSolidColorBrush;
Se il pennello contiene colori parzialmente trasparenti, il valore di opacità del colore viene combinato, tramite moltiplicazione, al valore di opacità del pennello. Ad esempio, se un pennello dispone di un valore di opacità pari a 0,5 e anche un colore utilizzato dal pennello dispone dello stesso valore, il colore di output avrà un valore di opacità pari a 0,25.
.gif "Nota") Nota |
|---|
È più efficiente modificare il valore di opacità di un pennello anziché cambiare l'opacità di un elemento intero utilizzando la proprietà UIElement.Opacity. |
È possibile ruotare, ridimensionare, inclinare e traslare il contenuto di un pennello utilizzando la rela tiva proprietà Transform o RelativeTransform. Per ulteriori informazioni, vedere Cenni preliminari sulle proprietà di trasformazione Brush.
Poiché si tratta di oggetti Animatable, è possibile aggiungere un'animazione agli oggetti Brush. Per ulteriori informazioni, vedere Cenni preliminari sull'animazione.
Funzionalità dell'oggetto Freezable
Poiché eredita dalla classe Freezable, la classe Brush fornisce diverse funzionalità speciali: gli oggetti Brush possono essere dichiarati come risorse, condivisi tra più oggetti e clonati. Inoltre, tutti i tipi di oggetti Brush, eccetto VisualBrush possono essere resi di sola lettura (per migliorare le prestazioni) e thread-safe.
Per ulteriori informazioni sulle diverse funzionalità fornite dagli oggetti Freezable, vedere Cenni preliminari sugli oggetti Freezable.
Per ulteriori informazioni sul motivo per cui gli oggetti VisualBrush non possono essere bloccati, vedere la pagina relativa al tipo VisualBrush.
Vedere anche
Riferimenti
Concetti
Cenni sul disegno con colori a tinta unita e sfumature
Disegnare con oggetti Image, Drawing e Visual
Cenni preliminari sugli oggetti Freezable
Ottimizzazione delle prestazioni: altri suggerimenti