View动画

来源:互联网 发布:一本书学会做数据分析 编辑:程序博客网 时间:2024/06/12 22:04

View动画

标签(空格分隔): Android


View Animation

View动画在Android里实际就是补间动画,包括位移,大小,旋转和透明度的变化

虽然可以通过XML和Java代码2种方式定义View动画,不过建议使用XML来减少耦合。

xml文件位于res/anim/ 目录
常用的标签有:
, , , ,
其中是可以包含其他标签和其他。

xml定义的动画动作默认是同时进行的,如果想要他们顺序执行,可以在希望延时执行的动作中标明:

android:startOffset="700"

这样就会延时700ms进行。
需要注意的是:但是这个延时只是针对动画的运行,如果设定了android:fromXScale,android:fromAlpha这种属性,一样会第一时间改变的。

Interpolator

view动画同样可以指定插值器,实现诸如加速,或者减速效果的动画进行速度。

xml定义的view动画的加载是使用AnimationUtils工具类,通过AnimationUtils.loadAnimation()加载xml文件,并返回Animation 对象,最后在需要使用的View对象上调用

sampleView.startAnimation(sampleAnimation);

即可.
还可以通过

//设定动画开始时间时,不能使用System.currentTimeMillis()sampleAnimation.setStartTime(AnimationUtils.currentAnimationTimeMillis()+1000);sampleView.setAnimation(sampleAnimation).

的方式来开始动画。

View动画示例:

XML:

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android" >    <alpha        android:duration="400"        android:fromAlpha="1"        android:toAlpha="0.5" />    <set android:interpolator="@android:anim/accelerate_decelerate_interpolator" >        <alpha            android:duration="400"            android:fromAlpha="0.5"            android:startOffset="3000"            android:toAlpha="1" />        <scale            android:duration="400"            android:fillBefore="false"            android:fromXScale="1.4"            android:fromYScale="0.6"            android:pivotX="50%"            android:pivotY="50%"            android:startOffset="3000"            android:toXScale="0.0"            android:toYScale="0.0" />        <rotate            android:duration="400"            android:fromDegrees="0"            android:pivotX="50%"            android:pivotY="50%"            android:startOffset="3000"            android:toDegrees="-45"            android:toYScale="0.0" />    </set></set>

Code:

        Animation anim=AnimationUtils.loadAnimation(this,R.anim.animtest);        tv.startAnimation(anim);

XML写的动画也有它的局限性,当动画中的参数需要随时调整时,就需要在代码中实现动画类,然后执行动画。
动画类Animation是基类,子类包括:
AlphaAnimation, AnimationSet, RotateAnimation, ScaleAnimation, TranslateAnimation
实际上是和XML文件中的标签是一致的。
效果:
这里写图片描述


下面举个例子通过java代码实现每经过一段时间,随机在屏幕产生一个位置,然后TextView对象移动到该位置上的效果。

代码实现的View动画:

为了每隔一段时间产生一次动画,需要借用handler和一个新的线程来计时更新UI。

XML代码:

<?xml version="1.0" encoding="utf-8"?><AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TextView        android:id="@+id/textView1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_x="0dp"        android:layout_y="0dp"        android:text="CatchMe" /></AbsoluteLayout>

Java:

package com.example.scrolltest;import java.util.Timer;import java.util.TimerTask;import android.app.Activity;import android.os.Bundle;import android.os.Handler;import android.os.Message;import android.util.Log;import android.view.animation.Animation;import android.view.animation.TranslateAnimation;import android.widget.TextView;public class RadomView extends Activity {    private String LogTag = "RadomView";    private TextView mTextView;    float curX, curY;    @Override    protected void onCreate(Bundle savedInstanceState) {        // TODO Auto-generated method stub        super.onCreate(savedInstanceState);        setContentView(R.layout.radomviewlayout);        mTextView = (TextView) findViewById(R.id.textView1);        final Handler mHandler = new Handler() {            @Override            public void handleMessage(Message msg) {                if (msg.what == 0X01) {                    float nextX = (float) Math.random();// *getWindowManager().getDefaultDisplay().getWidth()*0.8f;                    float nextY = (float) Math.random();// *getWindowManager().getDefaultDisplay().getHeight()*0.8f;                    Log.e(LogTag, "X=" + nextX + "; Y=" + nextY);                    //移动的是相对位置                    TranslateAnimation anim = new TranslateAnimation(                            Animation.RELATIVE_TO_PARENT, curX,                            Animation.RELATIVE_TO_PARENT, nextX,                            Animation.RELATIVE_TO_PARENT, curY,                            Animation.RELATIVE_TO_PARENT, nextY);                    curX = nextX;                    curY = nextY;                    anim.setDuration(2000);                    mTextView.startAnimation(anim);                }            }        };        new Timer().schedule(new TimerTask() {            @Override            public void run() {                // TODO Auto-generated method stub                mHandler.sendEmptyMessage(0x01);            }        }, 0, 2000);    }}

效果:
这里写图片描述

自定义动画

虽然View提供了旋转,平移,透明度,缩放四种预设的动画,我们可以使用其中一种动画,或者多种动画的组合,但如果需要某种独特的动画形式,或者需要对复杂的动画进行封装,则可以通过自定义动画来实现。
就像上面四种预设动画一样,自定义的动画需要继承Animation基类。并重写applyTransformation(float interpolatedTime, Transformation t) 函数,
在该函数中interpolatedTime是从0-1变化的浮点数,可以理解为时间轴。
Transformation则是图形的变化,其中封装了一个Matrix对象。代表了相对原图像目前的变化。
我们要做的就是根据不同的interpolatedTime,把Transformation t中的Matrix进行改变,从而得到不同的动画效果。
例如我们想要实现一个闪烁的效果,设计一个闪烁动画,使用的时候,可以让Textview或者ImageView等对象按照动画效果进行闪烁。

自定义动画的实现

自定义动画代码:

package com.example.scrolltest;import android.graphics.Camera;import android.graphics.Matrix;import android.util.Log;import android.view.animation.Animation;import android.view.animation.Transformation;public class blinkAnimation extends Animation {    private float lightduration;    private float darkduration;    private float darkPercent;    public blinkAnimation(float lightduration, float darkduration) {        this.lightduration = lightduration;        this.darkduration = darkduration;        this.darkPercent = darkduration / (lightduration + darkduration);        setDuration((long) (lightduration + darkduration));        setRepeatCount(INFINITE);        setRepeatMode(RESTART);        Log.e("whatever", "darkPercent=" + darkPercent);    }    @Override    protected void applyTransformation(float interpolatedTime, Transformation t) {        t.setAlpha(interpolatedTime > this.darkPercent ? 1 : 0);    }}

使用:

        blinkAnimation mblink=new blinkAnimation(1000, 1000);        tv.startAnimation(mblink);

效果:

这里写图片描述

0 0
原创粉丝点击