(C#/WPF) DoubleAnimation 요소: To 속성에서 데이터 바인딩 사용

■ DoubleAnimation 요소의 To 속성에서 데이터 바인딩을 사용하는 방법을 보여줍니다.

MainWindow.xaml

<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="800"
    Height="600"
    Title="TestProject"
    Background="Cornsilk"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <StackPanel
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <TextBlock>Select a destination value :</TextBlock>
        <Slider Name="sourceSlider"
            HorizontalAlignment="Left"
            Margin="0 10 0 0"
            Width="500"
            Orientation="Horizontal"
            Minimum="25"
            Maximum="500" />
        <Rectangle
            HorizontalAlignment="Left"
            Margin="0 10 0 0"
            Width="{Binding ElementName=sourceSlider, Path=Value}"
            Height="30"
            Fill="Red" />
        <TextBlock Margin="0 30 0 0">Animated Rectangle</TextBlock>
        <Rectangle Name="targetRectangle"
            HorizontalAlignment="Left"
            Margin="0 10 0 0"
            Width="50"
            Height="30"
            Fill="Blue" />
        <Button Name="triggerAnimationButton"
            Margin="0 30 0 0"
            Width="160"
            Height="30"
            Content="Trigger animation">
            <Button.Triggers>
                <EventTrigger
                    SourceName="triggerAnimationButton"
                    RoutedEvent="Button.Click">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard FillBehavior="HoldEnd">
                                <DoubleAnimation
                                    FillBehavior="HoldEnd"
                                    BeginTime="00:00:00"
                                    Storyboard.TargetName="targetRectangle"
                                    Storyboard.TargetProperty="Width"
                                    Duration="00:00:03"
                                    To="{Binding ElementName=sourceSlider, Path=Value}"
                                    From="0" />
                            </Storyboard>
                        </BeginStoryboard >
                    </EventTrigger.Actions>
                </EventTrigger>
            </Button.Triggers>
        </Button>
    </StackPanel>
</Window>