Android 点击小爱心周围有小点点动画效果 代码实现
时间: 2023-08-15 20:05:23 浏览: 165
Android代码-heartLayout(点赞爱心效果)
好的,以下是一个简单的代码实现。首先在布局文件中添加一个 ImageView 和一个 FrameLayout,如下:
```xml
<RelativeLayout
android:id="@+id/layout_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/img_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_like"/>
<FrameLayout
android:id="@+id/layout_anim"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@id/img_like"
android:layout_alignBottom="@id/img_like"
android:layout_alignLeft="@id/img_like"
android:layout_alignRight="@id/img_like"/>
</RelativeLayout>
```
然后在代码中为 ImageView 添加点击事件,并在点击事件中添加动画效果,如下:
```java
// 获取布局文件中的控件
ImageView imgLike = findViewById(R.id.img_like);
FrameLayout layoutAnim = findViewById(R.id.layout_anim);
// 为 ImageView 添加点击事件
imgLike.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 添加小点点动画
for (int i = 0; i < 6; i++) {
ImageView imgDot = new ImageView(MainActivity.this);
imgDot.setImageResource(R.drawable.ic_dot);
layoutAnim.addView(imgDot);
// 设置小点点的初始位置
int[] locations = new int[2];
imgLike.getLocationInWindow(locations);
imgDot.setX(locations[0] + imgLike.getWidth() / 2 - imgDot.getWidth() / 2);
imgDot.setY(locations[1] + imgLike.getHeight() / 2 - imgDot.getHeight() / 2);
// 添加小点点的动画效果
ObjectAnimator anim1 = ObjectAnimator.ofFloat(imgDot, "scaleX", 1f, 0.4f);
ObjectAnimator anim2 = ObjectAnimator.ofFloat(imgDot, "scaleY", 1f, 0.4f);
ObjectAnimator anim3 = ObjectAnimator.ofFloat(imgDot, "alpha", 1f, 0f);
ObjectAnimator anim4 = ObjectAnimator.ofFloat(imgDot, "rotation", 0f, 360f);
AnimatorSet animSet = new AnimatorSet();
animSet.playTogether(anim1, anim2, anim3, anim4);
animSet.setDuration(800);
animSet.start();
animSet.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
layoutAnim.removeView(imgDot);
}
});
// 每个小点点的动画间隔时间不同
try {
Thread.sleep(i * 50);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
});
```
这样就可以实现一个简单的小爱心点击动画效果了。注意,代码中的图片资源需要自行添加,并根据实际情况进行调整。
阅读全文