Android 属性动画——自定义Drawable

最新推荐文章于 2022-05-20 15:25:35 发布
最新推荐文章于 2022-05-20 15:25:35 发布
阅读量991 收藏
点赞数 1
分类专栏： Android 文章标签： Android 属性动画
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/lantianZMH01/article/details/75152090
版权
本文介绍了如何创建一个名为MyAnimator的类，该类继承自ValueAnimator，并包含一个内部类MyDrawable，它继承自Drawable。在动画播放过程中，MyAnimator根据动画返回值更新MyDrawable，实现自定义的属性动画效果。只需将MyDrawable设为View背景并启动Animator。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

大致思路：自定义一个类继承Valueanimator可命名为MyAnimator。在该类中定义一个内部类继承Drawble，可以简单命名为MyDrawable。在MyAnimator开始播放时，根据动画返回值，不断触发MyDrawable更新。


代码片段：

Animator:

package com.example.com.myapplication;

import android.animation.ValueAnimator;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.ColorFilter;
import android.graphics.Matrix;
import android.graphics.PixelFormat;
import android.graphics.drawable.Drawable;
import android.support.annotation.NonNull;
import android.view.animation.Interpolator;
import android.view.animation.LinearInterpolator;

class WaveRobotAnimator extends AbsRobotAnimator implements ValueAnimator.AnimatorUpdateListener {

    private RobotDrawable mDrawable;


    WaveRobotAnimator(Context context,boolean left) {
        this.setDuration(1700);
        this.setIntValues(0, 1700);
        this.setInterpolator(new LinearInterpolator());
        mDrawable = new RobotDrawable(context,left);
        addUpdateListener(this);
    }

    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        mDrawable.update((int) (animation.getAnimatedValue()));
        mDrawable.invalidateSelf();
    }

    Drawable getDrawable() {
        return mDrawable;
    }

    private class RobotDrawable extends Drawable {

        private int mTime;
        private Body mBody;
        private EyeLeft mEyeLeft;
        private EyeRight mEyeRight;
        private HandLeft mHandLeft;
        private HandRight mHandRight;
        private Head mHead;
        private Mouth mMouth;
        private int mWidth;
        private int mHeight;
        private boolean mIsLeft;

        RobotDrawable(Context context, boolean left) {
            mIsLeft = left;
            mBody = new Body(context);
            mEyeLeft = new EyeLeft(context);
            mEyeRight = new EyeRight(context);
            mHandLeft = new HandLeft(context);
            mHandRight = new HandRight(context);
            mHead = new Head(context);
            mMouth = new Mouth(context);

        }


        @Override
        public void setAlpha(int alpha) {

        }

        private void update(int time) {
            mTime = time;
        }

        @Override
        public void draw(@NonNull Canvas canvas) {
            if (mWidth == 0 || mHeight == 0) {
                mWidth = canvas.getWidth();
                mHeight = canvas.getHeight();
            }
            canvas.save();
            if (mIsLeft) {
                canvas.scale(-1, 1, canvas.getWidth() / 2f, canvas.getHeight() / 2f);
            }
            canvas.translate(mWidth / 2f - 126 / 2, mHeight / 2f - 164 / 2);
            float bodyProgress = mBody.getProgress(mTime);
            canvas.rotate(bodyProgress, 63, 164);

            canvas.save();
            float headProgress = mHead.getProgress(mTime);
            canvas.rotate(headProgress, 63, 103);

            mHead.draw(canvas);
            mEyeLeft.draw(canvas, mTime);
            mEyeRight.draw(canvas, mTime);
            mMouth.draw(canvas);
            canvas.restore();

            mBody.draw(canvas);
            mHandLeft.draw(canvas, mTime);
            mHandRight.draw(canvas, mTime);
            canvas.restore();
        }

        @Override
        public void setColorFilter(ColorFilter colorFilter) {

        }

        @Override
        public int getOpacity() {
            return PixelFormat.UNKNOWN;
        }
    }

    private class Body extends Basic {
        private final Interpolator[] mInterpolator = {
                new EaseCubicInterpolator(0.48f, 0.06f, 0.52f, 0.94f),
                new EaseCubicInterpolator(0.47f, 0.00f, 0.77f, 0.63f),
                new EaseCubicInterpolator(0.34f, -0.68f, 0.55f, -1.14f),
                new EaseCubicInterpolator(0.48f, 0.00f, 0.52f, 1.00f)
        };
        private final float[] mProgress = {0f, 18f, 17.7f, 18.0f};

        Body(Context context) {
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.body);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 57, 59, true);
        }

        private void draw(Canvas canvas) {
            mMatrix.setTranslate(34, 103);
            canvas.drawBitmap(mBitmap, mMatrix, null);
        }

        float getProgress(int time) {
            return getProgress(time, mTimes, mProgress, mInterpolator);
        }
    }

    private class EyeLeft extends Eye {

        EyeLeft(Context context) {
            mTransX = 28;
            mTransY = 57;
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.eye_left);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 18, 22, true);
        }
    }

    private class EyeRight extends Eye {

        EyeRight(Context context) {
            mTransX = 80;
            mTransY = 57;
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.eye_right);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 18, 22, true);
        }
    }

    class Eye extends Basic {
        final float[] mTimes = {50f, 200f};
        final float[] mProgress = {1f, 0.15f, 1f};
        final Interpolator[] mInterpolator = {
                new EaseCubicInterpolator(0.33f, 0.00f, 0.67f, 1.00f),
                new EaseCubicInterpolator(0.33f, 0.00f, 0.67f, 1.00f)
        };
        int mTransX;
        int mTransY;

        void draw(Canvas canvas, int time) {
            mMatrix.setTranslate(mTransX, mTransY);

            if (time >= 1000 && time <= 1250) {
                float scale = getProgress(time - 1000, mTimes, mProgress, mInterpolator);
                mMatrix.postScale(1, scale, mTransX + mBitmap.getWidth() / 2f, mTransY + mBitmap.getHeight() / 2f);
            }
            canvas.drawBitmap(mBitmap, mMatrix, null);
        }
    }

    private class HandLeft extends Basic {
        private final float[] mProgress = {0f, 116f, 80f, 116f};
        private final Interpolator[] mInterpolator = {
                new EaseCubicInterpolator(0.44f, 0.20f, 0.71f, 1.00f),
                new EaseCubicInterpolator(0.48f, 0.00f, 0.44f, 1.00f),
                new EaseCubicInterpolator(0.53f, 0.00f, 0.61f, 1.00f),
                new EaseCubicInterpolator(0.17f, 0.00f, 0.52f, 1.00f)
        };

        HandLeft(Context context) {
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.hand_left);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 19, 27, true);
        }

        private void draw(Canvas canvas, int time) {
            float progress = getProgress(time, mTimes, mProgress, mInterpolator);
            mMatrix.setTranslate(16, 116);
            mMatrix.postRotate(progress, 37, 114);
            canvas.drawBitmap(mBitmap, mMatrix, null);
        }
    }

    private class HandRight extends Basic {
        private final float[] mProgress = {0f, -25f, -24.6f, -25f};
        private final Interpolator[] mInterpolator = {
                new EaseCubicInterpolator(0.48f, 0.06f, 0.52f, 0.94f),
                new EaseCubicInterpolator(0.47f, 0.00f, 0.77f, 0.63f),
                new EaseCubicInterpolator(0.34f, -0.68f, 0.55f, -1.14f),
                new EaseCubicInterpolator(0.48f, 0.00f, 0.52f, 1.00f)
        };

        HandRight(Context context) {
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.hand_right);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 19, 27, true);
        }

        private void draw(Canvas canvas, int time) {
            float progress = getProgress(time, mTimes, mProgress, mInterpolator);
            mMatrix.setTranslate(90, 116);
            mMatrix.postRotate(progress, 88, 114);
            canvas.drawBitmap(mBitmap, mMatrix, null);
        }
    }

    private class Head extends Basic {
        private final float[] mProgress = {0f, 18f, 17.7f, 18f};
        private final Interpolator[] mInterpolator = {
                new EaseCubicInterpolator(0.48f, 0.60f, 0.52f, 0.94f),
                new EaseCubicInterpolator(0.47f, 0.00f, 0.77f, 0.63f),
                new EaseCubicInterpolator(0.34f, -0.68f, 0.55f, -1.14f),
                new EaseCubicInterpolator(0.48f, 0.00f, 0.52f, 1.00f)
        };

        Head(Context context) {
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.head);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 126, 103, true);
        }

        private void draw(Canvas canvas) {
            canvas.drawBitmap(mBitmap, mMatrix, null);
        }

        float getProgress(int time) {
            return getProgress(time, mTimes, mProgress, mInterpolator);
        }

    }

    private class Mouth extends Basic {

        Mouth(Context context) {
            mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.mouth);
            mBitmap = Bitmap.createScaledBitmap(mBitmap, 12, 8, true);
        }

        private void draw(Canvas canvas) {
            mMatrix.setTranslate(57, 81);
            canvas.drawBitmap(mBitmap, mMatrix, null);

        }
    }

    private class Basic {

        final float[] mTimes = {700f, 200f, 250f, 550f};

        Bitmap mBitmap;
        Matrix mMatrix = new Matrix();

        float getProgress(int time, float[] times, float[] progresss, Interpolator[] interpolators) {
            float progress = 0f;
            float t;
            if (time < times[0]) {
                t = 1f * time / times[0];
                progress = progresss[0] + interpolators[0].getInterpolation(t) * (progresss[1] - progresss[0]);
            } else if (time < times[0] + times[1]) {
                t = 1f * (time - times[0]) / times[1];
                progress = progresss[1] + interpolators[1].getInterpolation(t) * (progresss[2] - progresss[1]);
            } else if (time < times[0] + times[1] + times[2]) {
                t = 1f * (time - times[1] - times[0]) / times[2];
                progress = progresss[2] + interpolators[2].getInterpolation(t) * (progresss[3] - progresss[2]);
            } else if (time < times[0] + times[1] + times[2] + times[3]) {
                t = 1f * (time - times[2] - times[1] - times[0]) / times[3];
                progress = progresss[3] + interpolators[3].getInterpolation(t) * (0 - progresss[3]);
            }
            return progress;
        }
    }

}
调用：

View在调用时，只需要设置背景为该Drawble，然后调用Animator的start（）方法。

package com.example.com.myapplication;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

import java.util.Random;

public class MainActivity extends AppCompatActivity {
    private ImageView mImageView;
    private AbsRobotAnimator mAnimator;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mImageView = (ImageView) findViewById(R.id.img);
        mAnimator = new WaveRobotAnimator(this.getApplicationContext(),false);
        mImageView.setImageDrawable(mAnimator.getDrawable());
    }


    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);
        if (hasFocus) {
            mImageView.postDelayed(new Runnable() {
                @Override
                public void run() {
                    startAnimator();
                }
            }, 1000);

        }
    }

    private void startAnimator() {
        cancelAnimator();
        mAnimator = AbsRobotAnimator.Factory.getInstance(this.getApplicationContext());
        mImageView.setImageDrawable(mAnimator.getDrawable());
        mAnimator.start();
    }

    private void cancelAnimator() {
        if (mAnimator != null) {
            mAnimator.cancel();
            mAnimator = null;
        }
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        cancelAnimator();
    }
}

自定义动画之Drawable结合ProgressBar
qq_34107153的博客
12-13 559
今天来说一说使用Drawable做动画。我之前还不知道Drawable可以用来干View能干的事，放在以前如果需要做一个自定义的动画我首先想到的就是自定义View去解决，但是最近我发现通过Drawable也可以去实现，而且还不用measure和layout。 说起我发现Drawable这个东西呢也是有点巧合，因为最近在跟着凯哥的公众号学自定义View，然后学到矩阵变化的时候，我就去想弄明白内部的原
Android属性动画——自定义Drawable（Robots）
04-22
自定义属性动画 详细介绍见：https://blog.youkuaiyun.com/lantianZMH01/article/details/80039200
自定义动画效果的Drawable
Rukey7的博客
07-03 9653
自定义动画效果的Drawable
Android Drawable实现自定义动画
RD哥哥的博客
12-15 599
1.xml如何自定义圆角 shapeDrawable？环形？三角形？ 2.drawable有多少种？用法是什么？ 上面的都不说，只说一些不太常用到的用法(所以本文亦是总结) 下面会以项目中遇到的两个实际需求引入一些用法 -------------------------半屏动画---------------------------- 半屏动画实际效果如下图：
Android应用开发——Animation Drawable
蓝色工作区
04-28 176
AnimationDrawable可以让你把一系列的图片像幻灯片一样一张一张地显示在屏幕上。Drawable Animation的基类是AnimationDrawable. 非常值得注意的一点是，虽然Animation Drawable的效果看起来像动画一样，但在实际的代码处理中应该将其视为Drawable，而事实上它继承于Drawable，其XML配置文件也是放置在res/drawable目录...
Android属性动画深入解析：自定义Drawable绘制Robots
标题中提到的“Android属性动画——自定义Drawable（Robots）”，涉及了Android开发中的两个重要概念：属性动画和Drawable资源的自定义。属性动画是Android 3.0(Honeycomb)以后引入的一个强大特性，允许开发者对对象...
安卓Android源码——自定义seekbar源码.zip
10-14
4. **自定义类**：创建一个新的 SeekBar 类，继承自 `android.widget.SeekBar`，并在其中添加新的属性或方法。这样可以封装特定的功能，提高代码的复用性和可维护性。 在提供的压缩包中，可能包含了一个自定义 ...
安卓Android源码——自定义弹出窗口的实现，对于作出自己特色效果的界面有一定帮助.zip
10-12
这份名为"安卓Android源码——自定义弹出窗口的实现"的压缩包提供了实现自定义弹出窗口的方法，对开发者创建具有个性化的界面效果非常有帮助。接下来，我们将深入探讨如何在Android中实现自定义弹出窗口以及涉及到的...
自定义Drawable实现灵动的红鲤鱼动画（上篇）
承香墨影的博客
07-15 282
作者简介本篇是 Jics 的投稿，分享如何分解一个动画效果，来快速实现它。分析的思路和效果都非常好，这只是第一篇，希望大家喜欢。Jics 的博客地址：http://www.jianshu...
Android自定义控件：动画类---逐帧动画AnimationDrawable
Vegetable的博客
07-14 3519
1：概述             Android动画包括View Animation(视图动画)和Property Animator(属性动画)，而View Animation包括Tween Animation（补间动画）和Frame Animation(逐帧动画)；补间动画主Animation（ScaleAnimation、 AlphaAnimation、RotateAnimation、T
android 自定义drawable,Android 自定义 Drawable
weixin_32251525的博客
05-26 294
在 Android 中，说到 Drawable，第一个想到的时候？是不是 drawable 里面的 shape 或者 selector 或者就是那么一个个图标？Drawable 是一个抽象类，描述的是一些可以被画出来的东西，其实 View 也是画东西出来嘛，Drawable 和 View 的最明显区别就是它只能画东西，没法接收事件响应交互。现在有如下的需求：design_drawable.gif简...
android 动画之漂移,Android之自定义Drawable实现灵动的红鲤鱼动画（上篇）
weixin_39525243的博客
05-25 230
此篇中的小鱼动画是模仿国外一个大牛做的flash动画，第一眼就爱上它了，简约灵动又不失美学，于是抽空试着尝试了一下，如下是我用Android实现的效果图：由于整个绘制分析过程比较繁琐所以灵动的红鲤鱼准备做成上下两篇，本篇是小鱼儿绘制的实现篇，第二篇是小鱼儿游动控制篇。本篇实现如下效果：绘制实现篇用到如下主要的技术:1)、自定义Drawable动画2)、Android的坐标及角度3)、Canvas...
Android自定义Drawable第十四式之百步穿杨
陈小缘的博客
07-13 7312
前言 Emmmm，看标题大概就能猜到，这次我们要做的是一个射箭的效果。 在这篇文章中，同学们可以学到： 在自定义Drawable里流畅地draw各种动画； 画一条粗细不一的线段； 来看两张效果图： 嗯，就是这样了，可以看到，我们等下要做的这个效果，还能用来当下拉刷新的动画，很炫酷。 这里有同学可能会说：这些动画叫UI 初步分析 ...
Android自定义Drawable第十五式之啡常OK
陈小缘的博客
09-29 7778
在上一篇的自定义Drawable中，我们学习了如何在Canvas上draw一个射箭的动画，不过那个动画是以线条为主的，多看几眼可能就会觉得没味道了，那么在本篇文章，将和同学们一起做一个看起来更耐看，更丝滑的动画。
android开发 鱼动画,自定义Drawable实现灵动的红鲤鱼动画（上篇）
weixin_26800111的博客
05-26 359
此篇中的小鱼动画是模仿国外一个大牛做的flash动画，第一眼就爱上它了，简约灵动又不失美学，于是抽空试着尝试了一下，如下是我用Android实现的效果图：小鱼儿由于整个绘制分析过程比较繁琐所以灵动的红鲤鱼准备做成上下两篇，本篇是小鱼儿绘制的实现篇，第二篇是小鱼儿游动控制篇下篇传送门。本篇实现如下效果：原地摆尾版绘制实现篇用到如下主要的技术:1)、自定义Drawable动画2)、Android的坐标...
自定义 Drawable实现灵动红鲤鱼特效
chuyouyinghe的专栏
05-20 261
1 前言 Hi，大家好，这里是承香墨影！ 此篇中的小鱼动画是模仿国外一个大牛做的 Flash 动画，第一眼就爱上它了，简约灵动又不失美学，于是抽空试着尝试了一下，如下是我用 Android 实现的效果图： 由于整个绘制分析过程比较繁琐，所以灵动的红鲤鱼准备做成上下两篇，本篇是小鱼儿绘制的实现篇，第二篇是小鱼儿游动控制篇。 本篇实现如下效果： 绘制实现篇用到如下主要的技术: 1. 自定义 Drawable 动画； 2. Android 的坐标及角度； 3.
Android动画之为Drawable图片添加动画
yingaizhu的博客
11-27 3063
一、前言     在某些情况下，我们需要为图片添加动画效果，比如在用户操作之后，将图标转换成另一张图标。Android 提供了多张方案为 Drawable 添加动画。首先就是使用 AnimationDrawable ，这种方案通过指定多张静态的 Drawable 图片文件组合在一起构成动画（每个时刻只显示一张图片）。另一种就是使用 AnimatedVectorDrawable，这种方案是通过改变矢量图片的属性实现动画。 二、使用 AnimationDrawable &
Android中AnimationDrawable,Animator和Animation
盛夏光年的学习笔记
01-06 1582
AnimationDrawable、Animation、Animator
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值