今天介绍Android中两种实现纹波效果的方式。
一. 使用ViewAnimationUtils类
1.通过查看ViewAnimationUtils类源码发现该类只有一个静态方法：
静态方法
2.静态方法中各个参数的含义：
参数含义
- view：使用纹波效果的视图对象
- centerX：圆心的x轴坐标，相对于view
- centerY：圆形的Y轴坐标，相对于view
- startRadius：圆的开始半径
- endRadius：圆的结束半径
3.ViewAnimationUtils类是从API level 21引入的，因此在使用的时候需要首先判断手机的版本号，然后再执行纹波动画。下面以点击一个Button为例，演示通过ViewAnimationUtils类实现的纹波效果：
布局文件activity.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<Button
android:id="@+id/view"
android:layout_width="250dp"
android:layout_height="150dp"
android:layout_gravity="center_horizontal"
android:text="Button"/>
</LinearLayout>
MainActivity.java
package rich.ivan.testa;
import android.animation.Animator;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewAnimationUtils;
import android.view.animation.AccelerateInterpolator;
import android.widget.Button;
public class MainActivity extends AppCompatActivity implements View.OnClickListener, View.OnTouchListener {
private int mRawX;
private int mRawY;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button button = (Button) findViewById(R.id.view);
button.setOnClickListener(this);
button.setOnTouchListener(this);
}
@Override
public void onClick(final View view) {
if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {
Animator animator = ViewAnimationUtils.createCircularReveal(
view,
mRawX,
mRawY,
0,
Math.max(view.getWidth(), view.getHeight()));
animator.setDuration(2000);
animator.setInterpolator(new AccelerateInterpolator());
animator.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {}
@Override
public void onAnimationEnd(Animator animation) {}
@Override
public void onAnimationCancel(Animator animation) {}
@Override
public void onAnimationRepeat(Animator animation) {}
});
animator.start();
}
}
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
mRawX = (int) event.getX();
mRawY = (int) event.getY();
}
return false;
}
}
4.点击按钮显示纹波效果：
按钮纹波效果图
5.我们发现使用这种方式创建纹波效果时，动画开始时整个Button被覆盖了，随着纹波的扩散逐渐显示出来，这就是使用ViewAnimationUtils类创建纹波的特征，View会被先覆盖掉。
二. 通过xml文件配置
1.因为纹波效果在API 21以后才引入，所以首先在res目录下创建drawable-v21资源目录，然后在该目录下新建ripple_effect.xml文件：
ripple_effect.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/colorPrimary">
<item>
<shape android:shape="rectangle">
<solid android:color="#FFFFFF"/>
</shape>
</item>
</ripple>
2.设置Button控件的属性：android:background="@drawable/ripple_effect"
activity_main_test.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<Button
android:id="@+id/view"
android:layout_width="250dp"
android:layout_height="150dp"
android:layout_gravity="center_horizontal"
android:background="@drawable/ripple_effect"
android:text="Button"/>
</LinearLayout>
3.修改MainActivity.java中引用的布局文件，同时删除ViewAnimationUtils创建动画部分的代码（这里不再贴出代码）。
setContentView(R.layout.activity_main_test);
4.实现效果图：
效果图
5.使用这种方式绘制纹波效果时系统不会先覆盖原来的View，而是在原来的View上面绘制圆形，在绘制纹波时保证了原来的View也能正常显示。
