Silverlight动画学习笔记(三):缓动函数
(一)定义:
缓动函数:可以将自定义算术公式应用于动画
(二)为什么要用缓动函数:
您可能希望某一对象逼真地弹回或其行为像弹簧一样。您可以使用关键帧动画甚至 From/To/By 动画来大致模拟这些效果,但可能需要执行大量的工作,并且与使用算术公式相比动画的精确性将降低。
(三)实例讲解:
<UserControl x:Class="AnimationStudy.EasingFunctionAnimation"
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="" d:DesignWidth=""> <StackPanel x:Name="LayoutRoot" Background="White">
<StackPanel.Resources>
<!--
缓动函数:
()EasingFunction属性:指定要应用于该动画的缓动函数
()EasingMode属性:更改缓动函数的行为方式(更改动画的内插方式:EaseIn、EaseOut、EaseInOut )
() EasingMode的三种内插方式:
EaseIn :内插遵循与缓动函数相关联的算术公式。
EaseOut :内插遵循 % 内插减去与缓动函数相关联的公式输出。
EaseInOut :内插将 EaseIn 用于动画的前半部分,将 EaseOut 用于动画的后半部分。
()缓动函数应用范围:
From/To/By 动画
关键帧动画
()常见的缓动函数:
BackEase :在某一动画开始沿指示的路径进行动画处理前稍稍收回该动画的移动。
BounceEase :创建弹回效果。
CircleEase :创建使用循环函数加速和/或减速的动画。
ElasticEase :创建表示弹簧在停止前来回振荡的动画。
SineEase :创建使用正弦公式加速和/或减速的动画。
ExponentialEase :创建使用指数公式加速和/或减速的动画。
【 PowerEase类动画】创建与使用 Power 属性的 CubicEase、QuadraticEase、QuarticEase 和 QuinticEase 的相同的行为
PowerEase :创建使用公式 f(t) = tp(其中,p 等于 Power 属性)加速和/或减速的动画。
CubicEase :创建使用公式 f(t) = t3 加速和/或减速的动画。
QuadraticEase :创建使用公式 f(t) = t2 加速和/或减速的动画。
QuarticEase :创建使用公式 f(t) = t4 加速和/或减速的动画。
QuinticEase :创建使用公式 f(t) = t5 加速和/或减速的动画。
()通过从 EasingFunctionBase 继承来创建自己的自定义缓动函数
覆盖 EaseInCore 方法,针对缓动函数的行为方式添加您自己的数学逻辑,如下代码:
namespace CustomEasingFunction
{
public class CustomSeventhPowerEasingFunction : EasingFunctionBase
{
public CustomSeventhPowerEasingFunction() : base()
{
}
protected override double EaseInCore(double normalizedTime)
{
return Math.Pow(normalizedTime, );
}
}
}
-->
<Storyboard x:Name="myStoryboard">
<DoubleAnimationUsingKeyFrames
Storyboard.TargetProperty="Height"
Storyboard.TargetName="myRectangle">
<EasingDoubleKeyFrame Value="" KeyTime="00:00:02">
<EasingDoubleKeyFrame.EasingFunction>
<CubicEase EasingMode="EaseOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame> <EasingDoubleKeyFrame Value="" KeyTime="00:00:06">
<EasingDoubleKeyFrame.EasingFunction>
<BounceEase Bounces="" EasingMode="EaseOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</StackPanel.Resources>
<Rectangle x:Name="myRectangle" MouseLeftButtonDown="Mouse_Clicked"
Fill="Blue" Width="" Height="" />
</StackPanel>
</UserControl>
文章转自:http://www.cnblogs.com/Joetao/articles/2054250.html
Silverlight动画学习笔记(三):缓动函数的更多相关文章
- WPF中的动画——(四)缓动函数
缓动函数可以通过一系列公式模拟一些物理效果,如实地弹跳或其行为如同在弹簧上一样.它们一般应用在From/To/By动画上,可以使得其动画更加平滑. var widthAnimation = new D ...
- MySQL学习笔记(三):常用函数
一:字符串函数 需要注意的几个细节: 1.cancat中有一个字符串为null,则结果为null. 2.left(str,x) 和 right(str,x)中x为null,则不返回任何字符串,不是nu ...
- 支持xcode6的缓动函数Easing以及使用示例
支持xcode6的缓动函数Easing以及使用示例 用xcode6新建工程后,直接导致不支持之前的Easing缓动函数的代码,经过修改后就可以正常使用了,虽然比不上POP高大上的动画,但用缓动函数的动 ...
- JS动画之缓动函数分析及动画库
上一篇讲了JS动画定时器相关知识,这一篇介绍下缓动函数及流行的动画库. 熟悉的图 实际使用 jquery animate()+jquery.easing插件的使用: $(selector).anima ...
- iOS基本动画/关键帧动画/利用缓动函数实现物理动画效果
先说下基本动画部分 基本动画部分比较简单, 但能实现的动画效果也很局限 使用方法大致为: #1. 创建原始UI或者画面 #2. 创建CABasicAnimation实例, 并设置keypart/dur ...
- Typescript 学习笔记三:函数
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- ES6学习笔记<三> 生成器函数与yield
为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...
- MYSQL学习笔记三:日期和时间函数
MYSQL学习笔记三:日期和时间函数 1. 获取当前日期的函数和获取当前时间的函数 /*获取当前日期的函数和获取当前时间的函数.将日期以'YYYY-MM-DD'或者'YYYYMMDD'格式返回 */ ...
- Android动画学习笔记-Android Animation
Android动画学习笔记-Android Animation 3.0以前,android支持两种动画模式,tween animation,frame animation,在android3.0中 ...
随机推荐
- Python笔记(一)
我是一名211高校软件工程大三学生,由于前段时间一直在找实习公司.笔试面试了很多公司,虽然有一定的基础,但是还是被某些公司面试官像虐狗一样的虐了.最后找到了一个口碑比较好的外企,主攻信息安全方面.这段 ...
- 1.4.2 solr字段类型--(1.4.2.4)使用Dates(日期)
1.4.2 solr字段类型 (1.4.2.1) 字段类型定义和字段类型属性. (1.4.2.2) solr附带的字段类型 (1.4.2.3) 使用货币和汇率 (1.4.2.4) 使用Dates(日期 ...
- double数值多时系统默认科学计数法解决方法
比如 Double d = new Double("1234567890.12"); System.out.println("d:="+d); java.tex ...
- iOS7.1 编译报错 解决方案 体会
iOS升级到 iOS 7.1 了 ,开发人员必须与时俱进.果断下载更新了xcode5.1版本 ,试运行了一下已上线的应用,哇 报错了!好头疼 贴下报错地方: 都是关于第三方类库报的错 比如parse. ...
- 阿里云ECS(linux)磁盘满触发的mysql的表异常修复案例
阿里云ECS(linux)磁盘满触发的mysql的表异常修复案例 阿里云技术支持:完颜镇江 问题现象: 磁盘空间满了,第一想到的就是删除无用的服务日志或者升级数据盘. 通常是使用du –sh去分析目录 ...
- 【开源项目8】Android开源项目分类汇总【畜生级别】
欢迎大家推荐好的Android开源项目,可直接Commit或在 收集&提交页 中告诉我,欢迎Star.Fork :) 微博:Trinea 主页:www.trinea.cn 邮箱:t ...
- poj 2498 动态规划
思路:简单动态规划 #include<map> #include<set> #include<cmath> #include<queue> #inclu ...
- 公用的stringUtil工具
(function(){ var ISCHINESE = /[\u4e00-\u9fa5]/; var getData = function( value , maxLenth , isStrick ...
- Table of Contents - Quartz Scheduler
Getting Started Hello World Integration with Spring Quartz Scheduler Developer Guide Usage of JobDat ...
- css改变谷歌浏览器的滚动条样式
详细内容请点击 /*---滚动条默认显示样式--*/ ::-webkit-scrollbar-thumb{ height:50px; outline-offset:-2px; ...