Brushes C# Help

This section illustrates how to use the brushes that WPF offers for drawing backgrounds and foregrounds. Throughout this section, we will reference Figure 34-9, which shows the effects of using various brushes within the Background of Button elements.

Figure 34-9

Figure 34-9


The first button in Figure 34-9 uses the SolidColorBrush, which, by name, uses a solid color, The complete area is drawn with the same color.

You can define a solid color just by setting the Background attribute to a string that defines a solid color, The string is converted to a solidColorBrush element.

<Button Height=”30″ Background=”Purple”>Solid Color</Button>

Of course, you will get the same effect by setting the Background child element and adding a SolidColorBrush element as its content. The second button in the application is using the solid color Yellow for the background.

<Button Height=”30″ >
<Button. Background>
Solid Color


For a smooth color change, you can use the LinearGradientBrush, as shown with the third button, This brush defines the Start Point and EndPoint properties. With this, you can assign two dimensional coordinates for the linear gradient. The default gradient is diagonal linear from °,°to 1, 1. By defining different values, the gradient can take different directions. For example, with a Start Point of 0, °and an EndPoint of 0,1 you get a vertical gradient. The same Start Point and an EndPoint value of 1 , °creates a horizontal gradient.

With the content of this brush, you can define the color values at the specified offsets with the Gradient Stop element. Between the stops, the colors are smoothed.


With the RadialGradientBrush you can smooth the color in a radiant way. In Figure 34-9, the fourth button is using the RadialGradientBrush. This brush defines the color start with the GradientOrigin point.


The DrawingBrush allows you to define a drawing that is painted with the brush. The drawing that is shown with the brush isdefined within a GeometryDrawing element, The GeometryGroup, which you can see within the Geometry property, consists of Geometry elements such as EllipseGeometry, LineGeometry, RectangleGeometry, and CombinedGeometry.


To load an image into a brush, you can use the ImageBrush element: With this element, the image defined by the lmage Source property is displayed.

<Button Height=”100″>
<Button. Background>
ImageSource=” C:\Windows\Web\Wallpaper\img21.bmp”
<Button. Foreground>White</Button. Foreground>
Image Brush


The visualBrush allows you to use other WPF elements in a brush, Here you can add a WPF element to the Visual property, The se.venthbutton in Figure 34-9 contains a Rectangle, an Ellipse, and a Button.

With the VisualBrush, you can also create effects such as reflection. The button shown here contains a StackPanel that itself contains a Border and a Rectangle, The Border contains a StackPanel with a Label and a Rectangle. But that’s not the real point here, The second Rectangle is filled with a VisualBrush. This brush defines an opacity value and a transformation, The Visual property is bound to the Border element, The transformation is done by setting the RelativeTransform property of the VisualBrush, This transformation is using relative coordinates, By setting Scale Y to -1, a reflection in Y direction is done. TranslateTransform moves the transformation in Y direction so that the reflection is below the original object, You can see the result in the eighth button (“Visual Brush 2”) in Figure 34-9.

You can also use the visualBrush to display a video, simply by setting the Visual property to a MediaElement, With the MediaControl, the Source property is set to a WMV file, In Figure 34-9, the ninth button showing the three women meant to serve as an example of displaying a video. However, in a print media it is difficult to show a video. You can try that on your own – and if you’ve the Ultimate edition of Windows Vista you will find the same video on your hard disk. Otherwise just select adifferent video file.

Posted on November 3, 2015 in Windows Presentation Foundation

Share the Story

Back to Top
Share This