BorderThickness Value in WPF

This Article shows how to animate changes to the thickness of a border by using the ThicknessAnimation class.
  • 6072

This Article shows how to animate changes to the thickness of a border by using the ThicknessAnimation class.

The following example animates the thickness of a border by using ThicknessAnimation. The example uses the BorderThickness property of Border.

XAML

<!-- This example shows how to use the ThicknessAnimation to create
an animation on the BorderThickness property of a Border. -->

<Page  xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >

    <StackPanel Orientation="Vertical" HorizontalAlignment="Center">
        <Border Background="#99FFFFFF" BorderBrush="#CCCCFF" BorderThickness="1"
    Margin="0,60,0,20" Padding="20"  >
            <Border.Triggers>
                <EventTrigger RoutedEvent="Border.Loaded">
                    <BeginStoryboard>
                        <Storyboard>

                            <!-- BorderThickness animates from left=1, right=1, top=1, and bottom=1 to
              left=28, right=28, top=14, and bottom=14 over one second. -->
                            <ThicknessAnimation
                Storyboard.TargetProperty="BorderThickness"
                Duration="0:0:1.5" FillBehavior="HoldEnd" From="1,1,1,1" To="28,14,28,14" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Border.Triggers>
            <TextBlock>
        This example shows how to use the ThicknessAnimation to create
        an animation on the BorderThickness property of a Border.
           
</TextBlock>
        </Border>
    </StackPanel>
</
Page>

Output:

thickness.gif

Categories

More Articles

© 2020 DotNetHeaven. All rights reserved.