WPF实现动画的方式:

  1. 基于计时器的动画

建立一个定时器,然后根据其频率循环调用函数或者一个事件处理函数,在这个函数中可以手工更新目标属性,直到达到最终值,这时可以停止计时器。

案例:

效果图:

XAML:

<Window x:Class="WpfDispatcherTimerAnimation.MainWindow"
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"
xmlns:local="clr-namespace:WpfDispatcherTimerAnimation"
mc:Ignorable="d"
Title="MainWindow" Height="" Width="">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Ellipse Name="rectangle" Height="" Width="" Fill="Aquamarine"/>
<Button Content="开启动画" Click="ButtonBase_OnClick" Height="" Width="" Grid.Row=""/>
</Grid>
</Window>

C#代码:

using System;
using System.Windows;
using System.Windows.Threading; namespace WpfDispatcherTimerAnimation
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
/// <summary>
/// 长方形减小计时器
/// </summary>
DispatcherTimer dispatcherTimerDecrease = new DispatcherTimer(); /// <summary>
/// 长方形增大计时器
/// </summary>
DispatcherTimer dispatcherTimerIncrease = new DispatcherTimer(); /// <summary>
/// 按钮点击事件
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
dispatcherTimerIncrease.Interval = TimeSpan.FromMilliseconds();
dispatcherTimerIncrease.Tick += dispatcherTimerIncrease_Tick;
dispatcherTimerIncrease.Start();
dispatcherTimerDecrease.Interval = TimeSpan.FromMilliseconds();
dispatcherTimerDecrease.Tick += DispatcherTimerDecrease_Tick;
} /// <summary>
/// 增加计时器事件
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void DispatcherTimerDecrease_Tick(object sender, EventArgs e)
{
if (rectangle.Width < || rectangle.Height < )
{
(sender as DispatcherTimer).Stop();
dispatcherTimerIncrease.Start();
}
else if (rectangle.Width >= || rectangle.Height >= )
{
rectangle.Width -= ;
rectangle.Height -= ;
}
} /// <summary>
/// 减少计时器事件
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void dispatcherTimerIncrease_Tick(object sender, EventArgs e)
{
if (rectangle.Width < || rectangle.Height < )
{
rectangle.Width += ;
rectangle.Height += ;
}
else if (rectangle.Width >= || rectangle.Height >= )
{
(sender as DispatcherTimer).Stop();
dispatcherTimerDecrease.Start();
}
}
}
}

2.基于桢的动画

由CompositionTarget类来完成,它提供了一个回调函数(Rendering的事件处理函数),WPF会在每次界面刷新时调用该回调函数。CompositionTarget的刷新率与窗体保持一致,因此很难人工控制动画的快慢。

案例:

效果图:

XAML:

<Window x:Class="Wpf基于桢的动画.MainWindow"
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"
xmlns:local="clr-namespace:Wpf基于桢的动画"
mc:Ignorable="d"
Title="MainWindow" Height="" Width="">
<Grid >
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Ellipse Name="ellipse" Height="" Width="" Fill="Aquamarine"/>
<Button Grid.Row="" Content="开启动画" Height="" Width="" Click="ButtonBase_OnClick" />
</Grid>
</Window>

C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Windows.Threading; namespace Wpf基于桢的动画
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
} private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
CompositionTarget.Rendering+=new EventHandler(CompositionTarget_Rendering);
} private void CompositionTarget_Rendering(object sender, EventArgs e)
{
if (ellipse.Width < || ellipse.Height < )
{
ellipse.Width += ;
ellipse.Height += ;
}
else if (ellipse.Width >= || ellipse.Height >= )
{
CompositionTarget.Rendering-=new EventHandler(CompositionTarget_Rendering);
}
}
}
}

3.基于属性的动画

用一个DoubleAnimation类制定起始值(From=“”)、终点值To=“”、时间(Duration=“0:0:2.7”),以及动画结束应该(FillBehavior=”Stop”)。设置好之后该矩形调用BeginAnimation方法开始实现动画,BeginAnimation制定需要应用动画的属性和创建的DoubleAnimation。

案例:

效果图:

XAML:

<Window x:Class="Wpf基于属性的动画.MainWindow"
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"
xmlns:local="clr-namespace:Wpf基于属性的动画"
mc:Ignorable="d"
Title="MainWindow" Height="" Width="">
<Grid >
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Ellipse Name="ellipse" Height="" Width="" Fill="Aquamarine"/>
<Button Grid.Row="" Content="开启动画" Height="" Width="" Click="ButtonBase_OnClick" />
</Grid>
</Window>

C#:

using System;
using System.Windows;
using System.Windows.Media.Animation;
using System.Windows.Shapes; namespace Wpf基于属性的动画
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
} private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
DoubleAnimation doubleAnimation=new DoubleAnimation();
doubleAnimation.From = ;
doubleAnimation.To = ;
doubleAnimation.Duration = TimeSpan.FromMilliseconds();
doubleAnimation.FillBehavior = FillBehavior.Stop;
ellipse.BeginAnimation(Ellipse.WidthProperty,doubleAnimation);
DoubleAnimation doubleAnimation1 = new DoubleAnimation();
doubleAnimation1.From = ;
doubleAnimation1.To = ;
doubleAnimation1.Duration = TimeSpan.FromMilliseconds();
doubleAnimation1.FillBehavior = FillBehavior.Stop;
ellipse.BeginAnimation(Ellipse.HeightProperty, doubleAnimation);
}
}
}

WPF实现动画的几种方式及其小案例的更多相关文章

  1. Spring框架访问数据库的两种方式的小案例

    1.1 以Xml的方式访问数据库的案例 要以xml的方式访问数据库需要用到JdbcTemplate ,因为 JdbcTemplate(jdbc的模板对象)在Spring 中提供了一个可以操作数据库的对 ...

  2. 加载gif动画的三种方式

    GifView.h/** * 调用结束就开始播放动画,如果需要用户指定何时播放的话,只需要把timer的开始放到合适的位置.通过对CFDictonaryRaf 也就是gifProperties的改变, ...

  3. WPF实现导航的几种方式

    下面是展示的是几种导航方式: 我们来具体看下xaml文件 <Page x:Class="WPF实现Navigation.Page1" xmlns="http://s ...

  4. 实现activity跳转动画的若干种方式

    第一种: (使用overridePendingTransition方法实现Activity跳转动画) 在Activity中代码如下 /** * 点击按钮实现跳转逻辑 */ button1.setOnC ...

  5. Android系统移植与调试之------->如何修改开机动画的两种方式剖析

    首先,我们先来分析一下源码: frameworks/base/cmds/bootanimation/BootAnimation.cpp 首先看一下定义的常量: BootAnimation::ready ...

  6. WPF设置样式的几种方式

    第一种方式是直接使用Setter来进行,可以对Background等进行设置. <Window.Resources> <Style TargetType="Button&q ...

  7. 前端制作动画的几种方式(css3,js)

    制作动态的网页是是前端工程师必备的技能,很好的实现动画能够极大的提高用户体验,增强交互效果,那么动画有多少实现方式,一直对此有选择恐惧症的我就总结一下,以便在开发的时候选择最好的实现方式. 1.css ...

  8. IOS 动画的两种方式

    方式一: [UIView animateWithDuration:1 animations:^{ //动画的内容 CGRect frame = CGRectMake([UIParam widthScr ...

  9. Cocos2d-x3.3beta0创建动画的3种方式

    1.单独载入精灵对象 渲染效率低,浪费资源,不推荐用该方法.代码例如以下:注:代码仅仅需贴到HelloWorldScene.cpp中就可以. //First,单独渲染每个精灵帧 auto sprite ...

随机推荐

  1. Mac下su命令提示su:Sorry的解决办法

    用 sudo su - 输入密码,获得root权限

  2. 类似gitlab代码提交的热力图怎么做?

    本文由  网易云发布. 作者:张淞(本篇文章仅限知乎内部分享,如需转载,请取得作者同意授权.) 昨夜,网易有数产品经理路过开发的显示屏前见到了类型这样的一张图: 于是想到有数能不能做出这样的图来?作为 ...

  3. Chrome71版本使用screenfull.js全屏功能时报参数错误

    在生产环境长期使用的一个“全屏”功能突然失效了,查看Console 如下报错: Failed to execute 'requestFullscreen' on 'Element': paramete ...

  4. FFMPEG 的学习

    https://blog.csdn.net/leixiaohua1020/article/details/15811977/

  5. qi zi

    #include<stdio.h> ]; ][]; int N; typedef struct node{ int x; }node; node dui[]; int se(int a) ...

  6. [bzoj4712]洪水 线段树+树链剖分维护动态dp+二分

    Description 小A走到一个山脚下,准备给自己造一个小屋.这时候,小A的朋友(op,又叫管理员)打开了创造模式,然后飞到山顶放了格水.于是小A面前出现了一个瀑布.作为平民的小A只好老实巴交地爬 ...

  7. php 对比两个数组中的值是否相等

    $a = ['1','2','4','3'];//提交答案 $b = ['2','1','3'];//正确答案 $state = $this->diffArray($b, $a); echo ' ...

  8. mysql分表分库选型

    三个方向: 一.应用中自己实现,可直连数据库,自己实现因目前使用的Mybatis框架可以使用两种做法: 1.在SQL中直接分表逻辑,我查了一下代码中的sql,发现join的千姿百态,不大动这些sql这 ...

  9. C语言多线程编程一

    1. Windows下同时打开多个对话框: #include <Windows.h> #include <process.h> //创建线程 void runmsg(void ...

  10. POJ 2196

    #include <iostream> using namespace std; int sum_10; int sum_12; int sum_16; int fun_10(int nu ...