仿网易云音乐收藏的小动画

最近在写一个新的项目，新项目中有一个收藏的功能，相信现在的很多app都有收藏和取消收藏的功能。单纯的收藏和取消收藏，如果只是使用setSelect或者setImageResource方式更换已收藏和取消收藏的图片未免显得生硬了些，所以想到了添加一个添加收藏和取消收藏的动画，这样看起来好多了，把部分代码贴出来供大家参考。欢迎大家指正！

先上一张效果图

1.布局文件很简单，相对布局包裹一个ImageView

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.ekeguan.collectanimationdemo.MainActivity">

    <ImageView
        android:id="@+id/iv_collect"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_centerVertical="true"
        android:layout_centerInParent="true"
        android:src="@drawable/collect_no"
        android:background="?attr/selectableItemBackgroundBorderless"/>

</RelativeLayout>

2.在MainActivity调用ImageView的点击事件，触发收藏和取消收藏的操作

package com.ekeguan.collectanimationdemo;

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

import com.ekeguan.collectanimationdemo.utils.ScaleAnimatorUtils;

import butterknife.BindView;
import butterknife.ButterKnife;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    @BindView(R.id.iv_collect)
    ImageView ivCollect;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);

        initView();
        initData();
        initEventListener();
    }

    private void initView() {
        ivCollect.setSelected(false);
    }

    private void initData() {}

    private void initEventListener() {
        ivCollect.setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()){
            case R.id.iv_collect:
                if (ivCollect.isSelected()==false){
                    ivCollect.setImageResource(R.drawable.collect_yes);
                    ivCollect.setSelected(true);
                    ScaleAnimatorUtils.setScalse(ivCollect);
                    Toast.makeText(this,"收藏成功",Toast.LENGTH_SHORT).show();
                }else{
                    ivCollect.setImageResource(R.drawable.collect_no);
                    ivCollect.setSelected(false);
                    ScaleAnimatorUtils.setScalse(ivCollect);
                    Toast.makeText(this,"取消收藏",Toast.LENGTH_SHORT).show();
                }
                break;
        }
    }
}

3.其中用到了一个ScaleAnimatorUtils类，这个类即是实现添加收藏和取消收藏的动画工具类

public class ScaleAnimatorUtils {
    /**
     * 设置缩放动画
     *
     * @param view
     */
    public static void setScalse(View view) {
        AnimatorSet set = new AnimatorSet();
        ObjectAnimator animator_x = ObjectAnimator.ofFloat(view, "scaleX", 1.5f, 1.2f, 1f, 0.5f, 0.7f,1f);
        ObjectAnimator animator_y = ObjectAnimator.ofFloat(view, "scaleY", 1.5f, 1.2f, 1f, 0.5f, 0.7f,1f);
        set.play(animator_x).with(animator_y);
        set.setDuration(500);
        set.start();
    }
}

项目GitHub地址：https://github.com/xinyitiandi/CollectAnimationDemo.git