#231 – You Can Use a Brush for a Control’s Foreground

Though brushes in WPF are most often used to fill in the background for a window or a control,  you can also render the foreground of many controls using a brush.

For example, we can use a brush instead of a solid color for the Foreground property of a Label.  The text of the label will be rendered in a specified font and the body of the letters will be rendered using the specified brush.

		<Label Content="You can render text with a brush.." HorizontalAlignment="Center" Margin="20"
			   FontSize="24" FontWeight="Bold">
			<Label.Foreground>
				<LinearGradientBrush StartPoint="0,0.5" EndPoint="1.0,0.5">
					<GradientStop Color="DarkSlateBlue" Offset="0.0"/>
					<GradientStop Color="SkyBlue" Offset="1.0"/>
				</LinearGradientBrush>
			</Label.Foreground>
		</Label>

Advertisements

#216 – Defining Several Different Gradient Stops in a Gradient Fill

When defining a gradient fill, you can include a number of different gradient stops.  For each stop, you define the color that the gradient should be at that stop (set Color property), and the location of the stop along the gradient line, from 0.0 to 1.0 (Offset property).

Here’s an example of a left-to-right gradient that has five different stops:

		<Button Content="5 stops - Red, Green, Orange, Blue, Pink" Height="200" Width="300">
			<Button.Background>
				<LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
					<GradientStop Color="Red" Offset="0.0"/>
					<GradientStop Color="Green" Offset="0.2"/>
					<GradientStop Color="Orange" Offset="0.5"/>
					<GradientStop Color="Blue" Offset="0.9"/>
					<GradientStop Color="Pink" Offset="1.0"/>
				</LinearGradientBrush>
			</Button.Background>
		</Button>


Here’s a gradient brush that defines the seven colors of the rainbow.

                <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
                    <GradientStop Color="Red" Offset="0.0"/>
                    <GradientStop Color="Orange" Offset="0.17"/>
                    <GradientStop Color="Yellow" Offset="0.33"/>
                    <GradientStop Color="Green" Offset="0.5"/>
                    <GradientStop Color="Blue" Offset="0.67"/>
                    <GradientStop Color="Indigo" Offset="0.83"/>
                    <GradientStop Color="Violet" Offset="1.0"/>
                </LinearGradientBrush>