Adding a RadialGradientBrush
RadialGradientBrush elements are very similar to the LinearGradientBrush. They define a radial gradient that flows between two or more colors. You can apply them to the properties of Silverlight controls the same way that the LinearGradientBrush is applied.
To apply a RadialGradientBrush to a Silverlight control, you need to define the Radial- GradientBrush element. You can define the center of the gradient radius using the GradientOrigin property. The GradientOrigin is set on a 0 to 1 coordinate system separated by a comma.
You can also define the radius of the gradient in the X and Y planes using the RadiusX and RadiusY properties. These properties are set on a scale where 1 is the Height or Width of the Silverlight control.
Then you also need to define two or more GradientStop elements inside the Radial- GradientBrush. Each GradientStop element needs the Color property set. You can also define the offset between 0 and 1 where that color is set using the Offset property. Silverlight applies the gradient on a radius centered at the GradientOrigin and defined by the RadiusX and RadiusY properties matching the colors at each GradientStop along the way.
Eg:
< Rectangle Height="200" Width="200" >
< Rectangle.Fill >
< RadialGradientBrush >
< GradientStop Color="Blue" />
< GradientStop Color="White" Offset=".5" / >
< GradientStop Color="Blue" Offset=".9"/ >
< /RadialGradientBrush >
< /Rectangle.Fill >
< /Rectangle >
Eg:
< Rectangle Height="200" Width="200" >
< Rectangle.Fill >
< RadialGradientBrush GradientOrigin="0,0" >
< GradientStop Color="Blue"/ >
< GradientStop Color="White" Offset=".5"/ >
< GradientStop Color="Blue" Offset=".9"/ >
< /RadialGradientBrush >
< /Rectangle.Fill >
< /Rectangle >
Eg:
< Rectangle Height="200" Width="200" >
< Rectangle.Fill >
< RadialGradientBrush GradientOrigin=".5,.5" RadiusX=".6" RadiusY=".2" >
< GradientStop Color="Blue"/ >
< GradientStop Color="White" Offset=".5"/ >
< GradientStop Color="Blue" Offset=".9"/ >
< /RadialGradientBrush >
< /Rectangle.Fill >
< /Rectangle >
