Animated GradientStop Offset : LinearGradientBrush « Windows Presentation Foundation « C# / C Sharp

1. C# / C Sharp
2. Windows Presentation Foundation
3. LinearGradientBrush

Animated GradientStop Offset

  
<Window x:Class="WpfApplication1.ShapesWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="ShapesWindow" Height="160" Width="400">
      <Window.Resources>
        <Style TargetType="{x:Type TextBlock}">
          <Setter Property="Background" Value="White" />
          <Setter Property="Padding" Value="10" />
          <Setter Property="BitmapEffect">
            <Setter.Value>
              <OuterGlowBitmapEffect GlowColor="White" />
            </Setter.Value>
          </Setter>
        </Style>
        <Style TargetType="{x:Type Rectangle}">
          <Setter Property="BitmapEffect">
            <Setter.Value>
              <DropShadowBitmapEffect />
            </Setter.Value>
          </Setter>
        </Style>
      </Window.Resources>
    <StackPanel>
          <Rectangle Width="200"  Height="100" Stroke="Black" StrokeThickness="1" Margin="10">
            <Rectangle.Fill>
              <LinearGradientBrush>
                <GradientStop Color="MediumBlue" Offset="0.0" />
                <GradientStop x:Name="gradientStopA2" Color="Purple" Offset="0.5" />
                <GradientStop Color="Red" Offset="1.0" />
              </LinearGradientBrush>
            </Rectangle.Fill>

            <Rectangle.Triggers>
              <EventTrigger RoutedEvent="Rectangle.MouseLeftButtonDown">
                <BeginStoryboard>
                  <Storyboard>
                    <DoubleAnimation 
                      Storyboard.TargetName="gradientStopA2"
                      Storyboard.TargetProperty="Offset"
                      From="0.0" To="1.0" Duration="0:0:3" FillBehavior="Stop" />
                  </Storyboard>
                </BeginStoryboard>
              </EventTrigger>
            </Rectangle.Triggers>
          </Rectangle>
    </StackPanel>
</Window>

   
    
  

Related examples in the same category

1.	Diagonal linear gradient - multiple colors
2.	Diagonal linear gradient multiple colors 2
3.	Diagonal linear gradient with 0.5 Offset for White
4.	Horizontal linear gradient
5.	Vertical linear gradient
6.	LinearGradientBrush SpreadMethod
7.	LinearGradientBrush SpreadMethod=Reflect
8.	LinearGradientBrush SpreadMethod=Repeat
9.	RadialGradientBrush SpreadMethod=Pad
10.	RadialGradientBrush SpreadMethod=Reflect
11.	RadialGradientBrush SpreadMethod=Repeat
12.	This rectangle is painted with a diagonal linear gradient
13.	This rectangle is painted with a horizontal linear gradient
14.	This rectangle is painted with a vertical gradient
15.	This rectangle is painted with a radial gradient
16.	LinearGradientBrush examples with GradientStop as Resources
17.	Applies a RotateTransform to the brush's RelativeTransform property
18.	GradientStopCollection
19.	LinearGradientBrush Opacity from 1 to 0
20.	Animated GradientStop Color
21.	Animated GradientStop Opacity
22.	Using LinearGradientBrush to draw a 3D button