#219 – Changing the Radius of a Radial Gradient

By default, the radius of a radial gradient is always half of the height and width of the control.  In other words, the gradient will extend exactly to the edge of the control.  In the example below, the gradient goes from white to dark blue and reaches dark blue at the edges of the ellipse.

We can change the radius of the gradient using the RadialGradientBrush.RadiusX and RadiusY properties.  The default value for both is 0.5, indicating that the gradient takes 1/2 the height or width of the circle to reach the final color.

If we change the radius to 0.25, we reach the final color of the gradient halfway out to the edge of the ellipse:

	<RadialGradientBrush x:Name="grad" RadiusX="0.25" RadiusY="0.25">
		<GradientStop Color="White" Offset="0.0"/>
		<GradientStop Color="LightBlue" Offset="0.5"/>
		<GradientStop Color="DarkBlue" Offset="1.0"/>
	</RadialGradientBrush>

About these ads

About Sean
Software developer in the Twin Cities area, passionate about .NET technologies. Equally passionate about my own personal projects related to family history and preservation of family stories and photos.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 228 other followers

%d bloggers like this: