http://blog.csdn.net/sun_star1chen/article/details/12843741
首先要了解为什么需要插值器,因为在补间动画中,我们一般只定义关键帧(首帧或尾帧),然后由系统自动生成中间帧,生成中间帧的这个过程可以成为“插值”。插值器的作用是告诉动画某个属性(比如颜色的渐变)如何随时间变化 。下面是几种常见的插值器:
android 系统支持AccelerateDecelerateInterpolator 、 AccelerateInterpolator 、 AnticipateInterpolator 、AnticipateOverShootInterpolator 、 BounceInterpolator 、 CycleInterpolator 、DecelerateInerpolator 、 LinearInterpolator 、 OverShootInterpolator 共 9 种插值器(若这些插值器不能满足需求,则可以自定义插值器)。
下面写个示例看看如何在代码中定义插值器。
1、 创建好工程后,在res/layout目录下创建文件 interpolator_layout.xml , 文件内容如下
[html] view plain copy <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/acc_dec_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/acc_dec_str" /> <Button android:id="@+id/acc_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/acc_str" /> <Button android:id="@+id/anti_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/anti_str" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/anti_over_shoot_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/anti_over_shoot_str" /> <Button android:id="@+id/bounce_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/bounce_str" /> <Button android:id="@+id/cycle_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/cycle_str" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <Button android:id="@+id/dec_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/dec_str" /> <Button android:id="@+id/linear_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/linear_str" /> <Button android:id="@+id/over_shoot_btn" style="?android:attr/buttonStyleSmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/over_shoot_str" /> </LinearLayout> <ImageView android:id="@+id/anim_show_img" android:layout_width="50dp" android:layout_height="wrap_content" android:src="@drawable/ting_frame_3" android:adjustViewBounds="true" /> </LinearLayout> 2、准备好我们的插值器,在包下面创建文件 nterpolatorUtils.java (定义了各种插值器的类) , 内容如下
[java] view plain copy import android.view.animation.AccelerateDecelerateInterpolator; import android.view.animation.AccelerateInterpolator; import android.view.animation.AnticipateInterpolator; import android.view.animation.AnticipateOvershootInterpolator; import android.view.animation.BounceInterpolator; import android.view.animation.CycleInterpolator; import android.view.animation.DecelerateInterpolator; import android.view.animation.Interpolator; import android.view.animation.LinearInterpolator; import android.view.animation.OvershootInterpolator; public class InterpolatorUtils { public final static Interpolator ACC_DEC_INERPOLATOR = new AccelerateDecelerateInterpolator(); public final static Interpolator ACC_INTERPOLATOR = new AccelerateInterpolator( 10.0f); public final static Interpolator ANTI_INTERPOLATOR = new AnticipateInterpolator( 10.0f); public final static Interpolator ANTI_OVER_SHOOT_INTERPOLATOR = new AnticipateOvershootInterpolator( 10.0f); public final static Interpolator BOUNCE_INTEPOLATOR = new BounceInterpolator(); public final static Interpolator CYCLE_INTERPOLATOR = new CycleInterpolator( 5); public final static Interpolator DEC_INTERPOLATOR = new DecelerateInterpolator( 10.0f); public final static Interpolator LINEAR_INTERPOLATOR = new LinearInterpolator(); public final static Interpolator OVER_SHOOT_INTERPOLATOR = new OvershootInterpolator( 10.0f); } 3、创建显示动画的activity —— InterpolatorActivity.java , 内容如下:
[java] view plain copy import com.zt.xy.animation.utils.InterpolatorUtils; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.Button; import android.widget.ImageView; public class InterpolatorActivity extends Activity implements OnClickListener { private Button mAccDec; private Button mAcc; private Button mAnti; private Button mAtiOverShoot; private Button mBounce; private Button mCycle; private Button mDec; private Button mLinear; private Button mOverShoot; Animation mTransAnim; private ImageView mInterpolatorImg; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.interpolator_layout); init(); mTransAnim = AnimationUtils.loadAnimation(this, R.anim.translate_anim); } private void init() { mAccDec = (Button) findViewById(R.id.acc_dec_btn); mAccDec.setOnClickListener(this); mAcc = (Button) findViewById(R.id.acc_btn); mAcc.setOnClickListener(this); mAnti = (Button) findViewById(R.id.anti_btn); mAnti.setOnClickListener(this); mAtiOverShoot = (Button) findViewById(R.id.anti_over_shoot_btn); mAtiOverShoot.setOnClickListener(this); mBounce = (Button) findViewById(R.id.bounce_btn); mBounce.setOnClickListener(this); mCycle = (Button) findViewById(R.id.cycle_btn); mCycle.setOnClickListener(this); mDec = (Button) findViewById(R.id.dec_btn); mDec.setOnClickListener(this); mLinear = (Button) findViewById(R.id.linear_btn); mLinear.setOnClickListener(this); mOverShoot = (Button) findViewById(R.id.over_shoot_btn); mOverShoot.setOnClickListener(this); mInterpolatorImg = (ImageView) findViewById(R.id.anim_show_img); } @Override protected void onPause() { super.onPause(); } @Override protected void onResume() { super.onResume(); } public void onClick(View v) { switch (v.getId()) { case R.id.acc_dec_btn: mTransAnim.setInterpolator(InterpolatorUtils.ACC_DEC_INERPOLATOR); break; case R.id.acc_btn: mTransAnim.setInterpolator(InterpolatorUtils.ACC_INTERPOLATOR); break; case R.id.anti_btn: mTransAnim.setInterpolator(InterpolatorUtils.ANTI_INTERPOLATOR); break; case R.id.anti_over_shoot_btn: mTransAnim .setInterpolator(InterpolatorUtils.ANTI_OVER_SHOOT_INTERPOLATOR); break; case R.id.bounce_btn: mTransAnim.setInterpolator(InterpolatorUtils.BOUNCE_INTEPOLATOR); break; case R.id.cycle_btn: mTransAnim.setInterpolator(InterpolatorUtils.CYCLE_INTERPOLATOR); break; case R.id.dec_btn: mTransAnim.setInterpolator(InterpolatorUtils.DEC_INTERPOLATOR); break; case R.id.linear_btn: mTransAnim.setInterpolator(InterpolatorUtils.LINEAR_INTERPOLATOR); break; case R.id.over_shoot_btn: mTransAnim .setInterpolator(InterpolatorUtils.OVER_SHOOT_INTERPOLATOR); break; } cancleAnim(); startAnim(); } private void cancleAnim() { if (mTransAnim != null) { mTransAnim.cancel(); } } private void startAnim() { if (mTransAnim != null) { mInterpolatorImg.startAnimation(mTransAnim); } } } 当然在能运行程序前先准备好一张名为anim_show_img的图片放到drawable文件夹中。
开始的时候仅仅是显示一张图片,点击不同按钮则添加不同的插值器到TranslateAnimation中,等等,貌似我们忘记定义translate_anim 动画文件了——亲,点我探探translate_anim.xml究竟。
在layout文件中使用了很多字符串,下面的字串做个参考(具体字串,朋友们自由发挥)
[html] view plain copy <string name="acc_dec_str">accelerateDecelerate</string> <string name="acc_str">accelerate</string> <string name="anti_str">anticipate</string> <string name="anti_over_shoot_str">anticipateOverShoot</string> <string name="bounce_str">bounce</string> <string name="cycle_str">cycle</string> <string name="dec_str">decelerate</string> <string name="linear_str">linear</string> <string name="over_shoot_str">overShoot</string> ok,大功告成!有问题请留言,谢谢!
