自定义View之圆形水波扩散动效

最新推荐文章于 2024-07-18 18:15:00 发布

置顶

DX_Demi

最新推荐文章于 2024-07-18 18:15:00 发布

阅读量8.4k

点赞数 7

分类专栏： Android 文章标签：支付宝自定义view 扩散圆形动画

本文链接：https://blog.csdn.net/u012209506/article/details/72833936

版权

前言

这个效果做出来以后，真的美极了！放在你的应用中，无疑增添了光彩！

效果图

效果1 效果2 效果3

其实，第一种效果，才是产品的需求要的效果。第三种效果，是不是很熟悉？支付宝的咻一咻！哈哈，无意中，我就写出来了。

实现步骤

1.attrs.xml定义属性

 <declare-styleable name="WaveView">
        <!--圆颜色-->
        <attr name="wave_color" format="color"/>
        <!--中心圆图片半径-->
        <attr name="wave_coreImageRadius" format="integer"/>
        <!--波浪圆之间间距,值越小越窄-->
        <attr name="wave_width" format="integer"/>
    </declare-styleable>

2.WaveView的初始化

  /**
     * 波浪圆圈颜色
     */
    private int mColor = getResources().getColor(R.color.yellow);
    /**
     * 第一个圆圈的半径(也就是圆形图片的半径)
     */
    private int mImageRadius=50;
    /**
     * 波浪圆之间间距
     */
    private int mWidth = 3;
    /**
     * 最大宽度
     */
    private Integer mMaxRadius = 300;
    /**
     * 是否正在扩散中
     */
    private boolean mIsWave = false;
    // 透明度集合
    private List<Integer> mAlphas = new ArrayList<>();
    // 扩散圆半径集合