[C#/WPF] Timeline 엘리먼트 : BeginTime 속성 사용하기

■ Timeline 엘리먼트의 BeginTime 속성을 사용하는 방법을 보여준다.

▶ 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"
    FontFamily="나눔고딕코딩"
    FontSize="16">
    <Window.Resources>
        <DrawingBrush x:Key="GridDrawingBrushKey"
            Viewport="0 0 10 10"
            ViewportUnits="Absolute"
            TileMode="Tile">
            <DrawingBrush.Drawing>
                <DrawingGroup>
                    <DrawingGroup.Children>
                        <GeometryDrawing Brush="#99ffffff">
                            <GeometryDrawing.Geometry>
                                <RectangleGeometry Rect="0 0 1 1" />
                            </GeometryDrawing.Geometry>
                        </GeometryDrawing>
                        <GeometryDrawing
                            Brush="#99ccccff"
                            Geometry="M 0 0 L 1 0 1 0.1 0 0.1 Z" />
                        <GeometryDrawing
                            Brush="#99ccccff"
                            Geometry="M 0 0 L 0 1 0.1 1 0.1 0 Z" />
                    </DrawingGroup.Children>
                </DrawingGroup>
            </DrawingBrush.Drawing>
        </DrawingBrush>
    </Window.Resources>
    <Grid
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Width="500">
        <StackPanel Background="{StaticResource GridDrawingBrushKey}">
            <TextBlock>Animation BeginTime : "00:00:00"</TextBlock>
            <Rectangle Name="defaultBeginTimeRectangle"
                HorizontalAlignment="Left"
                Margin="0 10 0 0"
                Width="20"
                Height="20"
                Fill="#aa3333ff" />
            <TextBlock Margin="0 20 0 0">Animation BeginTime : "00:00:05"</TextBlock>
            <Rectangle Name="delayedBeginTimeRectangle"
                HorizontalAlignment="Left"
                Margin="0 10 0 0"
                Width="20"
                Height="20"
                Fill="#aa3333ff" />
            <TextBlock Margin="0 20 0 0">Parent Timeline BeginTime : "00:00:05"<LineBreak/>Animation BeginTime : "00:00:05"</TextBlock>
            <Rectangle Name="delayedAnimationWithDelayedParentRectangle"
                HorizontalAlignment="Left"
                Margin="0 10 0 0"
                Width="20"
                Height="20"
                Fill="#aa3333ff" />
            <Button
                HorizontalAlignment="Left"
                Margin="0 30 0 0"
                Width="180"
                Height="30">
                Restart Animations
                <Button.Triggers>
                    <EventTrigger RoutedEvent="Button.Click">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation
                                    Storyboard.TargetName="defaultBeginTimeRectangle"
                                    Storyboard.TargetProperty="(Rectangle.Width)"
                                    BeginTime="00:00:00"
                                    Duration="00:00:02"
                                    From="20"
                                    To="400"
                                    FillBehavior="HoldEnd" />
                                <DoubleAnimation
                                    Storyboard.TargetName="delayedBeginTimeRectangle"
                                    Storyboard.TargetProperty="(Rectangle.Width)"
                                    BeginTime="00:00:05"
                                    Duration="00:00:02"
                                    From="20"
                                    To="400"
                                    FillBehavior="HoldEnd" />
                                <ParallelTimeline BeginTime="00:00:05">
                                    <DoubleAnimation
                                        Storyboard.TargetName="delayedAnimationWithDelayedParentRectangle"
                                        Storyboard.TargetProperty="(Rectangle.Width)"
                                        BeginTime="00:00:05"
                                        Duration="00:00:02"
                                        From="20"
                                        To="400"
                                        FillBehavior="HoldEnd" />
                                </ParallelTimeline>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Button.Triggers>
            </Button>
        </StackPanel>
    </Grid>
</Window>

100

101

102

103

104

<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"

FontFamily="나눔고딕코딩"

FontSize="16">

<Window.Resources>

<DrawingBrush x:Key="GridDrawingBrushKey"

Viewport="0 0 10 10"

ViewportUnits="Absolute"

TileMode="Tile">

<DrawingBrush.Drawing>

<DrawingGroup.Children>

<GeometryDrawing.Geometry>

</GeometryDrawing.Geometry>

</GeometryDrawing>

<GeometryDrawing

Brush="#99ccccff"

Geometry="M 0 0 L 1 0 1 0.1 0 0.1 Z" />

<GeometryDrawing

Brush="#99ccccff"

Geometry="M 0 0 L 0 1 0.1 1 0.1 0 Z" />

</DrawingGroup.Children>

</DrawingGroup>

</DrawingBrush.Drawing>

</DrawingBrush>

</Window.Resources>

<Grid

HorizontalAlignment="Center"

VerticalAlignment="Center"

Width="500">

<TextBlock>Animation BeginTime : "00:00:00"</TextBlock>

<Rectangle Name="defaultBeginTimeRectangle"

HorizontalAlignment="Left"

Margin="0 10 0 0"

Width="20"

Height="20"

Fill="#aa3333ff" />

<TextBlock Margin="0 20 0 0">Animation BeginTime : "00:00:05"</TextBlock>

<Rectangle Name="delayedBeginTimeRectangle"

HorizontalAlignment="Left"

Margin="0 10 0 0"

Width="20"

Height="20"

Fill="#aa3333ff" />

<TextBlock Margin="0 20 0 0">Parent Timeline BeginTime : "00:00:05"<LineBreak/>Animation BeginTime : "00:00:05"</TextBlock>

<Rectangle Name="delayedAnimationWithDelayedParentRectangle"

HorizontalAlignment="Left"

Margin="0 10 0 0"

Width="20"

Height="20"

Fill="#aa3333ff" />

<Button

HorizontalAlignment="Left"

Margin="0 30 0 0"

Width="180"

Height="30">

Restart Animations

<Button.Triggers>

<DoubleAnimation

Storyboard.TargetName="defaultBeginTimeRectangle"

Storyboard.TargetProperty="(Rectangle.Width)"

BeginTime="00:00:00"

Duration="00:00:02"

From="20"

To="400"

FillBehavior="HoldEnd" />

<DoubleAnimation

Storyboard.TargetName="delayedBeginTimeRectangle"

Storyboard.TargetProperty="(Rectangle.Width)"

BeginTime="00:00:05"

Duration="00:00:02"

From="20"

To="400"

FillBehavior="HoldEnd" />

<DoubleAnimation

Storyboard.TargetName="delayedAnimationWithDelayedParentRectangle"

Storyboard.TargetProperty="(Rectangle.Width)"

BeginTime="00:00:05"

Duration="00:00:02"

From="20"

To="400"

FillBehavior="HoldEnd" />

</ParallelTimeline>

</Storyboard>

</BeginStoryboard>

</EventTrigger>

</Button.Triggers>

</Button>

</StackPanel>

</Grid>

</Window>

TestProject.zip

.NETFRAMEWORK 2D ANIMATION C# GRAPHICS MICROSOFT WPF

icodebroker

[C#/WPF] Timeline 엘리먼트 : BeginTime 속성 사용하기

분류

가장 많이 읽힌 글

보관함