移动网站开发工具,网站权限怎么设置方法,西安网站制作网站,网络空间安全专业大学排名本篇主要讲Animation 和 Property Animation的使用#xff0c;最后会讲QQ管家桌面火箭作为例子#xff1a; 在Android中开发动效有两套框架可以使用#xff0c;分别为 Animation 和 Property Animation#xff1b; 相对来说#xff0c;Animator比Animation要强大太多最后会讲QQ管家桌面火箭作为例子 在Android中开发动效有两套框架可以使用分别为 Animation 和 Property Animation 相对来说Animator比Animation要强大太多两者之间的主要区别在于 区别一需要的Anroid API level不一样 Property Animation需要Android API level 11的支持,当然可以使用nineoldandroids.jar进行兼容而View Animation则是最原始的版本。区别二适用范围不一样 Property Animation适用于所有的Object对象而View Animation则只能应用于View对象。区别三实际改变不一样 Animation改变的是view的绘制位置而非实际属性 Property Animation改变的是view的实际属性 如用两套框架分别对一个button做位移动画用animation处理之后的点击响应会在原处而用Property Animation处理后的点击响应会在最终位置处 一Animation 总的来说可以分为Tween Animation补间动画 和Frame Animation帧动画 帧动画Frame Animation 帧动画其实就是按照一定的时间间隔进行快速的图片切换达到视觉上的动画效果这种动画相对来说缺点较多比如 1.根据动画的复杂度需要切多张图这样就不可避免的增大了包大小 2.由于是多张图运行时需要加载到内存那么又会增大运行时的内存大小 所以如果在动效上有别的方案选择个人不太建议使用帧动画的实现方式当然有时候不得不用这时我们可以尽可能的在效果连贯的基础上减少图片张数 帧动画的实现也相对简单就举一个例子但是例子之中有几条帧动画的使用规则是我以前在使用的过程中遇到问题后总结出来的 1.在drawable目录下xml中定义如下文件节点为animation-listoneshot代表是否执行一次duration代表每张图对应展示时间 animation-list xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:oneshottrueitem android:drawabledrawable/rocket_thrust1 android:duration200 /item android:drawabledrawable/rocket_thrust2 android:duration200 /item android:drawabledrawable/rocket_thrust3 android:duration200 / /animation-list 2.然后将该drawable设置给对应的imageview 3.在activity中 animDrawable (AnimationDrawable) imageView.getBackground(); 4.在onWindowFocusChanged()中调用 animDrawable.stop(); animDrawable.start(); 如果不这么做那么在性能比较差的机器上很可能就会出现没有播放的情况因为只显示出了第一帧问题在于动画没有和view完成关联所以不要在onCreate中去调用启动而需要在onWindowFocusChanged中进行调用 在极特殊的情况下如果还无法播放则可以mHandler.postDelay 200 毫秒作为终极杀手锏当然只要按照我上面的步骤应该不会出现问题 好了帧动画最大的问题是按照上面的步骤开发接下来看补间动画Tween Animation 补间动画Tween Animation Animation下有五个子类AlphaAnimation(渐变),RotateAnimation(旋转),ScaleAnimation(缩放),TranslateAnimation(位移) 在实现原理上除了AlphaAnimation是动态的去改变view的alpha值其他三个都是去改变里面的Matrix矩阵后面会专门讲 在Animation框架里主要的类主要有Animation和Transformation、Interpolator(插值器后面也会专门讲) Transformation里面主要对alpha和matrix进行了封装而改变view的透明度就是改变alpha移动、旋转、缩放甚至错切则都是改变matrix Animation里有一个重要的方法applyTransformation实现自定义Animation也主要是实现这个方法 以AlphaAnimation为例 /*** Changes the alpha property of the supplied {link Transformation}*/Overrideprotected void applyTransformation(float interpolatedTime, Transformation t) {final float alpha mFromAlpha;t.setAlpha(alpha ((mToAlpha - alpha) * interpolatedTime));} 渐变动画只需要在里面根据当前的interpolatedTime(已经由插值器转换后的值)动态计算出对应的alpha重新设置到Transformation中即可 Animation的使用也相对比较简单可以通过xml配置也可以通过代码生成 1.xml配置 ?xml version1.0 encodingutf-8? set xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:shareInterpolatorfalse scale!-- 单次运行时间 --android:duration500!-- 运行完成后是否保持结束时的状态 --android:fillAftertrue!-- 运行完成后是否回到开始时的状态 --android:fillBeforefalse!-- 初始时大小1代表原大小0代表无 --android:fromXScale1android:fromYScale1!-- 使用的插值器控制运行过程中的速率 --android:interpolatorandroid:anim/accelerate_interpolator!-- 相对中心点50%代表自身中心50%p代表相对父view的中心 --android:pivotX50%android:pivotY50%!-- 重复的次数infinite代表永久循环 --android:repeatCountinfinite!-- 重复的模式 restart代表重新开始reverse代表反转--android:repeatModerestart!-- 延迟多久后开始 --android:startOffset100!-- 要到达的缩放比例 --android:toXScale0android:toYScale0 //scaletranslateandroid:duration550!-- 相对当前位置的像素距离 --android:fromYDelta300android:interpolatorandroid:anim/accelerate_interpolatorandroid:toYDelta0 /alphaandroid:duration550android:fromAlpha0android:toAlpha1 //set 当要多个效果同时使用时则如上使用set标签进行组合在代码中使用如下 Animation animation AnimationUtils.loadAnimation(getApplicationContext(), R.anim.app_clean_animation); view.startAnimation(animation); 2.纯代码生成// false代表里面的子animation不共用一个插值器AnimationSet animationSet new AnimationSet(false);// 从alpha 完全透明变为完全不透明AlphaAnimation alphaAnimation new AlphaAnimation(0, 1);alphaAnimation.setDuration(500);alphaAnimation.setFillAfter(true);// 运行完成后是否回到开始时的状态alphaAnimation.setFillBefore(false);alphaAnimation.setInterpolator(new AccelerateInterpolator());// 重复的次数infinite代表永久循环alphaAnimation.setRepeatCount(Animation.INFINITE);// 重复的模式 restart代表重新开始reverse代表反转alphaAnimation.setRepeatMode(Animation.RESTART);// 给动画设置对应的监听可以在动画开始、结束或重复执行时做对应操作alphaAnimation.setAnimationListener(new AnimationListener() {Overridepublic void onAnimationStart(Animation animation) {//开始时候回调}Overridepublic void onAnimationRepeat(Animation animation) {//重复执行时回调}Overridepublic void onAnimationEnd(Animation animation) {//一轮结束时回调}});RotateAnimation rotateAnimation new RotateAnimation(0, 360);rotateAnimation.setDuration(500);animationSet.addAnimation(alphaAnimation);animationSet.addAnimation(rotateAnimation);view.startAnimation(animationSet); 好了animation就讲到这里上面的注释应该比较详尽了主要是弄清楚其使用方式和使用场景 二Property Animation属性动画 属性动画它更改的是对象的实际属性在View AnimationTween Animation中其改变的是View的绘制效果真正的View的属性保持不变比如无论你在对话中如何缩放Button的大小Button的有效点击区域还是没有应用动画时的区域其位置与大小都不变。而在Property Animation中改变的是对象的实际属性如Button的缩放Button的位置与大小属性值都改变了。而且Property Animation不止可以应用于View还可以应用于任何对象。Property Animation只是表示一个值在一段时间内的改变当值改变时要做什么事情完全是你自己决定的。 在Property Animation中可以对动画应用以下属性 1.TimeInterpolator(插值器和低版本的Interpolator一样)属性值的计算方式如先快后慢 2.TypeEvaluator根据属性的开始、结束值与TimeInterpolator计算出的因子计算出当前时间的属性值 3.Repeat Count and behavoir重复次数与方式如播放3次、5次、无限循环可以此动画一直重复或播放完时再反向播放 4.Animation sets动画集合即可以同时对一个对象应用几个动画这些动画可以同时播放也可以对不同动画设置不同开始偏移 5.Frame refreash delay多少时间刷新一次即每隔多少时间计算一次属性值默认为10ms最终刷新时间还受系统进程调度与硬件的影响 上面都是些概念但这些东西不必刻意去记或去理解插值器这样的比较生涩的概念我们只需要使用他最实用的部分并熟悉动画的实现套路 所以对于属性动画主要带大家熟悉两个类ValueAnimator和ObjectAnimator,通过这两个类我们平常遇到的动效大部分都能够加以解决 1.ValueAnimator ValueAnimator包含了 Property Animation 动画的所有核心功能如动画时间开始、结束属性值相应时间属性值计算方法等。 在我看来使用 ValueAnimator 只是为我们创建了一个过程我们可以用ValueAnimator.ofXXX()进行创建然后通过各种setXXX()给其设定过程的时间速率变化效果等然后通过addUpdateListener()中去拿这个过程中回调回来的中间值然后使用这些中间值改变view的属性形成动态效果 上面这句话通过代码表现如下 比如我们使用 ValueAnimator 在2S内将view横向拉长为2倍纵向压缩为0 // 在2S内将view横向拉长为2倍纵向压缩为0// 创建01的一个过程,任何复杂的过程都可以采用归一化然后在addUpdateListener回调里去做自己想要的变化ValueAnimator valueAnimator ValueAnimator.ofFloat(0, 1);// 设置过程的时间为2SvalueAnimator.setDuration(SCALE_ANIM_TIME);// 设置这个过程是速度不断变快的valueAnimator.setInterpolator(new AccelerateInterpolator());// 这个过程中不断执行的回调valueAnimator.addUpdateListener(new AnimatorUpdateListener() {Overridepublic void onAnimationUpdate(ValueAnimator animation) {// 不断回调的在0-1这个范围内经过插值器插值之后的返回值float value (Float) animation.getAnimatedValue();// ViewHelper可直接用于修改view属性// 将宽在2S内放大一倍ViewHelper.setScaleX(mTestImage, 1 value);// 将高在2S内压缩为0ViewHelper.setScaleY(mTestImage, 1 - value);}});// AnimatorListenerAdapter是AnimatorListener的空实现根据需要覆盖的方法自行选择valueAnimator.addListener(new AnimatorListenerAdapter() {Overridepublic void onAnimationStart(Animator animation) {super.onAnimationStart(animation);Toast.makeText(getApplicationContext(), onAnimationStart, Toast.LENGTH_SHORT).show();}Overridepublic void onAnimationEnd(Animator animation) {super.onAnimationEnd(animation);Toast.makeText(getApplicationContext(), onAnimationEnd, Toast.LENGTH_SHORT).show();}Overridepublic void onAnimationCancel(Animator animation) {super.onAnimationCancel(animation);}Overridepublic void onAnimationRepeat(Animator animation) {super.onAnimationRepeat(animation);}});valueAnimator.start(); 动画其实就是在一个时间段内不断去改变view的一些属性值这些属性值动态变化不断重绘的过程也就形成了我们所看到的动效 那么基于此我们可以知道这个过程都是通过时间来控制的时间走过的比例肯定在 0-1 之间如果我们直接用这个走过的时间比例去算当前属性值那么整个过程则是匀速线性的 那么在这个基础上我们想我们的过程是非线性的我们该怎么办呢那么只需要对这个时间比例加以加工具体请看下图 横轴就是经过的时间比例肯定是匀速的从0-1纵轴则是时间比例经过加工后的插值这个对应过程则是Interpolator插值器对应的过程 减速线则对应DecelerateInterpolater,因为它的斜率越来越平所以瞬时速度越来越小则形成了减速效果 其他的效果类似目前android里提供的插值器有如下一些 AccelerateInterpolator　　　　　 加速开始时慢中间加速DecelerateInterpolator　　　 　　 减速开始时快然后减速AccelerateDecelerateInterolator　 先加速后减速开始结束时慢中间加速AnticipateInterpolator　　　　　　 反向 先向相反方向改变一段再加速播放AnticipateOvershootInterpolator　 反向加回弹先向相反方向改变再加速播放会超出目的值然后缓慢移动至目的值BounceInterpolator　　　　　　　 跳跃快到目的值时值会跳跃如目的值100后面的值可能依次为8577708090100CycleIinterpolator　　　　　　　　 循环动画循环一定次数值的改变为一正弦函数Math.sin(2 * mCycles * Math.PI * input)LinearInterpolator　　　　　　　　 线性线性均匀改变OvershottInterpolator　　　　　　 回弹最后超出目的值然后缓慢改变到目的值TimeInterpolator　　　　　　　　 一个接口允许你自定义interpolator以上几个都是实现了这个接口 其实想实现对应的效果其实是找一条曲线对对应条件进行模拟然后根据曲线函数和X值得出每个时间点上对应的Y值插值这也就是插值器原理 2.ObjectAnimator 我们同样还是实现在2S内将view横向拉长为2倍纵向压缩为0 AnimatorSet animatorSet new AnimatorSet();// 将view在x方向上从原大小放大2倍ObjectAnimator scaleXAnimator ObjectAnimator.ofFloat(mTestImage, scaleX, 1, 2);scaleXAnimator.setDuration(SCALE_ANIM_TIME);// 将view在y方向上从原大小压缩为0ObjectAnimator scaleYAnimator ObjectAnimator.ofFloat(mTestImage, scaleY, 1, 0);scaleYAnimator.setDuration(SCALE_ANIM_TIME);// 设置加速模式animatorSet.setInterpolator(new AccelerateInterpolator());// 设置回调当然也可以设置在单独的animator上egscaleXAnimatoranimatorSet.addListener(new AnimatorListenerAdapter() {Overridepublic void onAnimationStart(Animator animation) {super.onAnimationStart(animation);Toast.makeText(getApplicationContext(), onAnimationStart, Toast.LENGTH_SHORT).show();}Overridepublic void onAnimationEnd(Animator animation) {super.onAnimationEnd(animation);Toast.makeText(getApplicationContext(), onAnimationEnd, Toast.LENGTH_SHORT).show();}Overridepublic void onAnimationCancel(Animator animation) {super.onAnimationCancel(animation);}Overridepublic void onAnimationRepeat(Animator animation) {super.onAnimationRepeat(animation);}});animatorSet.playTogether(scaleXAnimator, scaleYAnimator);animatorSet.start(); ObjectAnimator 是ValueAnimator 的子类可以直接改变Object的属性目前可供改变的属性主要有 translationX,translationY View相对于原始位置的偏移量rotation,rotationX,rotationY 旋转rotation用于2D旋转角度3D中用到后两个scaleX,scaleY 缩放比x,y View的最终坐标是View的lefttop位置加上translationXtranslationYalpha 透明度 关于Animator主要分享这两个类其他的比如 PropertyValuesHolder 大家可以自己去看 QQ管家桌面悬浮窗动画 分析 1.浮在桌面上的小圆泡可以盖在所有应用之上并且可以独立操作不影响其他操作需要使用WindowManager.addView 2.拖动的时候变成小火箭需要手势处理 onTouch 3.拖动到底部区域的时候震动需要对拖动到的位置做时候判断 4.放手时位置如果在底座区则发射火箭否则变成小圆回到边界 5.火箭喷火效果可以通过两张图帧动画实现也可以采用属性动画实现通过看QQ管家的图应该是采用的帧动画方式 6.底部的底座闪动效果也是三张图的帧动画 MainActivity package com.itheima.rocket;import java.nio.channels.AlreadyConnectedException;import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.app.Activity; import android.graphics.drawable.AnimationDrawable; import android.view.Menu; import android.view.MotionEvent; import android.view.View; import android.view.View.OnTouchListener; import android.view.animation.AlphaAnimation; import android.view.animation.Animation; import android.widget.ImageView; import android.widget.Toast;public class MainActivity extends Activity {private ImageView iv;private ImageView iv_bottom; private ImageView iv_top;private AnimationDrawable rocketAnimation;private Handler handler new Handler(){public void handleMessage(android.os.Message msg) {int position (Integer) msg.obj ;iv.layout(iv.getLeft(), position, iv.getRight(), positioniv.getHeight());if(position320){iv_top.setVisibility(View.VISIBLE);AlphaAnimation aa new AlphaAnimation(0.6f, 1.0f);aa.setDuration(300);iv_top.startAnimation(aa);}if(position20){AlphaAnimation aa new AlphaAnimation(1.0f, 0.0f);aa.setDuration(300);aa.setFillAfter(true);iv_top.startAnimation(aa);}};};Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);iv (ImageView) findViewById(R.id.iv);iv.setBackgroundResource(R.drawable.rocket);iv_top (ImageView) findViewById(R.id.iv_top);iv_bottom (ImageView) findViewById(R.id.iv_bottom);rocketAnimation (AnimationDrawable) iv.getBackground();rocketAnimation.start();iv.setOnTouchListener(new OnTouchListener() {int startX;int startY;Overridepublic boolean onTouch(View v, MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN:startX (int) event.getRawX();startY (int) event.getRawY();break;case MotionEvent.ACTION_MOVE:int newX (int) event.getRawX();int newY (int) event.getRawY();int dx newX - startX;int dy newY - startY;//wm.updateViewLayout();iv.layout(iv.getLeft()dx, iv.getTop()dy, iv.getRight()dx, iv.getBottom()dy);startX (int) event.getRawX();startY (int) event.getRawY();break;case MotionEvent.ACTION_UP:int top iv.getTop();int left iv.getLeft();int right iv.getRight();if(top300left100right220){Toast.makeText(getApplicationContext(), 发射火箭, 0).show();iv_bottom.setVisibility(View.VISIBLE);AlphaAnimation aa new AlphaAnimation(0.0f, 1.0f);aa.setDuration(500);aa.setRepeatCount(1);aa.setRepeatMode(Animation.REVERSE);aa.setFillAfter(true);iv_bottom.startAnimation(aa);sendRocket();}break;}return true;}});}protected void sendRocket() {new Thread(){public void run() {int start 380;for(int i 0 ;i11;i){try {Thread.sleep(50);} catch (InterruptedException e) {e.printStackTrace();}//更新一下uiMessage msg Message.obtain();msg.obj 380 - i*38;//计算出火箭的高度handler.sendMessage(msg);}};}.start();} } rocket.xml ?xml version1.0 encodingutf-8? animation-list xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:oneshotfalseitem android:drawabledrawable/desktop_rocket_launch_1 android:duration200 /item android:drawabledrawable/desktop_rocket_launch_2 android:duration200 / /animation-list 布局文件 RelativeLayout xmlns:androidhttp://schemas.android.com/apk/res/androidxmlns:toolshttp://schemas.android.com/toolsandroid:layout_widthmatch_parentandroid:layout_heightmatch_parenttools:context.MainActivity ImageViewandroid:idid/ivandroid:layout_width40dipandroid:layout_height73dip /ImageViewandroid:visibilityinvisibleandroid:idid/iv_bottomandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_alignParentBottomtrueandroid:srcdrawable/desktop_smoke_m /ImageViewandroid:visibilityinvisibleandroid:idid/iv_topandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_aboveid/iv_bottomandroid:srcdrawable/desktop_smoke_t //RelativeLayout 源代码下载 源代码 参考链接 Animation Property Animation 使用 - Ajian_studio - 博客频道 - CSDN.NET 【TweenedAnimation】四种动画效果参数详解(自测所得) - 邪天殇 - 博客园 完成