实现
圆形水波纹帧动画可以使用帧动画和属性动画的组合。
首先，我们可以在drawable文件夹下创建一个帧动画的xml文件，定义
水波纹的帧动画效果，例如ripple_anim.xml：
```xml
<animation-list xmlns:
android="http://schemas.
android.com/apk/res/
android"
android:oneshot="false">
<item
android:drawable="@drawable/ripple1"
android:duration="200" />
<item
android:drawable="@drawable/ripple2"
android:duration="200" />
<item
android:drawable="@drawable/ripple3"
android:duration="200" />
<item
android:drawable="@drawable/ripple4"
android:duration="200" />
</animation-list>
```
其中，@drawable/ripple1~4是定义好的
水波纹图片。
然后，我们可以在代码中使用属性动画实现
水波纹的扩散效果：
```java
public void startRippleAnimation(View view) {
int centerX = view.getWidth() / 2;
int centerY = view.getHeight() / 2;
// 计算
水波纹扩散的半径
int maxRadius = Math.max(view.getWidth(), view.getHeight()) / 2;
AnimatorSet animatorSet = new AnimatorSet();
animatorSet.setDuration(2000);
animatorSet.setInterpolator(new AccelerateDecelerateInterpolator());
// 创建一个
水波纹的属性动画，扩散半径从0到maxRadius
ObjectAnimator rippleAnimator = ObjectAnimator.ofInt(view, "rippleRadius", 0, maxRadius);
rippleAnimator.setDuration(1000);
// 创建一个透明度属性动画，从1.0到0.0
ObjectAnimator alphaAnimator = ObjectAnimator.ofFloat(view, "alpha", 1.0f, 0.0f);
alphaAnimator.setDuration(1000);
animatorSet.playTogether(rippleAnimator, alphaAnimator);
animatorSet.start();
}
```
其中，"rippleRadius"和"alpha"是
自定义的属性，可以通过
自定义View的方式实现：
```java
public class RippleView extends View {
private int mRippleRadius;
private int mRippleColor;
public RippleView(Context context) {
this(context, null);
}
public RippleView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public RippleView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(attrs);
}
private void init(AttributeSet attrs) {
TypedArray ta = getContext().obtainStyledAttributes(attrs, R.styleable.RippleView);
mRippleColor = ta.getColor(R.styleable.RippleView_rippleColor, Color.parseColor("#33B5E5"));
ta.recycle();
}
public void setRippleRadius(int rippleRadius) {
mRippleRadius = rippleRadius;
invalidate();
}
public void setRippleColor(int rippleColor) {
mRippleColor = rippleColor;
invalidate();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int centerX = getWidth() / 2;
int centerY = getHeight() / 2;
Paint paint = new Paint();
paint.setColor(mRippleColor);
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(true);
canvas.drawCircle(centerX, centerY, mRippleRadius, paint);
}
}
```
在布局文件中使用
自定义的
水波纹View：
```xml
<com.example.rippleview.RippleView
android:id="@+id/ripple_view"
android:layout_width="200dp"
android:layout_height="200dp"
android:background="@drawable/ripple_anim"
app:rippleColor="#33B5E5" />
```
最后，在代码中调用startRippleAnimation方法就可以启动
水波纹动画了：
```java
RippleView rippleView = findViewById(R.id.ripple_view);
rippleView.startRippleAnimation();
```
完整的示例代码请见：https://github.com/luoyesiqiu/
Android-RippleView。
该专栏为热销专栏榜 第58名
超级会员免费看
订阅专栏 解锁全文
4211
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
