返回
以美观的形式在 Android 中仿制即刻点赞并滚动放大波纹图标
Android
2024-01-12 10:24:40
最近在网上冲浪的时候,看到了一个比较有创意的点赞图标。就是类似即刻的点赞,点赞图标会从小变大,并且有一个波纹效果。一开始没发现有什么难点,但是后来仔细观察之后才发现实现起来并不是很简单。我查了一下相关的资料,发现网上已经有一些仿即刻点赞图标的实现方案了,但是这些方案都存在一些问题。有的方案实现的并不完整,有的方案实现的虽然完整,但是代码非常复杂。
于是我决定自己实现一个仿即刻点赞图标。我的实现方案非常简单,只需要一个ImageView和一个ScrollTextView即可。ImageView用于实现点赞图标的放大动画,ScrollTextView用于实现波纹效果。
首先,我们先来看一下ImageView的实现代码。
public class PraiseView extends FrameLayout {
private ImageView mIvPraise;
private Animation mAnimation;
public PraiseView(Context context) {
super(context);
init();
}
public PraiseView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public PraiseView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
mIvPraise = new ImageView(getContext());
mIvPraise.setImageResource(R.mipmap.ic_praise);
LayoutParams layoutParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
layoutParams.gravity = Gravity.CENTER;
addView(mIvPraise, layoutParams);
mAnimation = AnimationUtils.loadAnimation(getContext(), R.anim.anim_praise);
}
public void startPraiseAnimation() {
mIvPraise.startAnimation(mAnimation);
}
}
在上面的代码中,我们首先定义了一个ImageView变量mIvPraise。然后在init()方法中,我们实例化了mIvPraise并设置了它的属性。最后,我们在startPraiseAnimation()方法中,启动了mIvPraise的动画。
接下来,我们来看一下ScrollTextView的实现代码。
public class ScrollTextView extends TextView {
private Animation mAnimation;
public ScrollTextView(Context context) {
super(context);
init();
}
public ScrollTextView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public ScrollTextView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
mAnimation = AnimationUtils.loadAnimation(getContext(), R.anim.anim_scroll_text);
}
public void startScrollAnimation() {
startAnimation(mAnimation);
}
}
在上面的代码中,我们首先定义了一个TextView变量mTvScrollText。然后在init()方法中,我们实例化了mTvScrollText并设置了它的属性。最后,我们在startScrollAnimation()方法中,启动了mTvScrollText的动画。
最后,我们只需要在布局文件中将PraiseView和ScrollTextView组合在一起即可。
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.example.praiseview.PraiseView
android:id="@+id/pv_praise"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<com.example.praiseview.ScrollTextView
android:id="@+id/stv_scroll_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="点赞数" />
</LinearLayout>
这样,我们就实现了仿即刻点赞图标。