Cenni sul disegno con colori a tinta unita e sfumaturePainting with Solid Colors and Gradients Overview

In questo argomento viene descritto come SolidColorBrushutilizzare LinearGradientBrushgli oggetti RadialGradientBrush , e per disegnare con colori a tinta unita, sfumature lineari e sfumature radiali.This topic describes how to use SolidColorBrush, LinearGradientBrush, and RadialGradientBrush objects to paint with solid colors, linear gradients, and radial gradients.

Disegno di un'area con un colore a tinta unitaPainting an Area with a Solid Color

Una delle operazioni più comuni in qualsiasi piattaforma consiste nel disegnare un'area con un solido Color.One of the most common operations in any platform is to paint an area with a solid Color. Per eseguire questa attività, Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) fornisce la SolidColorBrush classe.To accomplish this task, Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) provides the SolidColorBrush class. Le sezioni seguenti descrivono i diversi modi di disegnare con SolidColorBrushun oggetto.The following sections describe the different ways to paint with a SolidColorBrush.

Uso di una classe SolidColorBrush in "XAML"Using a SolidColorBrush in "XAML"

Per disegnare un'area con un colore a tinta unita in XAMLXAML, usare una delle opzioni seguenti.To paint an area with a solid color in XAMLXAML, use one of the following options.

  • Selezionare un pennello tinta unita predefinito in base al nome.Select a predefined solid color brush by name. Ad esempio, è possibile impostare un pulsante Background su "Red" o "MediumBlue".For example, you can set a button's Background to "Red" or "MediumBlue". Per un elenco di altri pennelli a tinta unita predefiniti, vedere le proprietà statiche Brushes della classe.For a list of other predefined solid color brushes, see the static properties of the Brushes class. Di seguito è riportato un esempio.The following is an example.

    <!-- This button's background is painted with a red SolidColorBrush,
         described using a named color. -->
    <Button Background="Red">A Button</Button>
    
  • Scegliere un colore dalla tavolozza dei colori a 32 bit specificando la quantità di rosso, verde e blu da combinare in un solo colore a tinta unita.Choose a color from the 32-bit color palette by specifying the amounts of red, green, and blue to combine into a single solid color. Il formato per specificare un colore dalla tavolozza a 32 bit è " #rrggbb", dove rr è un numero esadecimale a due cifre che specifica la quantità relativa di rosso, gg specifica la quantità di colore verde e bb specifica la quantità di blu.The format for specifying a color from the 32-bit palette is "#rrggbb", where rr is a two digit hexadecimal number specifying the relative amount of red, gg specifies the amount of green, and bb specifies the amount of blue. Il colore può essere specificato anche come "#aarrggbb" in cui aa specifica il valore alpha o la trasparenza del colore.Additionally, the color can be specified as "#aarrggbb" where aa specifies the alpha value, or transparency, of the color. Questo approccio consente di creare colori parzialmente trasparenti.This approach enables you to create colors that are partially transparent. Nell'esempio seguente, l'oggetto Background di un Button oggetto viene impostato su un rosso completamente opaco utilizzando la notazione esadecimale.In the following example, the Background of a Button is set to fully-opaque red using hexadecimal notation.

    <!-- This button's background is painted with a red SolidColorBrush,
         described using hexadecimal notation. -->
    <Button Background="#FFFF0000">A Button</Button>
    
  • Usare la sintassi del tag di proprietà SolidColorBrushper descrivere un oggetto.Use property tag syntax to describe a SolidColorBrush. Questa sintassi è più dettagliata ma consente di specificare impostazioni aggiuntive, ad esempio l'opacità del pennello.This syntax is more verbose but enables you to specify additional settings, such as the brush's opacity. Nell'esempio seguente, le proprietà Background di due Button elementi sono impostate su un rosso completamente opaco.In the following example, the Background properties of two Button elements are set to fully-opaque red. Il colore del primo pennello viene descritto usando un nome di colore predefinito.The first brush's color is described using a predefined color name. Il colore del secondo pennello viene descritto tramite notazione esadecimale.The second brush's color is described using hexadecimal notation.

    <!-- Both of these buttons' backgrounds are painted with red 
         SolidColorBrush objects, described using object element
         syntax. -->
    <Button>A Button
    
      <Button.Background>
        <SolidColorBrush Color="Red" />
      </Button.Background>
    </Button>
    
    <Button>A Button
    
      <Button.Background>
        <SolidColorBrush Color="#FFFF0000" />
      </Button.Background>
    </Button>  
    

Disegno con una classe SolidColorBrush nel codicePainting with a SolidColorBrush in Code

Per disegnare un'area con un colore a tinta unita nel codice, usare una delle opzioni seguenti.To paint an area with a solid color in code, use one of the following options.

  • Usare uno dei pennelli predefiniti forniti dalla Brushes classe.Use one of the predefined brushes provided by the Brushes class. Nell'esempio seguente, l' Background oggetto di un oggetto Button è impostato Redsu.In the following example, the Background of a Button is set to Red.

    Button myButton = new Button();
    myButton.Content = "A Button";
    myButton.Background = Brushes.Red;  
    
  • Creare un SolidColorBrush oggetto e impostarne la Color proprietà Color utilizzando una struttura.Create a SolidColorBrush and set its Color property using a Color structure. È possibile usare un colore Colors predefinito della classe oppure è possibile creare un oggetto Color usando il metodo statico FromArgb .You can use a predefined color from the Colors class or you can create a Color using the static FromArgb method.

    Nell'esempio seguente viene illustrato come impostare la Color proprietà di un SolidColorBrush oggetto utilizzando un colore predefinito.The following example shows how to set the Color property of a SolidColorBrush using a predefined color.

    Button myButton = new Button();
    myButton.Content = "A Button";
    
    SolidColorBrush mySolidColorBrush = new SolidColorBrush();
    mySolidColorBrush.Color = Colors.Red;
    myButton.Background = mySolidColorBrush;
    

L'oggetto FromArgb statico consente di specificare i valori alfa, rosso, verde e blu del colore.The static FromArgb enables you to specify the color's alpha, red, green, and blue values. L'intervallo tipico per ognuno di questi valori è 0-255.The typical range for each of these values is 0-255. Un valore alfa ad esempio pari a 0 indica che un colore è completamente trasparente e un valore pari a 255 indica che il colore è completamente opaco.For example, an alpha value of 0 indicates that a color is completely transparent, while a value of 255 indicates the color is completely opaque. Analogamente, un valore 0 relativo al colore rosso indica la totale assenza di rosso nel colore mentre un valore 255 indica la quantità di rosso massima possibile.Likewise, a red value of 0 indicates that a color has no red in it, while a value of 255 indicates a color has the maximum amount of red possible. Nell'esempio seguente viene descritto il colore di un pennello specificando i valori alfa, rosso, verde e blu.In the following example, a brush's color is described by specifying alpha, red, green, and blue values.

Button myButton = new Button();
myButton.Content = "A Button";

SolidColorBrush mySolidColorBrush = new SolidColorBrush();
mySolidColorBrush.Color = 
    Color.FromArgb(
        255, // Specifies the transparency of the color.
        255, // Specifies the amount of red.
        0, // specifies the amount of green.
        0); // Specifies the amount of blue.
        
myButton.Background = mySolidColorBrush;

Per altri modi per specificare il colore, vedere Color l'argomento di riferimento.For additional ways to specify color, see the Color reference topic.

Disegno di un'area con una sfumaturaPainting an Area with a Gradient

Un pennello sfumato consente di disegnare un'area con più colori che si fondono tra loro lungo un asse.A gradient brush paints an area with multiple colors that blend into each other along an axis. È possibile usarlo per creare luci e ombre offrendo ai controlli un effetto tridimensionale.You can use them to create impressions of light and shadow, giving your controls a three-dimensional feel. È anche possibile usarlo per simulare l'effetto cristallo, cromato, acqua e altre superfici uniformi.You can also use them to simulate glass, chrome, water, and other smooth surfaces. WPFWPFfornisce due tipi di pennelli sfumatura RadialGradientBrush: LinearGradientBrush e.provides two types of gradient brushes: LinearGradientBrush and RadialGradientBrush.

Sfumature lineariLinear Gradients

Disegna un'area con una sfumatura definita lungo una riga, ovvero l' asse delle sfumature. LinearGradientBrushA LinearGradientBrush paints an area with a gradient defined along a line, the gradient axis. È possibile specificare i colori della sfumatura e la relativa posizione lungo l' GradientStop asse delle sfumature utilizzando gli oggetti.You specify the gradient's colors and their location along the gradient axis using GradientStop objects. È anche possibile modificare l'asse delle sfumature, che consente di creare sfumature orizzontali e verticali e di invertire la direzione della sfumatura.You may also modify the gradient axis, which enables you to create horizontal and vertical gradients and to reverse the gradient direction. L'asse delle sfumature viene descritto nella sezione successiva.The gradient axis is described in the next section. Per impostazione predefinita, viene creata una sfumatura diagonale.By default, a diagonal gradient is created.

L'esempio seguente illustra il codice che crea una sfumatura lineare con quattro colori.The following example shows the code that creates a linear gradient with four colors.

<!-- This rectangle is painted with a diagonal linear gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
      <GradientStop Color="Yellow" Offset="0.0" />
      <GradientStop Color="Red" Offset="0.25" />
      <GradientStop Color="Blue" Offset="0.75" />
      <GradientStop Color="LimeGreen" Offset="1.0" />
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>
Rectangle diagonalFillRectangle = new Rectangle();
diagonalFillRectangle.Width = 200;
diagonalFillRectangle.Height = 100;

// Create a diagonal linear gradient with four stops.   
LinearGradientBrush myLinearGradientBrush =
    new LinearGradientBrush();
myLinearGradientBrush.StartPoint = new Point(0,0);
myLinearGradientBrush.EndPoint = new Point(1,1);
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Yellow, 0.0));
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Red, 0.25));                
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Blue, 0.75));        
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.LimeGreen, 1.0));
    
// Use the brush to paint the rectangle.
diagonalFillRectangle.Fill = myLinearGradientBrush;

Il codice produce la sfumatura seguente:This code produces the following gradient:

Una sfumatura lineare diagonaleA diagonal linear gradient

Nota

Gli esempi di sfumatura in questo argomento usano il sistema di coordinate predefinito per l'impostazione di punti di inizio e di fine.The gradient examples in this topic use the default coordinate system for setting start points and end points. Il sistema di coordinate predefinito è relativo a un rettangolo di delimitazione: 0 indica lo 0% del rettangolo di delimitazione e 1 indica il 100% del rettangolo di delimitazione.The default coordinate system is relative to a bounding box: 0 indicates 0 percent of the bounding box and 1 indicates 100 percent of the bounding box. È possibile modificare questo sistema di coordinate impostando MappingMode la proprietà sul valore Absolute.You can change this coordinate system by setting the MappingMode property to the value Absolute. Un sistema di coordinate assoluto non è relativo a un rettangolo di selezione.An absolute coordinate system is not relative to a bounding box. I valori vengono interpretati direttamente nello spazio locale.Values are interpreted directly in local space.

GradientStop È il blocco predefinito di base di un pennello sfumatura.The GradientStop is the basic building block of a gradient brush. Un cursore sfumatura specifica Color un Offset oggetto lungo l'asse delle sfumature.A gradient stop specifies a Color at an Offset along the gradient axis.

  • La Color proprietà del cursore sfumatura specifica il colore del cursore sfumatura.The gradient stop's Color property specifies the color of the gradient stop. È possibile impostare il colore usando un colore predefinito (fornito dalla Colors classe) o specificando i valori ScRGB o ARGB.You may set the color by using a predefined color (provided by the Colors class) or by specifying ScRGB or ARGB values. In XAMLXAML, è anche possibile usare la notazione esadecimale per descrivere un colore.In XAMLXAML, you may also use hexadecimal notation to describe a color. Per ulteriori informazioni, vedere la Color struttura.For more information, see the Color structure.

  • La Offset proprietà del cursore sfumatura specifica la posizione del colore del cursore sfumatura sull'asse delle sfumature.The gradient stop's Offset property specifies the position of the gradient stop's color on the gradient axis. L'offset è un Double valore compreso tra 0 e 1.The offset is a Double that ranges from 0 to 1. Più il valore offset del cursore sfumatura si avvicina a 0, più il colore è vicino all'inizio della sfumatura.The closer a gradient stop's offset value is to 0, the closer the color is to the start of the gradient. Più il valore offset della sfumatura si avvicina a 1, più il colore è vicino alla fine della sfumatura.The closer the gradient's offset value is to 1, the closer the color is to the end of the gradient.

Il colore di ogni punto tra i cursori sfumatura è interpolato linearmente come combinazione del colore specificato dai due cursori sfumatura di delimitazione.The color of each point between gradient stops is linearly interpolated as a combination of the color specified by the two bounding gradient stops. L'immagine seguente illustra i cursori sfumatura dell'esempio precedente.The following illustration highlights the gradient stops in the previous example. I cerchi indicano la posizione dei cursori sfumatura e la linea tratteggiata indica l'asse delle sfumature.The circles mark the position of gradient stops and a dashed line shows the gradient axis.

Cursori sfumatura in una sfumatura lineareGradient stops in a linear gradient

Il primo cursore sfumatura specifica il colore giallo in un offset di 0.0.The first gradient stop specifies the color yellow at an offset of 0.0. Il secondo cursore sfumatura specifica il colore rosso in un offset di 0.25.The second gradient stop specifies the color red at an offset of 0.25. I punti tra questi due cursori cambiano gradualmente da giallo a rosso quando ci si sposta da sinistra a destra lungo l'asse delle sfumature.The points between these two stops gradually change from yellow to red as you move from left to right along the gradient axis. Il terzo cursore sfumatura specifica il colore blu in un offset di 0.75.The third gradient stop specifies the color blue at an offset of 0.75. I punti tra il secondo e il terzo cursore sfumatura cambiano gradualmente da rosso a blu.The points between the second and third gradient stops gradually change from red to blue. Il quarto cursore sfumatura specifica il colore verde lime in un offset di 1.0.The fourth gradient stop specifies the color lime green at an offset of 1.0. I punti tra il terzo e il quarto cursore sfumatura cambiano gradualmente da blu a verde lime.The points between the third and fourth gradient stops gradually change from blue to lime green.

Asse delle sfumatureThe Gradient Axis

Come accennato in precedenza, i cursori sfumatura di un pennello sfumato lineare sono posizionati lungo una riga, l'asse delle sfumature.As previously mentioned, a linear gradient brush's gradient stops are positioned along a line, the gradient axis. È possibile modificare l'orientamento e le dimensioni della linea usando le proprietà StartPoint e EndPoint del pennello.You may change the orientation and size of the line using the brush's StartPoint and EndPoint properties. Modificando l'oggetto del pennello StartPoint e EndPoint, è possibile creare sfumature orizzontali e verticali, invertire la direzione della sfumatura, ridurre la diffusione della sfumatura e altro ancora.By manipulating the brush's StartPoint and EndPoint, you can create horizontal and vertical gradients, reverse the gradient direction, condense the gradient spread, and more.

Per impostazione predefinita, i pennelli StartPoint sfumatura lineare e EndPoint sono relativi all'area da disegnare.By default, the linear gradient brush's StartPoint and EndPoint are relative to the area being painted. Il punto (0,0) rappresenta l'angolo superiore sinistro dell'area da disegnare e (1,1) rappresenta l'angolo inferiore destro dell'area da disegnare.The point (0,0) represents the upper-left corner of the area being painted, and (1,1) represents the lower-right corner of the area being painted. Il valore StartPoint predefinito di LinearGradientBrush a è (0, 0) e il valore EndPoint predefinito è (1,1), che crea una sfumatura diagonale a partire dall'angolo superiore sinistro e si estende all'angolo inferiore destro dell'area da disegnare.The default StartPoint of a LinearGradientBrush is (0,0), and its default EndPoint is (1,1), which creates a diagonal gradient starting at the upper-left corner and extending to the lower-right corner of the area being painted. Nella figura seguente viene illustrato l'asse delle sfumature di un pennello sfumato EndPointlineare con e predefinito StartPoint .The following illustration shows the gradient axis of a linear gradient brush with default StartPoint and EndPoint.

Asse delle sfumature per una sfumatura lineare diagonaleGradient axis for a diagonal linear gradient

Nell'esempio seguente viene illustrato come creare una sfumatura orizzontale specificando gli oggetti StartPoint e EndPointdel pennello.The following example shows how to create a horizontal gradient by specifying the brush's StartPoint and EndPoint. Si noti che i cursori sfumatura sono gli stessi degli esempi precedenti. semplicemente modificando StartPoint e EndPoint, la sfumatura è stata modificata da diagonale a orizzontale.Notice that the gradient stops are the same as in the previous examples; by simply changing the StartPoint and EndPoint, the gradient has been changed from diagonal to horizontal.

<!-- This rectangle is painted with a horizontal linear gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
      <GradientStop Color="Yellow" Offset="0.0" />
      <GradientStop Color="Red" Offset="0.25" />
      <GradientStop Color="Blue" Offset="0.75" />
      <GradientStop Color="LimeGreen" Offset="1.0" />
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>
Rectangle horizontalFillRectangle = new Rectangle();
horizontalFillRectangle.Width = 200;
horizontalFillRectangle.Height = 100;

// Create a horizontal linear gradient with four stops.   
LinearGradientBrush myHorizontalGradient =
    new LinearGradientBrush();
myHorizontalGradient.StartPoint = new Point(0,0.5);
myHorizontalGradient.EndPoint = new Point(1,0.5);
myHorizontalGradient.GradientStops.Add(
    new GradientStop(Colors.Yellow, 0.0));
myHorizontalGradient.GradientStops.Add(
    new GradientStop(Colors.Red, 0.25));                
myHorizontalGradient.GradientStops.Add(
    new GradientStop(Colors.Blue, 0.75));        
myHorizontalGradient.GradientStops.Add(
    new GradientStop(Colors.LimeGreen, 1.0));
    
// Use the brush to paint the rectangle.
horizontalFillRectangle.Fill = myHorizontalGradient; 

La figura seguente illustra la sfumatura che è stata creata.The following illustration shows the gradient that is created. L'asse delle sfumature è contrassegnato con una linea tratteggiata e i cursori sfumatura sono contrassegnati con cerchi.The gradient axis is marked with a dashed line, and the gradient stops are marked with circles.

Asse delle sfumature per una sfumatura lineare orizzontaleGradient axis for a horizontal linear gradient

L'esempio seguente illustra come creare una sfumatura verticale.The next example shows how to create a vertical gradient.

<!-- This rectangle is painted with a vertical gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
      <GradientStop Color="Yellow" Offset="0.0" />
      <GradientStop Color="Red" Offset="0.25" />
      <GradientStop Color="Blue" Offset="0.75" />
      <GradientStop Color="LimeGreen" Offset="1.0" />
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>
Rectangle verticalFillRectangle = new Rectangle();
verticalFillRectangle.Width = 200;
verticalFillRectangle.Height = 100;

// Create a vertical linear gradient with four stops.   
LinearGradientBrush myVerticalGradient =
    new LinearGradientBrush();
myVerticalGradient.StartPoint = new Point(0.5,0);
myVerticalGradient.EndPoint = new Point(0.5,1);
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.Yellow, 0.0));
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.Red, 0.25));                
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.Blue, 0.75));        
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.LimeGreen, 1.0));
    
// Use the brush to paint the rectangle.
verticalFillRectangle.Fill = myVerticalGradient;  

La figura seguente illustra la sfumatura che è stata creata.The following illustration shows the gradient that is created. L'asse delle sfumature è contrassegnato con una linea tratteggiata e i cursori sfumatura sono contrassegnati con cerchi.The gradient axis is marked with a dashed line, and the gradient stops are marked with circles.

Asse delle sfumature per una sfumatura verticaleGradient axis for a vertical gradient

Sfumature radialiRadial Gradients

Come, un RadialGradientBrush oggetto disegna un'area con colori combinati lungo un asse. LinearGradientBrushLike a LinearGradientBrush, a RadialGradientBrush paints an area with colors that blend together along an axis. Negli esempi precedenti è stato illustrato come l'asse di un pennello sfumato lineare sia una linea retta.The previous examples showed how a linear gradient brush's axis is a straight line. Un asse del pennello sfumato radiale è definito da un cerchio. I relativi colori di "radiate" irradiano verso l'esterno partendo dall'origine.A radial gradient brush's axis is defined by a circle; its colors "radiate" outward from its origin.

Nell'esempio seguente viene usato un pennello sfumato radiale per disegnare l'area interna di un rettangolo.In the following example, a radial gradient brush is used to paint the interior of a rectangle.

<!-- This rectangle is painted with a diagonal linear gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <RadialGradientBrush 
      GradientOrigin="0.5,0.5" Center="0.5,0.5" 
      RadiusX="0.5" RadiusY="0.5">
      <GradientStop Color="Yellow" Offset="0" />
      <GradientStop Color="Red" Offset="0.25" />
      <GradientStop Color="Blue" Offset="0.75" />
      <GradientStop Color="LimeGreen" Offset="1" />
    </RadialGradientBrush>
  </Rectangle.Fill>
</Rectangle>

RadialGradientBrush myRadialGradientBrush = new RadialGradientBrush();
myRadialGradientBrush.GradientOrigin = new Point(0.5,0.5);
myRadialGradientBrush.Center = new Point(0.5,0.5);
myRadialGradientBrush.RadiusX = 0.5;
myRadialGradientBrush.RadiusY = 0.5;
myRadialGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Yellow, 0.0));
myRadialGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Red, 0.25));
myRadialGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Blue, 0.75));
myRadialGradientBrush.GradientStops.Add(
    new GradientStop(Colors.LimeGreen, 1.0));

Rectangle myRectangle = new Rectangle();
myRectangle.Width = 200;
myRectangle.Height = 100;
myRectangle.Fill = myRadialGradientBrush;

La figura seguente illustra la sfumatura creata nell'esempio precedente.The following illustration shows the gradient created in the previous example. I cursori sfumatura del pennello sono stati evidenziati.The brush's gradient stops have been highlighted. Si noti che, anche se i risultati sono diversi, i cursori sfumatura in questo esempio sono identici a quelli degli esempi precedenti del pennello sfumato lineare.Notice that, even though the results are different, the gradient stops in this example are identical to the gradient stops in the previous linear gradient brush examples.

Cursori sfumatura in una sfumatura radialeGradient stops in a radial gradient

GradientOrigin Specifica il punto iniziale dell'asse delle sfumature di un pennello sfumatura radiale.The GradientOrigin specifies the start point of a radial gradient brush's gradient axis. L'asse delle sfumature si irradia dall'origine della sfumatura fino al cerchio della sfumatura.The gradient axis radiates from the gradient origin to the gradient circle. Il cerchio sfumatura di un pennello viene definito Centerdalle RadiusXrelative proprietà RadiusY , e.A brush's gradient circle is defined by its Center, RadiusX, and RadiusY properties.

Nella figura seguente sono illustrate diverse sfumature radiali con RadiusXdiverse GradientOriginimpostazioni RadiusY , Center, e.The following illustration shows several radial gradients with different GradientOrigin, Center, RadiusX, and RadiusY settings.

Impostazioni RadialGradientBrush RadialGradientBrushes con diverse impostazioni GradientOrigin, Center, RadiusX e RadiusY.RadialGradientBrush settings RadialGradientBrushes with different GradientOrigin, Center, RadiusX, and RadiusY settings.

Specifica dei cursori sfumatura trasparenti o parzialmente trasparentiSpecifying Transparent or Partially-Transparent Gradient Stops

Poiché i cursori sfumatura non forniscono una proprietà di opacità, è necessario specificare il canale alfa dei colori utilizzando la notazione esadecimale Color.FromScRgb ARGB nel markup oppure utilizzare il metodo per creare cursori sfumatura trasparenti o parzialmente trasparenti.Because gradient stops do not provide an opacity property, you must specify the alpha channel of colors using ARGB hexadecimal notation in markup or use the Color.FromScRgb method to create gradient stops that are transparent or partially transparent. Le sezioni seguenti illustrano come creare cursori sfumatura parzialmente trasparenti in XAMLXAML e nel codice.The following sections explain how to create partially transparent gradient stops in XAMLXAML and code.

Specifica dell'opacità di colore in "XAML"Specifying Color Opacity in "XAML"

In XAMLXAMLè possibile usare la notazione esadecimale ARGB per specificare l'opacità dei singoli colori.In XAMLXAML, you use ARGB hexadecimal notation to specify the opacity of individual colors. La notazione esadecimale ARGB usa la sintassi seguente:ARGB hexadecimal notation uses the following syntax:

# aa rrggbb# aa rrggbb

aa nella riga precedente rappresenta un valore esadecimale a due cifre usato per specificare l'opacità del colore.The aa in the previous line represents a two-digit hexadecimal value used to specify the opacity of the color. rr, gg e bb rappresentano un valore esadecimale a due cifre usato per specificare la quantità di rosso, verde e blu nel colore.The rr, gg, and bb each represent a two digit hexadecimal value used to specify the amount of red, green, and blue in the color. Ogni cifra esadecimale può avere un valore compreso tra 0 e 9 o tra A e F.Each hexadecimal digit may have a value from 0-9 or A-F. 0 è il valore più basso, mentre F è il più elevato.0 is the smallest value, and F is the greatest. Un valore alfa pari a 00 indica un colore completamente trasparente, mentre un valore alfa pari a FF indica un colore completamente opaco.An alpha value of 00 specifies a color that is completely transparent, while an alpha value of FF creates a color that is fully opaque. Nell'esempio seguente viene usata la notazione ARGB esadecimale per specificare due colori.In the following example, hexadecimal ARGB notation is used to specify two colors. Il primo è parzialmente trasparente (con valore alfa pari a x20), mentre il secondo è completamente opaco.The first is partially transparent (it has an alpha value of x20), while the second is completely opaque.

<Rectangle Width="100" Height="100">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0,0">

      <!-- This gradient stop is partially transparent. -->
      <GradientStop Color="#200000FF" Offset="0.0" />

      <!-- This gradient stop is fully opaque. -->
      <GradientStop Color="#FF0000FF" Offset="1.0" />
    </LinearGradientBrush>
  </Rectangle.Fill>
</Rectangle>

Specifica dell'opacità di colore nel codiceSpecifying Color Opacity in Code

Quando si usa il codice, FromArgb il metodo statico consente di specificare un valore alfa quando si crea un colore.When using code, the static FromArgb method enables you to specify an alpha value when you create a color. Il metodo accetta quattro parametri di tipo Byte.The method takes four parameters of type Byte. Il primo parametro specifica il canale alfa del colore. Gli altri tre parametri specificano i valori rosso, verde e blu del colore.The first parameter specifies the alpha channel of the color; the other three parameters specify the red, green, and blue values of the color. Ogni valore deve essere compreso tra 0 e 255 inclusi.Each value should be between 0 to 255, inclusive. Un valore alfa pari a 0 indica che un colore è completamente trasparente e un valore alfa pari a 255 indica che il colore è completamente opaco.An alpha value of 0 specifies that the color is completely transparent, while an alpha value of 255 specifies that the color is completely opaque. Nell'esempio seguente il FromArgb metodo viene usato per produrre due colori.In the following example, the FromArgb method is used to produce two colors. Il primo colore è parzialmente trasparente (con valore alfa pari a 32), mentre il secondo è completamente opaco.The first color is partially transparent (it has an alpha value of 32), while the second is fully opaque.

LinearGradientBrush myLinearGradientBrush = new LinearGradientBrush();

// This gradient stop is partially transparent.
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Color.FromArgb(32, 0, 0, 255), 0.0));

// This gradient stop is fully opaque. 
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Color.FromArgb(255, 0, 0, 255), 1.0));

Rectangle myRectangle = new Rectangle();
myRectangle.Width = 100;
myRectangle.Height = 100;
myRectangle.Fill = myLinearGradientBrush;

In alternativa, è possibile usare il FromScRgb metodo, che consente di usare i valori di ScRGB per creare un colore.Alternatively, you may use the FromScRgb method, which enables you to use ScRGB values to create a color.

Disegno con oggetti Images, Drawings, Visuals e PatternsPainting with Images, Drawings, Visuals, and Patterns

ImageBrushle DrawingBrushclassi, VisualBrush e consentono di disegnare un'area con immagini, disegni o oggetti visivi.ImageBrush, DrawingBrush, and VisualBrush classes enable you to paint an area with images, drawings, or visuals. Per informazioni sul disegno con immagini, disegni e modelli, vedere Disegnare con oggetti Image, Drawing e Visual.For information about painting with images, drawings, and patterns, see Painting with Images, Drawings, and Visuals.

Vedere ancheSee also