Общие сведения о кистях WPF
Все, что видно на экране, отображается, так как нарисовано с помощью кисти. Например, кисть используется для описания фона кнопки, переднего плана текста и заливки фигуры. В этом разделе приводятся основные понятия рисования с помощью кистей Windows Presentation Foundation (WPF) и приведены примеры. Кисти позволяют рисовать объекты пользовательского интерфейса с помощью простых, сплошных цветов до сложных наборов шаблонов и изображений.
Закрашивание с помощью кисти
Brush закрашивает область своими выходными данными. Разные кисти имеют разные типы выходных данных. Некоторые кисти заполняют область сплошным цветом, другие — градиентом, узором, изображением или рисунком. На следующем рисунке показаны примеры каждого из различных типов Brush.
Примеры кистей
Большинство визуальных объектов позволяют указать, как именно они закрашиваются. В следующей таблице перечислены некоторые распространенные объекты и свойства, с которыми можно использовать Brush.
Класс | Свойства кисти |
---|---|
Border | BorderBrush, Background |
Control | Background, Foreground |
Panel | Background |
Pen | Brush |
Shape | Fill, Stroke |
TextBlock | Background |
В следующих разделах описаны различные типы Brush и приведен пример каждого из них.
Закрашивание сплошным цветом
SolidColorBrush закрашивает область сплошным цветом Color. Существует множество способов указать Color объекта SolidColorBrush: например, можно указать альфа-канал и каналы красного, синего и зеленого цветов или использовать один из предопределенных цветов, предоставляемых классом Colors.
В следующем примере используется SolidColorBrush для закрашивания Fill объекта Rectangle. На следующем рисунке показан закрашенный прямоугольник.
Прямоугольник, закрашенный с помощью SolidColorBrush
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;
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 Width="75" Height="75">
<Rectangle.Fill>
<SolidColorBrush Color="Red" />
</Rectangle.Fill>
</Rectangle>
Дополнительные сведения о классе SolidColorBrush см. в разделе Общие сведения о закраске сплошным цветом и градиентом.
Закрашивание с линейным градиентом
LinearGradientBrush закрашивает область с линейным градиентом. Линейный градиент объединяет два или более цветов по линии, градиентная ось. Объекты GradientStop используются для указания цветов в градиенте и их положения.
В следующем примере используется LinearGradientBrush для закрашивания Fill объекта Rectangle. На следующем рисунке показан закрашенный прямоугольник.
Прямоугольник, закрашенный с помощью LinearGradientBrush
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;
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 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>
Дополнительные сведения о классе LinearGradientBrush см. в разделе Общие сведения о закраске сплошным цветом и градиентом.
Закрашивание с применением радиального градиента
RadialGradientBrush закрашивает область с применением радиального градиента. Радиальный градиент смешивает два или более цветов вдоль окружности. Как и в случае с классом LinearGradientBrush, объекты GradientStop используются для указания цветов в градиенте и их положения.
В следующем примере используется RadialGradientBrush для закрашивания Fill объекта Rectangle. На следующем рисунке показан закрашенный прямоугольник.
Прямоугольник, закрашенный с использованием RadialGradientBrush
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;
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 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>
Дополнительные сведения о классе RadialGradientBrush см. в разделе Общие сведения о закраске сплошным цветом и градиентом.
Закрашивание с помощью изображения
ImageBrush закрашивает область с использованием ImageSource.
В следующем примере используется ImageBrush для закрашивания Fill объекта Rectangle. На следующем рисунке показан закрашенный прямоугольник.
Прямоугольник, закрашенный с использованием изображения
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;
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 Width="75" Height="75">
<Rectangle.Fill>
<ImageBrush ImageSource="sampleImages\pinkcherries.jpg" />
</Rectangle.Fill>
</Rectangle>
Дополнительные сведения о классе ImageBrush см. в разделе Заполнение с использованием изображений, рисунков и визуальных элементов.
Закрашивание с помощью рисунка
DrawingBrush закрашивает область с использованием Drawing. Drawing может содержать фигуры, изображения, текст и мультимедиа.
В следующем примере используется DrawingBrush для закрашивания Fill объекта Rectangle. На следующем рисунке показан закрашенный прямоугольник.
Прямоугольник, закрашенный с помощью DrawingBrush
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;
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 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>
Дополнительные сведения о классе DrawingBrush см. в разделе Заполнение с использованием изображений, рисунков и визуальных элементов.
Закрашивание с помощью визуального элемента
VisualBrush закрашивает область объектом Visual. Примеры визуальных объектов: Button, Page и MediaElement. Кроме того, VisualBrush позволяет проецировать содержимое из одной части приложения в другую область, это очень удобно для создания эффектов отражения и увеличения частей экрана.
В следующем примере используется VisualBrush для закрашивания Fill объекта Rectangle. На следующем рисунке показан закрашенный прямоугольник.
Прямоугольник, закрашенный с использованием VisualBrush
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;
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 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>
Дополнительные сведения о классе VisualBrush см. в разделе Заполнение с использованием изображений, рисунков и визуальных элементов.
Закрашивание с помощью предопределенных и системных кистей
Для удобства Windows Presentation Foundation (WPF) предоставляет набор предопределенных и системных кистей, которые можно использовать для закрашивания объектов.
Список доступных предопределенных кистей см. в описании класса Brushes. Пример использования предопределенной кисти см. в разделе Закраска области сплошным цветом.
Список доступных системных кистей см. в описании класса SystemColors. Пример см. в разделе Закраска области с помощью системной кисти.
Общие функции кисти
Объекты Brush предоставляют Opacity свойство, которое можно использовать, чтобы сделать кисть полностью или частично прозрачной. Свойство Opacity, равное 0, делает кисть полностью прозрачной, а Opacity, равное 1, делает ее полностью непрозрачной. В следующем примере свойство Opacity используется для того, чтобы сделать кисть SolidColorBrush непрозрачной на 25 процентов.
<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;
Если кисть содержит частично прозрачные цвета, значение непрозрачности цвета посредством умножения объединяется со значением непрозрачности кисти. Например, если кисть имеет значение непрозрачности 0,5, а цвет, используемый в кисти, также имеет значение непрозрачности 0,5, на выходе цвет имеет значение непрозрачности 0,25.
Примечание.
Эффективнее изменить значение непрозрачности кисти, чем менять непрозрачность всего элемента с помощью его свойства UIElement.Opacity.
Вы можете повернуть, масштабировать, наклонить и преобразовать содержимое кисти с помощью ее свойств Transform или RelativeTransform. Дополнительные сведения см. в разделе Общие сведения о преобразованиях кистей.
Поскольку они являются объектами Animatable, объекты Brush могут быть анимированы. Более подробную информацию см. в разделе Общие сведения об эффектах анимации.
Возможности объектов Freezable
Так как он наследует от класса Freezable, класс Brush предоставляет ряд особых возможностей: можно объявлять объекты Brush как ресурсы, разделять их между несколькими объектами и клонировать. Кроме того, все типы Brush, кроме VisualBrush, можно сделать доступными только для чтения, чтобы повысить производительность, и потокобезопасными.
Дополнительные сведения о различных функциях, предоставляемых объектами Freezable, см. в разделе Общие сведения об объектах класса Freezable.
Дополнительные сведения о том, почему объекты VisualBrush не могут быть зафиксированы, см. на странице типа VisualBrush.
См. также
- Brush
- Brushes
- Общие сведения о закраске сплошным цветом и градиентом
- Рисование с помощью объектов Image, Drawing и Visual
- Общие сведения об объектах класса Freezable
- Пример использования кистей
- Пример использования ImageBrush
- Пример использования VisualBrush
- Практические руководства
- Дополнительные рекомендации по повышению производительности
.NET Desktop feedback