Did You Know That… You can create vertical or horizontal linear gradients?

By default, linear gradients are on a diagonal. 

Understanding this begins with the implicit assumption of a coordinate system superimposed on every shape in which the upper-left hand corner is set to 0,0, with the x axis extending to 1 at the right edge of the shape, and the y axis set to 1 at the bottom of the shape.

LinearGradientCoordinates

An implicit diagonal is then superimposed from 0,0 to 1,1, and the colors are placed at GradientStops along that diagonal. The LinearGradientBrush blends the colors evenly from one Stop to the next,

<LinearGradientBrush >
  <GradientStop Color="Red"
                Offset="0.0"/>
  <GradientStop Color="Orange"
                Offset="0.143"/>
  <GradientStop Color="Yellow"
                Offset="0.286"/>
  <GradientStop Color="Green"
                Offset="0.429"/>
  <GradientStop Color="Blue"
                Offset="0.572"/>
  <GradientStop Color="Indigo"
                Offset="0.715"/>
  <GradientStop Color="Violet"
                Offset="1.0"/>
</LinearGradientBrush>
LinearGradientWithDiagonal 

You can see, therefore why the color lines are on a diagonal,  but this is actually trivial to change. If you prefer vertical lines, you have only to change the origin and termination of the gradient line; instructing it to run not from 0,0 to 1,1 but rather from 0,0.5 to 1, 0.5. 

<LinearGradientBrush StartPoint="0,0.5"
                     EndPoint="1,0.5" >

That is, the line will run from 0 to 1 on the x axis, but will run from 0.5 to 0.5 (no change at all) on the y axis,

HorizGradient

Of course,  you can create horizontal lines by setting the x axis to start and end at 0.5 and letting the y coordinates move from 0 to 1.

 Update: For more on this topic you may want to watch either this video, or this video.

kick it on DotNetKicks.com

About Jesse Liberty

Jesse Liberty has three decades of experience writing and delivering software projects and is the author of 2 dozen books and a couple dozen online courses. His latest book, Building APIs with .NET will be released early in 2025. Liberty is a Senior SW Engineer for CNH and he was a Senior Technical Evangelist for Microsoft, a Distinguished Software Engineer for AT&T, a VP for Information Services for Citibank and a Software Architect for PBS. He is a Microsoft MVP.
This entry was posted in z Silverlight Archives. Bookmark the permalink.