키프레임 (KeyFrame) - SplineColorKeyFrame (속도가변곡선, 보간법, 비선형)

.NET프로그래밍/Silverlight 3.0 2009. 12. 4. 11:30 |



[MainPage.xaml]


<UserControl x:Class="RiaSplineColorKeyFrame.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Canvas x:Name="LayoutRoot" Background="White">

        <Canvas.Resources>

            <Storyboard x:Name="sb">

                <DoubleAnimationUsingKeyFrames

                    Storyboard.TargetName="rect" AutoReverse="True" RepeatBehavior="Forever"

                    Storyboard.TargetProperty="(Canvas.Top)"

                    Duration="00:00:10">

                    <DoubleAnimationUsingKeyFrames.KeyFrames>

                        <!-- 위쪽에서 당기는 타원 : 빨리가다가 천천히 -->

                        <SplineDoubleKeyFrame KeyTime="0:0:5" Value="210" KeySpline="0.0,1.0,1.0,1.0"></SplineDoubleKeyFrame>

                        <!-- 아래쪽에서 당기는 타원 : 천천히가다가 빨리 -->

                        <SplineDoubleKeyFrame KeyTime="0:0:10" Value="420" KeySpline="1.0,0.0,1.0,1.0"></SplineDoubleKeyFrame>

                    </DoubleAnimationUsingKeyFrames.KeyFrames>

                </DoubleAnimationUsingKeyFrames>

            </Storyboard>

        </Canvas.Resources>

 

        <Rectangle x:Name="rect" Width="50" Height="50" Canvas.Left="10" Canvas.Top="10" Fill="Red" />

    </Canvas>

</UserControl>

 

 







[MainPage.xaml.cs]


using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaSplineColorKeyFrame

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

 

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

        }

 

        void MainPage_Loaded(object sender, RoutedEventArgs e)

        {

            sb.Begin();

        }

    }

}

 

 









저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

VisualStateManager 클래스  (0) 2009.12.07
키프레임 (KeyFrame) - EasingDoubleKeyFrame (여러가지 모양을 단어화(함수화))  (0) 2009.12.04
키프레임 (KeyFrame) - DiscreteColorKeyFrame (끊어지는 움직임)  (0) 2009.12.04
키프레임 (KeyFrame) - LinearDoubleKeyFrame (연속적인 움직임, 선형)  (0) 2009.12.04
키프레임 (KeyFrame) - DoubleAnimationUsingKeyFrames  (0) 2009.12.04
Posted by holland14
:

키프레임 (KeyFrame) - DiscreteColorKeyFrame (끊어지는 움직임)

.NET프로그래밍/Silverlight 3.0 2009. 12. 4. 10:28 |




[MainPage.xaml]


<UserControl x:Class="RiaDiscreteColorKeyFrame.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Canvas x:Name="LayoutRoot" Background="White">

        <!-- 리소스 -->

        <Canvas.Resources>

            <Storyboard x:Name="sb">

                <!-- 3초, 6초, 9초마다 오른쪽으로 100픽셀씩 끊어서 이동 -->

                <DoubleAnimationUsingKeyFrames

                    Storyboard.TargetName="rect"

                    Storyboard.TargetProperty="(Canvas.Left)"

                    Duration="0:0:9">

                    <DoubleAnimationUsingKeyFrames.KeyFrames>

                        <DiscreteDoubleKeyFrame KeyTime="00:00:03" Value="110"></DiscreteDoubleKeyFrame>

                        <DiscreteDoubleKeyFrame KeyTime="00:00:06" Value="210"></DiscreteDoubleKeyFrame>

                        <DiscreteDoubleKeyFrame KeyTime="00:00:09" Value="310"></DiscreteDoubleKeyFrame>

                    </DoubleAnimationUsingKeyFrames.KeyFrames>

                </DoubleAnimationUsingKeyFrames>

            </Storyboard>

        </Canvas.Resources>

 

        <!-- 요소 -->

        <Rectangle x:Name="rect" Width="50" Height="50" Canvas.Left="10" Canvas.Top="10" Fill="Red" />       

    </Canvas>

</UserControl>

 

 





[MainPage.xaml.cs]

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaDiscreteColorKeyFrame

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

 

            this.rect.MouseLeftButtonDown += new MouseButtonEventHandler(rect_MouseLeftButtonDown);

        }

 

        void rect_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)

        {

            sb.Begin();

        }

 

       

    }

}

 

 



 

저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

키프레임 (KeyFrame) - EasingDoubleKeyFrame (여러가지 모양을 단어화(함수화))  (0) 2009.12.04
키프레임 (KeyFrame) - SplineColorKeyFrame (속도가변곡선, 보간법, 비선형)  (0) 2009.12.04
키프레임 (KeyFrame) - LinearDoubleKeyFrame (연속적인 움직임, 선형)  (0) 2009.12.04
키프레임 (KeyFrame) - DoubleAnimationUsingKeyFrames  (0) 2009.12.04
키프레임 (KeyFrame) - ColorAnimationUsingKeyFrames  (0) 2009.12.04
Posted by holland14
:

키프레임 (KeyFrame) - LinearDoubleKeyFrame (연속적인 움직임, 선형)

.NET프로그래밍/Silverlight 3.0 2009. 12. 4. 10:27 |


[MainPage.xaml]


<UserControl x:Class="RiaLinearDoubleKeyFrame.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Canvas x:Name="LayoutRoot" Background="White">

        <!-- 리소스 -->

        <Canvas.Resources>

            <Storyboard x:Name="sb">

                <ColorAnimationUsingKeyFrames

                    Storyboard.TargetName="rect"

                    Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"

                    Duration="0.00:00:10.0">

                    <ColorAnimationUsingKeyFrames.KeyFrames>

                        <LinearColorKeyFrame KeyTime="0:0:0" Value="red" />

                        <LinearColorKeyFrame KeyTime="0:0:2" Value="Yellow" />

                        <LinearColorKeyFrame KeyTime="0:0:4" Value="Green" />

                        <LinearColorKeyFrame KeyTime="0:0:6" Value="Silver" />

                        <LinearColorKeyFrame KeyTime="0:0:8" Value="Orange" />

                        <LinearColorKeyFrame KeyTime="0:0:10" Value="SkyBlue" />

                    </ColorAnimationUsingKeyFrames.KeyFrames>

                </ColorAnimationUsingKeyFrames>

            </Storyboard>

        </Canvas.Resources>

                

        <!-- 요소 -->

        <Rectangle x:Name="rect" Width="30" Height="30" Fill="Red">

        </Rectangle>

    </Canvas>

</UserControl>

 

 






[MainPage.xaml.cs]


using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaLinearDoubleKeyFrame

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

 

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

        }

 

        void MainPage_Loaded(object sender, RoutedEventArgs e)

        {

            sb.Begin();

        }

    }

}

 

 







저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

키프레임 (KeyFrame) - SplineColorKeyFrame (속도가변곡선, 보간법, 비선형)  (0) 2009.12.04
키프레임 (KeyFrame) - DiscreteColorKeyFrame (끊어지는 움직임)  (0) 2009.12.04
키프레임 (KeyFrame) - DoubleAnimationUsingKeyFrames  (0) 2009.12.04
키프레임 (KeyFrame) - ColorAnimationUsingKeyFrames  (0) 2009.12.04
여러개의 타임라인 사용하기  (0) 2009.12.03
Posted by holland14
:

키프레임 (KeyFrame) - DoubleAnimationUsingKeyFrames

.NET프로그래밍/Silverlight 3.0 2009. 12. 4. 10:08 |



[FrmDoubleAnimationUsingKeyFrames.xaml]


<UserControl x:Class="RiaKeyFrames.FrmDoubleAnimationUsingKeyFrames"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

   

    <Canvas x:Name="LayoutRoot" Background="White">

        <!-- 선언부 -->

        <Canvas.Resources>

            <Storyboard x:Name="sb">

                <DoubleAnimationUsingKeyFrames

                    Storyboard.TargetName="rect" Storyboard.TargetProperty="(Canvas.Left)"

                    Duration="00:00:10"

                >

                    <DoubleAnimationUsingKeyFrames.KeyFrames>

                        <LinearDoubleKeyFrame KeyTime="0:0:5" Value="250"></LinearDoubleKeyFrame>

                        <LinearDoubleKeyFrame KeyTime="0:0:10" Value="450"></LinearDoubleKeyFrame>

                    </DoubleAnimationUsingKeyFrames.KeyFrames>

                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames

                    Storyboard.TargetName="rect" Storyboard.TargetProperty="(Canvas.Top)"

                    Duration="00:00:10"

                >

                    <DoubleAnimationUsingKeyFrames.KeyFrames>

                        <LinearDoubleKeyFrame KeyTime="0:0:5" Value="250"></LinearDoubleKeyFrame>

                        <LinearDoubleKeyFrame KeyTime="0:0:10" Value="450"></LinearDoubleKeyFrame>

                    </DoubleAnimationUsingKeyFrames.KeyFrames>

                </DoubleAnimationUsingKeyFrames>

            </Storyboard>

        </Canvas.Resources>

       

        <!-- 적용부 -->

        <Rectangle x:Name="rect" Width="50" Height="50" Canvas.Left="50" Canvas.Top="50"

            Fill="Red" Stroke="Blue" StrokeThickness="2" RadiusX="5" RadiusY="5"

        />

    </Canvas>

</UserControl>

 

 







[FrmDoubleAnimationUsingKeyFrames.xaml.cs]


using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaKeyFrames

{

    public partial class FrmDoubleAnimationUsingKeyFrames : UserControl

    {

        public FrmDoubleAnimationUsingKeyFrames()

        {

            InitializeComponent();

            this.Loaded += new RoutedEventHandler(FrmDoubleAnimationUsingKeyFrames_Loaded);

        }

 

        void FrmDoubleAnimationUsingKeyFrames_Loaded(object sender, RoutedEventArgs e)

        {

            sb.Begin();

        }

    }

}

 

 






저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

키프레임 (KeyFrame) - DiscreteColorKeyFrame (끊어지는 움직임)  (0) 2009.12.04
키프레임 (KeyFrame) - LinearDoubleKeyFrame (연속적인 움직임, 선형)  (0) 2009.12.04
키프레임 (KeyFrame) - ColorAnimationUsingKeyFrames  (0) 2009.12.04
여러개의 타임라인 사용하기  (0) 2009.12.03
ColorAnimation  (0) 2009.12.03
Posted by holland14
:

키프레임 (KeyFrame) - ColorAnimationUsingKeyFrames

.NET프로그래밍/Silverlight 3.0 2009. 12. 4. 09:42 |



[FrmColorAnimationUsingKeyFrames.xaml]


<UserControl x:Class="RiaKeyFrames.FrmColorAnimationUsingKeyFrames"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

   

    <Canvas x:Name="LayoutRoot" Background="White">

        <!-- 애니메이션 정의 -->

        <Canvas.Resources>

            <Storyboard x:Name="sb">

                <ColorAnimationUsingKeyFrames

                    Storyboard.TargetName="rect"

                    Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"

 

                    Duration="0:0:3"

                >

                    <ColorAnimationUsingKeyFrames.KeyFrames>

                        <LinearColorKeyFrame KeyTime="0:0:0" Value="Red"></LinearColorKeyFrame>

                        <LinearColorKeyFrame KeyTime="0:0:1" Value="Yellow"></LinearColorKeyFrame>

                        <LinearColorKeyFrame KeyTime="0:0:2" Value="Blue"></LinearColorKeyFrame>

                        <LinearColorKeyFrame KeyTime="0:0:3" Value="Red"></LinearColorKeyFrame>

                    </ColorAnimationUsingKeyFrames.KeyFrames>                   

                </ColorAnimationUsingKeyFrames>

            </Storyboard>

        </Canvas.Resources>

 

        <!-- 요소 -->

        <Rectangle x:Name="rect" Width="100" Height="100" Canvas.Left="50" Canvas.Top="50"

            Fill="Red"

        />

    </Canvas>

</UserControl>

 

 








[FrmColorAnimationUsingKeyFrames.xaml.cs]


using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaKeyFrames

{

    public partial class FrmColorAnimationUsingKeyFrames : UserControl

    {

        public FrmColorAnimationUsingKeyFrames()

        {

            InitializeComponent();

 

            this.Loaded += new RoutedEventHandler(FrmColorAnimationUsingKeyFrames_Loaded);

        }

 

        void FrmColorAnimationUsingKeyFrames_Loaded(object sender, RoutedEventArgs e)

        {

            this.sb.Begin();

        }

    }

}

 

 










저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

키프레임 (KeyFrame) - LinearDoubleKeyFrame (연속적인 움직임, 선형)  (0) 2009.12.04
키프레임 (KeyFrame) - DoubleAnimationUsingKeyFrames  (0) 2009.12.04
여러개의 타임라인 사용하기  (0) 2009.12.03
ColorAnimation  (0) 2009.12.03
PointAnimation  (0) 2009.12.03
Posted by holland14
:

여러개의 타임라인 사용하기

.NET프로그래밍/Silverlight 3.0 2009. 12. 3. 16:08 |



[MainPage.xaml]


<UserControl x:Class="RiaTimeline.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">

        <!-- 스토리보드 -->

        <Grid.Resources>

            <!-- 오른쪽으로 100픽셀 이동 -->

            <Storyboard x:Name="point">

                <PointAnimation

                    Storyboard.TargetName="won" Storyboard.TargetProperty="Center"

                    From="50,50" To="150,50" Duration="0:0:2" AutoReverse="True"

                />

            </Storyboard>

            <!-- Red에서 Blue로 변경 -->

            <Storyboard x:Name="color">

                <ColorAnimation

                    Storyboard.TargetName="myPath"

                    Storyboard.TargetProperty="(Fill).(SolidColorBrush.Color)"

                    From="Red" To="Blue" Duration="0:0:2" AutoReverse="True"

                />

            </Storyboard>

        </Grid.Resources>

        <-- 요소 -->

        <Path x:Name="myPath" Fill="Red" Stroke="Blue">

            <Path.Data>

                <EllipseGeometry x:Name="won" Center="50,50" RadiusX="50" RadiusY="50" />

            </Path.Data>

        </Path>

    </Grid>

</UserControl>

 

 








[MainPage.xaml.cs]

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaTimeline

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

 

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

        }

 

        void MainPage_Loaded(object sender, RoutedEventArgs e)

        {

            this.point.Begin();

            this.color.Begin();

        }

    }

}

 

 

 

 



































저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

키프레임 (KeyFrame) - DoubleAnimationUsingKeyFrames  (0) 2009.12.04
키프레임 (KeyFrame) - ColorAnimationUsingKeyFrames  (0) 2009.12.04
ColorAnimation  (0) 2009.12.03
PointAnimation  (0) 2009.12.03
EventTrigger가 아닌 리소스를 사용  (0) 2009.12.03
Posted by holland14
:

ColorAnimation

.NET프로그래밍/Silverlight 3.0 2009. 12. 3. 16:06 |



[MainPage.xaml]


<UserControl x:Class="RiaColorAnimation.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Grid x:Name="LayoutRoot" Background="White">

        <!--[1] Storyboard-->

        <Grid.Triggers>

            <EventTrigger RoutedEvent="Grid.Loaded">

                <BeginStoryboard>

                    <Storyboard>

                        <ColorAnimation

                            Storyboard.TargetName="rect"

                            Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)"

 

                            Duration="0.0:0:5.0"

                            From="Red"

                            To="Blue"

                            AutoReverse="True"

                            RepeatBehavior="Forever"

                        />

                    </Storyboard>

                </BeginStoryboard>

            </EventTrigger>

        </Grid.Triggers>

        <!--[2] 사각형 -->

        <StackPanel>

            <Rectangle x:Name="rect" Width="100" Height="100" Fill="Red" Margin="10"

                Stroke="Yellow" StrokeThickness="3" RadiusX="10" RadiusY="5" />

        </StackPanel>

    </Grid>

</UserControl>

 

 





















저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

키프레임 (KeyFrame) - ColorAnimationUsingKeyFrames  (0) 2009.12.04
여러개의 타임라인 사용하기  (0) 2009.12.03
PointAnimation  (0) 2009.12.03
EventTrigger가 아닌 리소스를 사용  (0) 2009.12.03
<DoubleAnimation /> - 이미지에 Animation 효과 주기(FadeIn)  (0) 2009.12.03
Posted by holland14
:

PointAnimation

.NET프로그래밍/Silverlight 3.0 2009. 12. 3. 15:51 |




[MainPage.xaml]


<UserControl x:Class="RiaPointAnimation.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Canvas Background="White" Width="400" Height="300">

        <!--[1] 스토리보드 정의-->

        <Canvas.Triggers>

            <EventTrigger RoutedEvent="Canvas.Loaded">

                <BeginStoryboard>

                    <Storyboard>

                        <PointAnimation

                            Storyboard.TargetName="line"

                            Storyboard.TargetProperty="EndPoint"

 

                            Duration="0.0:0:2.0"

                            From="100, 100"

                            To="100, 50"

                            AutoReverse="True"

                            RepeatBehavior="2x"

                        />

                    </Storyboard>

                </BeginStoryboard>

            </EventTrigger>

        </Canvas.Triggers>

        <!--[2] 대상 요소 정의 : 라인-->

        <Path Fill="Black" Stroke="Black">

            <Path.Data>

                <LineGeometry x:Name="line" StartPoint="50, 50" EndPoint="100, 100" />

            </Path.Data>

        </Path>

    </Canvas>

</UserControl>

 

 























저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

여러개의 타임라인 사용하기  (0) 2009.12.03
ColorAnimation  (0) 2009.12.03
EventTrigger가 아닌 리소스를 사용  (0) 2009.12.03
<DoubleAnimation /> - 이미지에 Animation 효과 주기(FadeIn)  (0) 2009.12.03
애니메이션 (Animation)  (0) 2009.12.03
Posted by holland14
:

EventTrigger가 아닌 리소스를 사용

.NET프로그래밍/Silverlight 3.0 2009. 12. 3. 14:59 |



[MainPage.xaml]


<UserControl x:Class="RiaStoryBoard.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Grid x:Name="LayoutRoot" Background="White">

        <!--[1] 스토리보드 정의-->

        <Grid.Resources>

            <Storyboard x:Name="myStory">

                <DoubleAnimation

                    Storyboard.TargetName="rect"

                    Storyboard.TargetProperty="Opacity"

 

                    Duration="0.0:0:5.0"

                    From="0.0"

                    To="1.0"

                    AutoReverse="True"

                    RepeatBehavior="Forever"

                />

            </Storyboard>

        </Grid.Resources>

 

        <!--[2] 애니메이션 사용-->

        <Rectangle x:Name="rect" Fill="Yellow" Stroke="Red" StrokeThickness="1"

            RadiusX="10" RadiusY="10" Width="100" Height="100"

        >

        </Rectangle>

    </Grid>

</UserControl>

 

 







[MainPage.xaml.cs]


using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaStoryBoard

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

 

            this.rect.MouseEnter += new MouseEventHandler(rect_MouseEnter);

            this.rect.MouseLeave += new MouseEventHandler(rect_MouseLeave);

        }

 

        void rect_MouseLeave(object sender, MouseEventArgs e)

        {

            this.myStory.Stop(); // 멈춤

        }

 

        void rect_MouseEnter(object sender, MouseEventArgs e)

        {

            this.myStory.Begin(); // 스토리보드(애니메이션) 실행

        }

    }

}

 

 
































저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

ColorAnimation  (0) 2009.12.03
PointAnimation  (0) 2009.12.03
<DoubleAnimation /> - 이미지에 Animation 효과 주기(FadeIn)  (0) 2009.12.03
애니메이션 (Animation)  (0) 2009.12.03
템플릿(Template) : 컨트롤 모양 미리 정의  (0) 2009.12.03
Posted by holland14
:

<DoubleAnimation /> - 이미지에 Animation 효과 주기(FadeIn)

.NET프로그래밍/Silverlight 3.0 2009. 12. 3. 14:43 |



- 아래그림의 '솔루션 탐색기'에서 '이미지'파일인 "silverlight.png"파일을 추가한다.









[MainPage.xaml]


<UserControl x:Class="RiaDoubleAnimation.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

 

    <Grid x:Name="LayoutRoot" Background="White">

        <Image x:Name="imgLogo" Source="silverlight.png">

            <Image.Triggers>

                <EventTrigger RoutedEvent="Image.Loaded">

                    <BeginStoryboard>

                        <Storyboard>

                            <DoubleAnimation

                                Storyboard.TargetName="imgLogo"

                                Storyboard.TargetProperty="Opacity"

                               

                                Duration="0.0:0:2.5"

                                From="0.0"

                                To="1.0"

                                AutoReverse="True"

                                RepeatBehavior="Forever"

                            />

                        </Storyboard>

                    </BeginStoryboard>

                </EventTrigger>

            </Image.Triggers>

        </Image>

    </Grid>

</UserControl>

 

 























저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

PointAnimation  (0) 2009.12.03
EventTrigger가 아닌 리소스를 사용  (0) 2009.12.03
애니메이션 (Animation)  (0) 2009.12.03
템플릿(Template) : 컨트롤 모양 미리 정의  (0) 2009.12.03
스타일(Style) : 재 사용 가능한 속성 집합  (0) 2009.12.03
Posted by holland14
:

티스토리툴바