Ranjith Venkatesh
Ranjith Venkatesh

Reputation: 1362

Linear Gradient from bottom to top

I need an Ellipse with a linear gradient from bottom(pink) to top(red).

<Ellipse Width="200" Height="200">    
    <Ellipse.Fill>

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

            <GradientStop Color="Pink" Offset="0" />

            <GradientStop Color="Red" Offset="1" />

        </LinearGradientBrush>

    </Ellipse.Fill>    
</Ellipse>

The above code shows a gradient from left bottom to top right.

I need the gradient to move from left middle to top middle.

I tried changing the starting and end point with no success. Is there another property that can be used?

It has to be a linear gradient on a ellipse. I cannot use a radial gradient here.

Upvotes: 8

Views: 9028

Answers (2)

Pavlo Datsiuk
Pavlo Datsiuk

Reputation: 1108

Visual representation of how it works

enter image description here

enter image description here

enter image description here

Upvotes: 10

ASh
ASh

Reputation: 35646

gradient from Bottom to Top (vertical)

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

gradient from left middle to top middle

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

Upvotes: 18

Related Questions