1.苦逼的需求又来了,需要实现一些动画效果,第一个想到的是播放gif图片,但是这样会占包的资源,并且清晰度不高,于是想着程序实现,自己用帧动画+缩放+移动+透明度 实现了一些想要的效果,这里跟大家分享一下
2.效果图如下:
3.帧动画实现代码
1).首先获取每帧显示的ImageView控件,然后把所有帧放到AnimationDrawable对象里面去,开启动画,通过handle延时2秒关闭动画
- ImageView ivFrame = (ImageView) findViewById(R.id.iv_frame);
- // 通过逐帧动画的资源文件获得AnimationDrawable示例
- final AnimationDrawable frameAnim = (AnimationDrawable) getResources().getDrawable(R.drawable.thank_you_boss_anim);
- ivFrame.setBackgroundDrawable(frameAnim);// 把AnimationDrawable设置为ImageView的背景
- frameAnim.start();
- new Handler().postDelayed(new Runnable() {
- @Override
- public void run(){
- if (frameAnim != null && frameAnim.isRunning()) {//2秒之后结束动画
- frameAnim.stop();
- }
- }
- },2000);
2).thank_you_boss_anim.xml 所有帧的布局文件 设置每一帧的图片,每帧时间
- <?xml version="1.0" encoding="utf-8"?>
- <animation-list xmlns:android="http://schemas.android.com/apk/res/android"
- android:oneshot="false" >
- <!-- 定义一个动画帧,Drawable为img0,持续时间300毫秒 -->
- <item android:drawable="@drawable/icon_think_boss_one" android:duration="100"/>
- <item android:drawable="@drawable/icon_think_boss_two" android:duration="100"/>
- <item android:drawable="@drawable/icon_think_boss_three" android:duration="100"/>
- <item android:drawable="@drawable/icon_think_boss_four" android:duration="300"/>
- </animation-list>
4.帧动画加上移动 放大 透明度效果
开启一个dialog,背景设置透明,得到帧动画跟文字图片显示ImageView,然后开启两个动画。
- /**
- * 谢谢土豪打赏
- */
- private void thankTuhaoReward(){
- View view=LayoutInflater.from(this).inflate(R.layout.activity_thank_tuhao_reward,null);
- final Dialog tyrantDialog = new Dialog(this,R.style.selectorDialog);
- tyrantDialog.findViewById(R.id.iv_frame);
- tyrantDialog.setContentView(view);
- tyrantDialog.setCanceledOnTouchOutside(true);
- ImageView ivFrame=(ImageView) tyrantDialog.findViewById(R.id.iv_frame);
- // 通过逐帧动画的资源文件获得AnimationDrawable示例
- final AnimationDrawable frameAnim=(AnimationDrawable) getResources().getDrawable(R.drawable.thank_you_tyrant_anim);
- ivFrame.setBackgroundDrawable(frameAnim);//把AnimationDrawable设置为ImageView的背景
- frameAnim.start();
- ImageView playThinkOneText=(ImageView) tyrantDialog.findViewById(R.id.play_think_one_text);
- Animation anim = AnimationUtils.loadAnimation(this,R.anim.translate_thank_you_tyrant);
- playThinkOneText.startAnimation(anim);
- anim.setFillAfter(true);
- tyrantDialog.show();
- view.setOnClickListener(new OnClickListener() {
- @Override
- public void onClick(View arg0) {
- stop(frameAnim);
- tyrantDialog.cancel();
- }
- });
- anim.setAnimationListener(new AnimationListener() {
- @Override
- public void onAnimationStart(Animation animation) {}
- @Override
- public void onAnimationRepeat(Animation animation) {}
- @Override
- public void onAnimationEnd(Animation animation){
- stop(frameAnim);
- tyrantDialog.cancel();
- }
- });
- }
- /**
- * 停止播放
- */
- protected void stop(AnimationDrawable frameAnim) {
- if (frameAnim != null && frameAnim.isRunning()) {
- frameAnim.stop();
- }
- }
帧动画的布局文件我就不贴出来了,贴一下移动,缩放,改变透明度的布局文件 translate_thank_you_tyrant.xml
- <?xml version="1.0" encoding="utf-8"?>
- <set xmlns:android="http://schemas.android.com/apk/res/android" >
- <translate
- android:duration="1000"
- android:fromXDelta="30"
- android:fromYDelta="30"
- android:toXDelta="30"
- android:toYDelta="-120" />
- <alpha
- android:duration="2000"
- android:fromAlpha="0.4"
- android:toAlpha="1.0" />
- <scale
- android:duration="2000"
- android:fillAfter="false"
- android:fromXScale="0.4"
- android:fromYScale="0.4"
- android:interpolator="@android:anim/accelerate_decelerate_interpolator"
- android:pivotX="50%"
- android:pivotY="50%"
- android:toXScale="1.0"
- android:toYScale="1.0" />
- <!--
- translate 位置转移动画效果
- 整型值:
- fromXDelta 属性为动画起始时 X坐标上的位置
- toXDelta 属性为动画结束时 X坐标上的位置
- fromYDelta 属性为动画起始时 Y坐标上的位置
- toYDelta 属性为动画结束时 Y坐标上的位置
- 注意:没有指定fromXType toXType fromYType toYType 时候,默认是以自己为相对参照物
- 长整型值:
- duration 属性为动画持续时间
- 说明: 时间以毫秒为单位
- -->
- </set>