A Brush "paints" an area with its output. Different brushes have different types of output. Brushes can paint an area with a solid color/with a gradient/pattern/ image/ drawing.
There are diffenrent types of Brushes.
- SolidColorBrush
- LinearGradientBrush
- RadialGradientBrush
- ImageBrush

<Ellipse Stroke="Black" StrokeThickness="2" Margin="35,130,435,324">
<Ellipse.Fill>
<SolidColorBrush Color="DarkOrange"></SolidColorBrush>
</Ellipse.Fill>
</Ellipse>
<Label Content="SolidColorBrush" Height="30"
HorizontalAlignment="Left" Margin="35,80,0,0"
Name="SolidColorBrushLabel" VerticalAlignment="Top"
Width="100" Background="DarkOrange"/>
LinearGradientBrush: paints an area with a linear gradient. A linear gradient blends two or more colors across a line, the gradient axis. Use GradientStop objects to specify the colors in the gradient and their positions.
The default linear gradient is diagonal. In the default, the StartPoint of a linear gradient is (0,0), the upper-left corner of the area being painted, and its EndPoint is (1,1), the lower-right corner of the area being painted. The colors in the resulting gradient are interpolated along the diagonal path. If we want to the linear gradient Horizontal, set the StartPoint="0,0" and EndPoint="0,1" and for Vertical gradient StartPoint="0,0" and EndPoint="1,0"(Refresh X-Y Cartesian Coordinate System you learned in high school math class.:)) -


A line was added to highlight the interpolation path of the gradient from the start point to the end point.

<Grid>
<Rectangle Height="100" HorizontalAlignment="Left"
Margin="55,125,0,0" Name="LinearGradientBrushRectangle"
Stroke="Black" VerticalAlignment="Top" Width="180" >
<Rectangle.Fill>
<LinearGradientBrush>
<GradientStop Color="#660033" Offset="0.0" />
<GradientStop Color="#FFCC00" Offset="0.5" />
<GradientStop Color="#BABA21" Offset="1" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Label Content="LinearGradientBrush " Height="30"
HorizontalAlignment="Left" Margin="70,70,0,0"
Name="LinearGradientBrushLabel" VerticalAlignment="Top" >
<Label.Background>
<LinearGradientBrush>
<GradientStop Color="#660033" Offset="0.0" />
<GradientStop Color="#FFCC00" Offset="0.5" />
<GradientStop Color="#BABA21" Offset="1" />
</LinearGradientBrush>
</Label.Background>
</Label>
</Grid>
RadialGradientBrush: paints an area with a radial gradient. A radial gradient blends two or more colors across a circle.

<Grid>
<Polygon Points="300,200 400,125 400,275 300,200" Margin="-183,-12,161,12">
<Polygon.Fill>
<RadialGradientBrush GradientOrigin="0.5,0.5">
<GradientStop Color=" #800080" Offset="0"/>
<GradientStop Color="Sienna" Offset="0.5"/>
<GradientStop Color="#4AA02C" Offset="1">
</GradientStop>
</RadialGradientBrush>
</Polygon.Fill>
</Polygon>
<Label Content="RadialGradientBrush " Height="30" HorizontalAlignment="Left" Margin="138,76,0,0" Name="RadialGradientBrushLabel" VerticalAlignment="Top" >
<Label.Background>
<RadialGradientBrush GradientOrigin="0.5,.7">
<GradientStop Color=" #800080" Offset="0"/>
<GradientStop Color="Sienna" Offset="0.5"/>
<GradientStop Color="#4AA02C" Offset="1"/>
</RadialGradientBrush>
</Label.Background>
</Label>
</Grid>
ImageBrush: paints an area with a ImageSource.

<Grid>
<Label Content="ImageBrush" Height="30"
HorizontalAlignment="Left" Margin="129,47,0,0"
Name="ImageBrushLabel" VerticalAlignment="Top"
FontWeight="Bold" >
<Label.Background>
<ImageBrush Viewbox="0.6,0.3,0.6,0.7" ImageSource="Image\ImageBrush.png"/>
</Label.Background>
</Label>
<Ellipse Height="80" HorizontalAlignment="Left"
Margin="95,101,0,0" Name="ImageBrushEllipse"
Stroke="Black" VerticalAlignment="Top" Width="145" >
<Ellipse.Fill>
<ImageBrush ImageSource="Image\ImageBrush.png"/>
</Ellipse.Fill>
</Ellipse>
</Grid>
References: http://msdn.microsoft.com/en-us/library/system.windows.media.brush.aspx
0 comments:
Post a Comment