Общие сведения о закраске сплошным цветом и градиентомPainting with Solid Colors and Gradients Overview

В этом разделе описывается использование SolidColorBrushобъектов, LinearGradientBrushи RadialGradientBrush для заливки сплошными цветами, линейными градиентами и радиальными градиентами.This topic describes how to use SolidColorBrush, LinearGradientBrush, and RadialGradientBrush objects to paint with solid colors, linear gradients, and radial gradients.

Закрашивание области сплошным цветомPainting an Area with a Solid Color

Одна из наиболее распространенных операций в любой платформе заключается в том, чтобы закрасить область Colorсплошной.One of the most common operations in any platform is to paint an area with a solid Color. Для выполнения этой задачи Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) SolidColorBrush предоставляет класс.To accomplish this task, Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) provides the SolidColorBrush class. В следующих разделах описываются различные способы рисования с SolidColorBrushпомощью.The following sections describe the different ways to paint with a SolidColorBrush.

Использование SolidColorBrush в XAMLUsing a SolidColorBrush in "XAML"

Чтобы закрасить область сплошным цветом в XAMLXAML, используйте один из следующих вариантов.To paint an area with a solid color in XAMLXAML, use one of the following options.

  • Выберите стандартную сплошную цветную кисть по имени.Select a predefined solid color brush by name. Например, можно задать Background для кнопки значение "Red" или "медиумблуе".For example, you can set a button's Background to "Red" or "MediumBlue". Список других предопределенных сплошных цветных кистей см. в разделе статические Brushes свойства класса.For a list of other predefined solid color brushes, see the static properties of the Brushes class. Пример.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>
    
  • Выберите цвет из 32-разрядной цветовой палитры, указав насыщенность красной, зеленой и синей составляющих для смешения в сплошной цвет.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. Формат для указания цвета из 32-разрядной палитры — #rrggbb, где rr — шестнадцатеричное число из двух цифр, представляющее относительное количество красного цвета, gg — зеленого, bb — синего.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. Кроме того, цвет можно указать в формате #aarrggbb, где aa представляет альфа-канал, или прозрачность, цвета.Additionally, the color can be specified as "#aarrggbb" where aa specifies the alpha value, or transparency, of the color. Этот подход позволяет создавать частично прозрачные цвета.This approach enables you to create colors that are partially transparent. В следующем примере параметр Background Button для имеет значение полностью непрозрачного красного цвета с шестнадцатеричной нотацией.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>
    
  • Используйте синтаксис тега свойства для описания SolidColorBrush.Use property tag syntax to describe a SolidColorBrush. Этот синтаксис требует более подробного описания, но позволяет указать дополнительные параметры, например непрозрачность кисти.This syntax is more verbose but enables you to specify additional settings, such as the brush's opacity. В следующем примере Background свойства двух Button элементов устанавливаются в полностью непрозрачный красный цвет.In the following example, the Background properties of two Button elements are set to fully-opaque red. Цвет первой кисти описан с использованием имени стандартного цвета.The first brush's color is described using a predefined color name. Цвет второй кисти описан с помощью шестнадцатеричного формата.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>  
    

Закрашивание с использованием SolidColorBrush в кодеPainting with a SolidColorBrush in Code

Чтобы закрасить область сплошным цветом в коде, используйте один из следующих вариантов.To paint an area with a solid color in code, use one of the following options.

  • Используйте одну из стандартных кистей, предоставляемых Brushes классом.Use one of the predefined brushes provided by the Brushes class. В следующем примере параметр Background Button для имеет значение Red.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;  
    
  • Создайте и задайте его Color свойство, используя Color структуру. SolidColorBrushCreate a SolidColorBrush and set its Color property using a Color structure. Можно использовать стандартный цвет из Colors класса или Color создать с помощью статического FromArgb метода.You can use a predefined color from the Colors class or you can create a Color using the static FromArgb method.

    В следующем примере показано, как задать Color свойство SolidColorBrush объекта с помощью предопределенного цвета.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;
    

Статический FromArgb цвет позволяет задать значения альфа-канала, красного, зеленого и синего цвета.The static FromArgb enables you to specify the color's alpha, red, green, and blue values. Обычный диапазон для этих значений — от 0 до 255.The typical range for each of these values is 0-255. Значение 0 указывает, что цвет полностью прозрачен, а значение 255 — что он полностью непрозрачен.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. Аналогично значение 0 для красного цвета указывает, что цвет не имеет красной составляющей, а значение 255 означает, что цвет имеет максимальную насыщенность красной составляющей.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. В следующем примере цвет кисти описан путем указания значения альфа и значений красного, зеленого и синего цветов.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;

Дополнительные способы указания цвета см. в Color разделе справки.For additional ways to specify color, see the Color reference topic.

Закрашивание области с помощью градиентаPainting an Area with a Gradient

Градиентные кисти закрашивают область разными цветами, которые переходят из одного в другой по некоторой оси.A gradient brush paints an area with multiple colors that blend into each other along an axis. Их можно использовать для создания картины света и теней, которая придает элементам управления трехмерный вид.You can use them to create impressions of light and shadow, giving your controls a three-dimensional feel. Их также можно использовать для имитации стекла, хрома, воды и других гладких поверхностей.You can also use them to simulate glass, chrome, water, and other smooth surfaces. WPFWPFпредоставляет два типа градиентных кистей LinearGradientBrush : RadialGradientBrushи.provides two types of gradient brushes: LinearGradientBrush and RadialGradientBrush.

Линейные градиентыLinear Gradients

Рисует область с градиентом, определенным вдоль линии, оси градиента. LinearGradientBrushA LinearGradientBrush paints an area with a gradient defined along a line, the gradient axis. Цвета градиента и их расположение указываются вдоль оси градиента с помощью GradientStop объектов.You specify the gradient's colors and their location along the gradient axis using GradientStop objects. Ось градиента можно изменить, чтобы создать горизонтальный или вертикальный градиент, или обратить направление градиента.You may also modify the gradient axis, which enables you to create horizontal and vertical gradients and to reverse the gradient direction. Ось градиента описана в следующем разделе.The gradient axis is described in the next section. По умолчанию создается диагональный градиент.By default, a diagonal gradient is created.

В следующем примере показан код, создающий линейный градиент с четырьмя цветами.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;

Этот код создает следующий градиент.This code produces the following gradient:

Диагональный линейный градиентA diagonal linear gradient

Примечание

В примерах градиента в этом разделе используется система координат по умолчанию для установки начальных и конечных точек.The gradient examples in this topic use the default coordinate system for setting start points and end points. Система координат по умолчанию относится к ограничивающему прямоугольнику: 0 означает 0 процентов ограничивающего прямоугольника, а 1 — 100% ограничивающего прямоугольника.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. Вы можете изменить эту систему координат, задав MappingMode для свойства значение. AbsoluteYou can change this coordinate system by setting the MappingMode property to the value Absolute. Абсолютная система координат не привязана к ограничивающему прямоугольнику.An absolute coordinate system is not relative to a bounding box. Значения интерпретируются непосредственно в локальной области.Values are interpreted directly in local space.

GradientStop — Это базовый Стандартный блок кисти градиента.The GradientStop is the basic building block of a gradient brush. Ограничитель градиента указывает Color Offset на в вдоль оси градиента.A gradient stop specifies a Color at an Offset along the gradient axis.

  • Color Свойство ограничителя градиента определяет цвет ограничителя градиента.The gradient stop's Color property specifies the color of the gradient stop. Цвет можно задать с помощью стандартного цвета (предоставляемого Colors классом) или путем указания значений ScRGB или ARGB.You may set the color by using a predefined color (provided by the Colors class) or by specifying ScRGB or ARGB values. В XAMLXAML для описания цвета можно также использовать шестнадцатеричный формат.In XAMLXAML, you may also use hexadecimal notation to describe a color. Дополнительные сведения см. в Color описании структуры.For more information, see the Color structure.

  • Offset Свойство ограничителя градиента задает расположение цвета ограничителя градиента на оси градиента.The gradient stop's Offset property specifies the position of the gradient stop's color on the gradient axis. Смещение — это значение Double в диапазоне от 0 до 1.The offset is a Double that ranges from 0 to 1. Чем ближе значение смещения ограничения градиента к 0, тем ближе цвет находится к началу градиента.The closer a gradient stop's offset value is to 0, the closer the color is to the start of the gradient. Чем ближе значение смещения градиента к 1, тем ближе цвет находится к окончанию градиента.The closer the gradient's offset value is to 1, the closer the color is to the end of the gradient.

Цвет каждой точки между ограничениями градиента подчиняется закону линейной интерполяции как сочетание цветов, заданных двумя ограничивающими положениями градиента.The color of each point between gradient stops is linearly interpolated as a combination of the color specified by the two bounding gradient stops. На следующем рисунке показаны ограничения градиента, используемые в предыдущем примере.The following illustration highlights the gradient stops in the previous example. Кружками отмечены положения ограничений градиента, а пунктирной линией обозначена ось градиента.The circles mark the position of gradient stops and a dashed line shows the gradient axis.

Ограничения градиента в линейном градиентеGradient stops in a linear gradient

Первое ограничение градиента задает желтый цвет в точке со смещением 0.0.The first gradient stop specifies the color yellow at an offset of 0.0. Второе ограничение градиента задает красный цвет в точке со смещением 0.25.The second gradient stop specifies the color red at an offset of 0.25. Цвета между этими двумя ограничениями постепенно меняются от желтого к красному при движении слева направо вдоль оси градиента.The points between these two stops gradually change from yellow to red as you move from left to right along the gradient axis. Третье ограничение градиента задает синий цвет в точке со смещением 0.75.The third gradient stop specifies the color blue at an offset of 0.75. Цвета между вторым и третьим ограничениями градиента постепенно меняются от красного к синему.The points between the second and third gradient stops gradually change from red to blue. Четвертое ограничение градиента задает зеленый цвет в точке со смещением 1.0.The fourth gradient stop specifies the color lime green at an offset of 1.0. Цвета между третьим и четвертым ограничениями градиента постепенно меняются от синего к зеленому.The points between the third and fourth gradient stops gradually change from blue to lime green.

Ось градиентаThe Gradient Axis

Как было сказано ранее, ограничения градиента кисти линейного градиента располагаются вдоль линии, называемой осью градиента.As previously mentioned, a linear gradient brush's gradient stops are positioned along a line, the gradient axis. Вы можете изменить ориентацию и размер линии с помощью свойств кисти StartPoint и. EndPointYou may change the orientation and size of the line using the brush's StartPoint and EndPoint properties. Управляя кистью StartPoint и EndPoint, можно создавать горизонтальные и вертикальные градиенты, отменять направление градиента, уплотнение градиентного распределения и многое другое.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.

По умолчанию кисть StartPoint линейного градиента EndPoint и задается относительно закрашиваемой области.By default, the linear gradient brush's StartPoint and EndPoint are relative to the area being painted. Точка (0, 0) представляет верхний левый угол закрашиваемой области, а точка (1, 1) — правый нижний угол.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. По умолчанию StartPoint LinearGradientBrush значение равно (0, 0), а его значение EndPoint по умолчанию равно (1, 1), что создает диагональный градиент, начинающийся в левом верхнем углу, и расширяется до правого нижнего угла закрашиваемой области.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. На следующем рисунке показана ось градиента кисти линейного градиента со StartPoint значением EndPointпо умолчанию и.The following illustration shows the gradient axis of a linear gradient brush with default StartPoint and EndPoint.

Ось диагонального линейного градиентаGradient axis for a diagonal linear gradient

В следующем примере показано, как создать горизонтальный градиент, указав кисти StartPoint и. EndPointThe following example shows how to create a horizontal gradient by specifying the brush's StartPoint and EndPoint. Обратите внимание, что ограничения градиента одинаковы, как и в предыдущих примерах. просто изменяя StartPoint и EndPoint, градиент был изменен с диагонального на горизонтальный.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; 

На приведенном ниже рисунке показан созданный градиент.The following illustration shows the gradient that is created. Ось градиента отмечена пунктирной линией, а ограничения градиента отмечены кружками.The gradient axis is marked with a dashed line, and the gradient stops are marked with circles.

Ось горизонтального линейного градиентаGradient axis for a horizontal linear gradient

В следующем примере показано, как создать вертикальный градиент.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;  

На приведенном ниже рисунке показан созданный градиент.The following illustration shows the gradient that is created. Ось градиента отмечена пунктирной линией, а ограничения градиента отмечены кружками.The gradient axis is marked with a dashed line, and the gradient stops are marked with circles.

Ось вертикального градиентаGradient axis for a vertical gradient

Радиальные градиентыRadial Gradients

Как и LinearGradientBrush RadialGradientBrush , рисует область с цветами, которые сочетаются вдоль оси.Like a LinearGradientBrush, a RadialGradientBrush paints an area with colors that blend together along an axis. В предыдущих примерах показано, что ось кисти линейного градиента является прямой линией.The previous examples showed how a linear gradient brush's axis is a straight line. Ось кисти радиального градиента определяется кругом. Цвета меняются в разные стороны от точки начала.A radial gradient brush's axis is defined by a circle; its colors "radiate" outward from its origin.

В следующем примере кисть радиального градиента используется для закрашивания внутренней части прямоугольника.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;

На следующем рисунке показан градиент, созданный в предыдущем примере.The following illustration shows the gradient created in the previous example. Ограничения градиента кисти выделены.The brush's gradient stops have been highlighted. Обратите внимание, что, хотя результаты различаются, ограничения градиента в этом примере совпадают с ограничениями градиента в предыдущих примерах использования кисти линейного градиента.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.

Ограничения градиента в радиальном градиентеGradient stops in a radial gradient

GradientOrigin Задает начальную точку оси градиента кисти радиального градиента.The GradientOrigin specifies the start point of a radial gradient brush's gradient axis. Ось градиента располагается от начала градиента к его окружности.The gradient axis radiates from the gradient origin to the gradient circle. Круг градиента кисти определяется Centerсвойствами, RadiusXи RadiusY .A brush's gradient circle is defined by its Center, RadiusX, and RadiusY properties.

На следующем рисунке показаны несколько радиальных градиентов с GradientOriginразными Centerпараметрами RadiusX,, RadiusY и.The following illustration shows several radial gradients with different GradientOrigin, Center, RadiusX, and RadiusY settings.

Параметры RadialGradientBrush Радиалградиентбрушес с различными параметрами GradientOrigin, Center, RadiusX и RADIUS.RadialGradientBrush settings RadialGradientBrushes with different GradientOrigin, Center, RadiusX, and RadiusY settings.

Задание прозрачных и частично прозрачных ограничений градиентаSpecifying Transparent or Partially-Transparent Gradient Stops

Поскольку ограничения градиента не предоставляют свойство Opacity, необходимо указать альфа-канал цветов с помощью шестнадцатеричной нотации ARGB в разметке или Color.FromScRgb использовать метод для создания точек градиента, которые являются прозрачными или частично прозрачными.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. Ниже описаны процедуры по созданию частично прозрачных ограничений градиента в XAMLXAML и код.The following sections explain how to create partially transparent gradient stops in XAMLXAML and code.

Задание непрозрачности цвета в XAMLSpecifying Color Opacity in "XAML"

В XAMLXAMLиспользуется шестнадцатеричная нотация ARGB для указания прозрачности отдельных цветов.In XAMLXAML, you use ARGB hexadecimal notation to specify the opacity of individual colors. Шестнадцатеричная нотация ARGB использует следующий синтаксис:ARGB hexadecimal notation uses the following syntax:

# aa rrggbb# aa rrggbb

Здесь aa — двузначное шестнадцатеричное значение, используемое для указания непрозрачности цвета.The aa in the previous line represents a two-digit hexadecimal value used to specify the opacity of the color. rr, gg и bb — двузначные шестнадцатеричные значения, используемые для указания насыщенности красного, зеленого и синего цветов.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. Шестнадцатеричная цифра может принимать значения от 0 до F (сначала цифры от 0 до 9, затем буквы от A до F).Each hexadecimal digit may have a value from 0-9 or A-F. Наименьшее значение — 0, наибольшее — F.0 is the smallest value, and F is the greatest. Альфа-значение 00 задает полностью прозрачный цвет, а альфа-значение FF — полностью непрозрачный цвет.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. В следующем примере шестнадцатеричное представление ARGB используется для задания двух цветов.In the following example, hexadecimal ARGB notation is used to specify two colors. Первый — частично прозрачный (он имеет альфа-значение x20). Второй — полностью непрозрачный.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>

Задание непрозрачности цвета в кодеSpecifying Color Opacity in Code

При использовании кода статический FromArgb метод позволяет указать альфа-значение при создании цвета.When using code, the static FromArgb method enables you to specify an alpha value when you create a color. Метод принимает четыре параметра типа Byte.The method takes four parameters of type Byte. Первый параметр задает альфа-канал цвета. Другие три параметра определяют значения красного, зеленого и синего цветов.The first parameter specifies the alpha channel of the color; the other three parameters specify the red, green, and blue values of the color. Все значения должны быть в диапазоне от 0 до 255 включительно.Each value should be between 0 to 255, inclusive. Значение альфа, равное 0, указывает, что цвет полностью прозрачен, а значение 255 — что он полностью непрозрачен.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. В следующем примере FromArgb метод используется для создания двух цветов.In the following example, the FromArgb method is used to produce two colors. Первый цвет — частично прозрачный (он имеет альфа-значение x32). Второй — полностью непрозрачный.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;

Кроме того, вы можете использовать FromScRgb метод, который позволяет использовать значения ScRGB для создания цвета.Alternatively, you may use the FromScRgb method, which enables you to use ScRGB values to create a color.

Закрашивание с помощью объектов Image, Drawing, Visual и PatternPainting with Images, Drawings, Visuals, and Patterns

ImageBrushклассы DrawingBrush, и VisualBrush позволяют закрасить область с помощью изображений, рисунков или визуальных элементов.ImageBrush, DrawingBrush, and VisualBrush classes enable you to paint an area with images, drawings, or visuals. Сведения о закрашивании с использованием изображений, рисунков и шаблонов см. в разделе Рисование с помощью объектов Image, Drawing и Visual.For information about painting with images, drawings, and patterns, see Painting with Images, Drawings, and Visuals.

См. такжеSee also