当前位置: 开发笔记 > Android > 正文

Android自定义View实现点赞控件

作者：Bleach1121 | 来源：互联网 | 2022-10-03 11:29

这篇文章主要介绍了Android自定义View实现点赞控件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Android点赞控件的具体代码，供大家参考，具体内容如下

预览效果

图片类：LikeImageView
文字类：LikeCharTextView
整合类：LikeView.java
自定义属性：attrs.xml

代码

LikeCharTextView

public class LikeCharTextView extends View {

 public static final int DEFAULT_TEXTCOLOR = Color.BLACK;
 public static final int DEFAULT_TEXTSIZE = 36;

 private TextPaint newTextPaint, oldTextPaint;

 private AnimatorSet addAnimator;
 private AnimatorSet minusAnimator;

 private int  measureWidth;
 private int  measureHeight;

 private int  textColor  = DEFAULT_TEXTCOLOR;
 private int  textSize  = DEFAULT_TEXTSIZE;

 private int  num;
 private int  oldNum;
 private int  newNum;

 private int  animatorOldY;
 private float  animatorOldAlpha = 1;

 private int  animatorNewY;
 private float  animatorNewAlpha = 0;
 private int  baseline;

 public LikeCharTextView(Context context) {
 super(context);

 init();
 }

 public LikeCharTextView(Context context, @Nullable AttributeSet attrs) {
 super(context, attrs);

 initAttr(context, attrs);

 init();
 }

 public LikeCharTextView(Context context, @Nullable AttributeSet attrs,
    int defStyleAttr) {
 super(context, attrs, defStyleAttr);

 initAttr(context, attrs);

 init();
 }

 /**
 * 初始化属性
 *
 * @param context
 * @param attrs
 */
 private void initAttr(Context context, @Nullable AttributeSet attrs) {
 TypedArray typedArray = context.obtainStyledAttributes(attrs,
  R.styleable.LikeCharTextView);
 textColor = typedArray.getColor(R.styleable.LikeCharTextView_textColor,
  DEFAULT_TEXTCOLOR);
 textSize = typedArray.getDimensionPixelSize(R.styleable.LikeCharTextView_textSize,
  DEFAULT_TEXTSIZE);
 num = typedArray.getInt(R.styleable.LikeCharTextView_number, 0);
 if (0 > num || num > 10) {
  throw new IllegalArgumentException("Number is only 0-9");
 }
 oldNum = num;

 typedArray.recycle();
 }

 /**
 * 初始化
 */
 private void init() {
 initPaints();
 initParams();
 }

 /**
 * 初始化画笔
 */
 private void initPaints() {
 newTextPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG);
 newTextPaint.setStyle(Paint.Style.FILL);
 newTextPaint.setTextSize(textSize);
 newTextPaint.setColor(textColor);
 newTextPaint.setTextAlign(Paint.Align.CENTER);

 oldTextPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG);
 oldTextPaint.set(newTextPaint);
 }

 /**
 * 初始化参数
 */
 private void initParams() {
 Paint.FontMetrics fOntMetrics= newTextPaint.getFontMetrics();
 measureWidth = (int) newTextPaint.measureText(String.valueOf(num));
 measureHeight = (int) (fontMetrics.bottom - fontMetrics.top);

 float distance = (fontMetrics.bottom - fontMetrics.top) / 2 - fontMetrics.bottom;
 baseline = (int) (measureHeight * 1.0f / 2 + distance);

 animatorOldY = baseline;
 }

 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 super.onMeasure(widthMeasureSpec, heightMeasureSpec);

 int widthMode = MeasureSpec.getMode(widthMeasureSpec);
 int widthSize = MeasureSpec.getSize(widthMeasureSpec);
 switch (widthMode) {
  case MeasureSpec.UNSPECIFIED:
  break;
  case MeasureSpec.AT_MOST:
  widthSize = measureWidth;
  break;
  case MeasureSpec.EXACTLY:
  break;
 }

 int heightMode = MeasureSpec.getMode(widthMeasureSpec);
 int heightSize = MeasureSpec.getSize(widthMeasureSpec);
 switch (heightMode) {
  case MeasureSpec.UNSPECIFIED:
  break;
  case MeasureSpec.AT_MOST:
  heightSize = measureHeight;
  break;
  case MeasureSpec.EXACTLY:
  break;
 }

 setMeasuredDimension(widthSize, heightSize);
 }

 @Override
 protected void onDraw(Canvas canvas) {
 super.onDraw(canvas);
 int width = getWidth();
 int height = getHeight();
 oldTextPaint.setAlpha((int) (255 * animatorOldAlpha));
 canvas.drawText(String.valueOf(oldNum), width / 2, animatorOldY, oldTextPaint);

 newTextPaint.setAlpha((int) (255 * animatorNewAlpha));
 canvas.drawText(String.valueOf(newNum), width / 2, animatorNewY, newTextPaint);
 }

 public void setTextColor(int textColor) {
 this.textColor = textColor;
 init();
 invalidate();
 }

 public void setTextSize(int textSize) {
 this.textSize = textSize;
 init();
 invalidate();
 }

 public void setAnimatorOldY(int animatorOldY) {
 this.animatorOldY = animatorOldY;
 invalidate();
 }

 public void setAnimatorOldAlpha(float animatorOldAlpha) {
 this.animatorOldAlpha = animatorOldAlpha;
 invalidate();
 }

 public void setAnimatorNewY(int animatorNewY) {
 this.animatorNewY = animatorNewY;
 invalidate();
 }

 public void setAnimatorNewAlpha(float animatorNewAlpha) {
 this.animatorNewAlpha = animatorNewAlpha;
 invalidate();
 }

 public void setNum(int num) {
 this.num = num;
 if (0 > num || num > 10) {
  throw new IllegalArgumentException("Number is only 0-9");
 }
 oldNum = num;
 invalidate();
 }

 public void add() {
 Logger.e("执行加动画.基线：" + baseline);
 ObjectAnimator oldYAnimator = ObjectAnimator.ofInt(this, "animatorOldY", baseline, 0);
 ObjectAnimator oldAlphaAnimator = ObjectAnimator.ofFloat(this, "animatorOldAlpha", 1, 0);
 ObjectAnimator newYAnimator = ObjectAnimator.ofInt(this, "animatorNewY", baseline * 2,
  baseline);
 ObjectAnimator newAlphaAnimator = ObjectAnimator.ofFloat(this, "animatorNewAlpha", 0, 1);

 addAnimator = new AnimatorSet();
 addAnimator.playTogether(oldYAnimator, oldAlphaAnimator, newYAnimator, newAlphaAnimator);
 addAnimator.setInterpolator(new LinearInterpolator());
 addAnimator.setDuration(300);
 addAnimator.start();
 }

 public void minus() {
 Logger.e("执行减动画.基线:" + baseline);
 ObjectAnimator oldYAnimator = ObjectAnimator.ofInt(this, "animatorOldY", baseline,
  baseline * 2);
 ObjectAnimator oldAlphaAnimator = ObjectAnimator.ofFloat(this, "animatorOldAlpha", 1, 0);
 ObjectAnimator newYAnimator = ObjectAnimator.ofInt(this, "animatorNewY", 0, baseline);
 ObjectAnimator newAlphaAnimator = ObjectAnimator.ofFloat(this, "animatorNewAlpha", 0, 1);

 minusAnimator = new AnimatorSet();
 minusAnimator.playTogether(oldYAnimator, oldAlphaAnimator, newYAnimator, newAlphaAnimator);
 minusAnimator.setInterpolator(new LinearInterpolator());
 minusAnimator.setDuration(300);
 minusAnimator.start();
 }

 public void change(boolean isAdd) {
 Logger.e("charTextVie.点击事件:" + isAdd);
 if (isAdd) {
  if (null != addAnimator && addAnimator.isStarted()) {
  Logger.e("charTextVie.加动画已执行.取消");
  addAnimator.cancel();
  }
  if (null != minusAnimator && minusAnimator.isStarted()) {
  Logger.e("charTextVie.减动画已执行.取消");
  minusAnimator.cancel();
  }
  sumNum(false);
  minus();
 } else {
  if (null != minusAnimator && minusAnimator.isStarted()) {
  Logger.e("charTextVie.减动画已执行.取消");
  minusAnimator.cancel();
  }
  if (null != addAnimator && addAnimator.isStarted()) {
  Logger.e("charTextVie.加动画已执行.取消");
  addAnimator.cancel();
  }
  sumNum(true);
  add();
 }
 }

 /**
 * 重新计算绘画的值
 *
 * @param isAdd
 */
 private void sumNum(boolean isAdd) {
 Logger.e("计算值开始");
 oldNum = num;
 newNum = num + (isAdd &＃63; 1 : -1);
 if (newNum <0) {
  newNum = 9;
 } else if (newNum > 9) {
  newNum = 0;
 }
 num = newNum;
 Logger.e("计算值结束：" + num);
 }
}

LikeImageView

public class LikeImageView extends View {

 private Paint imagePaint, shiningPaint;

 private int shiningMoveX;
 private int shiningMoveY;

 private int measureWidth;
 private int measureHeight;
 private Bitmap selectedBtimap;
 private Bitmap selectedShiningBtimap;
 private Bitmap unSelectedBtimap;

 private boolean isAdd = false;

 private float shiningAlpha = isAdd &＃63; 1f : 0f;

 public LikeImageView(Context context) {
 super(context);

 init();
 }

 public LikeImageView(Context context, @Nullable AttributeSet attrs) {
 super(context, attrs);

 init();
 }

 public LikeImageView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);

 init();
 }

 private void init() {
 imagePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
 shiningPaint = new Paint(Paint.ANTI_ALIAS_FLAG);

 selectedBtimap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_like_selected);
 selectedShiningBtimap = BitmapFactory.decodeResource(getResources(),
  R.mipmap.ic_like_selected_shining);
 unSelectedBtimap = BitmapFactory.decodeResource(getResources(),
  R.mipmap.ic_like_unselected);
 }

 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 super.onMeasure(widthMeasureSpec, heightMeasureSpec);

 int widthMode = MeasureSpec.getMode(widthMeasureSpec);
 int widthSize = MeasureSpec.getSize(widthMeasureSpec);
 switch (widthMode) {
  case MeasureSpec.UNSPECIFIED:
  break;
  case MeasureSpec.AT_MOST:
  widthSize = Math.max(selectedBtimap.getWidth(), unSelectedBtimap.getWidth());
  shiningMoveX = (int) (widthSize * 1.0f - selectedShiningBtimap.getWidth()) - 2;
  break;
  case MeasureSpec.EXACTLY:
  break;
 }

 int heightMode = MeasureSpec.getMode(widthMeasureSpec);
 int heightSize = MeasureSpec.getSize(widthMeasureSpec);
 switch (heightMode) {
  case MeasureSpec.UNSPECIFIED:
  break;
  case MeasureSpec.AT_MOST:
  heightSize = Math.max(selectedBtimap.getHeight(), unSelectedBtimap.getHeight());
  shiningMoveY = (int) (selectedShiningBtimap.getHeight() * 1.0f / 3);
  heightSize += shiningMoveY;
  break;
  case MeasureSpec.EXACTLY:
  break;
 }

 setMeasuredDimension(widthSize, heightSize);
 }

 @Override
 protected void onDraw(Canvas canvas) {
 super.onDraw(canvas);

 int width = getWidth();
 int height = getHeight();
 Rect src = new Rect(0, 0, width, height);
 Rect selectDst = new Rect(0, shiningMoveY, selectedBtimap.getWidth(), height);
 if (isAdd) {
  //画红赞
  canvas.drawBitmap(selectedBtimap, src, selectDst, imagePaint);
  //画阴影
  shiningPaint.setAlpha((int) (255 * shiningAlpha));
  Rect shiningDst = new Rect(shiningMoveX, 0,
   shiningMoveX + selectedShiningBtimap.getWidth(), selectedShiningBtimap.getHeight());
  canvas.drawBitmap(selectedShiningBtimap, src, shiningDst, shiningPaint);
 } else {
  //画灰赞
  canvas.drawBitmap(unSelectedBtimap, src, selectDst, imagePaint);
 }
 }

 public void setShiningAlpha(float shiningAlpha) {
 this.shiningAlpha = shiningAlpha;
 invalidate();
 }

 public void setAdd(boolean add) {
 isAdd = add;
 shiningAlpha = 1.0f;
 invalidate();
 }

 public void changeLike(boolean isAdd) {
 this.isAdd = !isAdd;
 invalidate();
 anim();
 }

 private void anim() {
 ObjectAnimator scaleXAnim = ObjectAnimator.ofFloat(this, "scaleX", 0.7f, 1f);
 scaleXAnim.setDuration(500);
 ObjectAnimator scaleYAnim = ObjectAnimator.ofFloat(this, "scaleY", 0.7f, 1f);
 scaleYAnim.setDuration(500);
 ObjectAnimator alphaAnim = ObjectAnimator.ofFloat(this, "shiningAlpha", 0f, 1f);
 alphaAnim.setDuration(500);
 AnimatorSet animatorSet = new AnimatorSet();
 animatorSet.playTogether(scaleXAnim, scaleYAnim, alphaAnim);
 animatorSet.setInterpolator(new BounceInterpolator());
 animatorSet.start();
 }
}

LikeView

public class LikeView extends LinearLayout {
 private final int IMAGEPADDING = 4;

 private boolean isAdd = false;

 private int num;
 private int textSize;
 private int textColor;

 private int imagePadding;

 private List charTvs = new ArrayList<>();
 private LikeImageView likeImageView;

 public LikeView(Context context) {
 super(context);
 init();
 }

 public LikeView(Context context, @Nullable AttributeSet attrs) {
 super(context, attrs);

 initAttr(context, attrs);

 init();
 }

 public LikeView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);

 initAttr(context, attrs);

 init();
 }

 private void initAttr(Context context, AttributeSet attrs) {
 TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.LikeView);
 textColor = typedArray.getColor(R.styleable.LikeView_textColor,
  LikeCharTextView.DEFAULT_TEXTCOLOR);
 textSize = typedArray.getDimensionPixelSize(R.styleable.LikeView_textSize,
  LikeCharTextView.DEFAULT_TEXTSIZE);
 num = typedArray.getInt(R.styleable.LikeView_number, 0);
 imagePadding = typedArray.getDimensionPixelSize(R.styleable.LikeView_imagePadding, IMAGEPADDING);

 typedArray.recycle();
 }

 /**
 * 初始化
 */
 private void init() {

 initView();
 }

 protected void initView() {
 removeAllViews();

 likeImageView = new LikeImageView(getContext());
 likeImageView.setAdd(isAdd);
 LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
 layoutParams.rightMargin = imagePadding;
 likeImageView.setLayoutParams(layoutParams);
 addView(likeImageView);

 charTvs.clear();
 String str_num = String.valueOf(num);
 for (int i = 0; i  MOHUFANWEI || Math.abs(lastY - y) > MOHUFANWEI) {
   click = false;
  }
  break;
 }

 lastX = x;
 lastY = y;
 return true;
 }

 private void onClick() {
 Logger.e("点击事件" + isAdd);
 String str_num = String.valueOf(num);
 Logger.e("点击事件,str_num:" + str_num);
 boolean nextAnim = false;
 if (isAdd) {
  likeImageView.changeLike(true);
  for (int i = (str_num.length() - 1); i >= 0; i--) {
  int chr_num = Integer.valueOf(str_num.substring(i, i + 1));
  Logger.e("点击事件,chr_num:%d,charTvs.size:%d,i:%d", chr_num, charTvs.size(), i);
  Logger.e("是否执行动画:" + (charTvs.size() > i));
  if (charTvs.size() > i) {
   if (i == (str_num.length() - 1) || nextAnim) {
   Logger.e("点击事件,执行个位动画||%b执行执行上%d位动画", nextAnim, i);
   charTvs.get(i).change(true);

   chr_num--;
   Logger.e("chr_num:%d，是否执行上一位动画:", chr_num, (chr_num <0));
   if (chr_num <0) {
    nextAnim = true;
   } else {
    nextAnim = false;
   }

   Logger.e("nextAnim:" + nextAnim);
   }
  }
  }
  num--;
  isAdd = !isAdd;
 } else {
  likeImageView.changeLike(false);
  for (int i = (str_num.length() - 1); i >= 0; i--) {
  int chr_num = Integer.valueOf(str_num.substring(i, i + 1));
  Logger.e("点击事件,chr_num:%d,charTvs.size:%d,i:%d", chr_num, charTvs.size(), i);
  Logger.e("是否执行动画:" + (charTvs.size() > i));
  if (charTvs.size() > i) {
   if (i == (str_num.length() - 1) || nextAnim) {
   Logger.e("点击事件,执行个位动画||%b执行执行上%d位动画", nextAnim, i);
   charTvs.get(i).change(false);

   chr_num++;
   Logger.e("chr_num:%d，是否执行上一位动画:", chr_num, (chr_num > 9));
   if (chr_num > 9) {
    nextAnim = true;
   } else {
    nextAnim = false;
   }
   Logger.e("nextAnim:" + nextAnim);
   }
  }
  }
  num++;
  isAdd = !isAdd;
 }
 }
}

attrs.xml

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

android
xml

推荐阅读

apk
Android 自定义 Spinner 下拉框样式

本文介绍了如何通过创建自定义 XML 文件来修改 Android 中 Spinner 的项样式，包括颜色和大小的调整。 ... [详细]

蜡笔小新 2024-11-25 01:39:41
build
Android 开发框架整合：MVP + Retrofit + Dagger2 + RxAndroid 配置指南

本文将详细介绍如何配置并整合MVP架构、Retrofit网络请求库、Dagger2依赖注入框架以及RxAndroid响应式编程库，构建高效、模块化的Android应用。 ... [详细]

蜡笔小新 2024-11-24 20:16:02
apk
浅谈Android五大布局——LinearLayout、FrameLayout和AbsoulteLa

为什么80%的码农都做不了架构师？Android的界面是有布局和组件协同完成的，布局好比是建筑里的框架，而组件则相当于建筑里的砖瓦。 ... [详细]

蜡笔小新 2024-11-24 16:56:56
android
Android 开发技巧：动态修改 strings.xml 文件中的字符串值

本文介绍了一种在 Android 开发中动态修改 strings.xml 文件中字符串值的有效方法。通过使用占位符，开发者可以在运行时根据需要填充具体的值，从而提高应用的灵活性和可维护性。 ... [详细]

蜡笔小新 2024-11-24 11:51:17
apk
如何高效学习鸿蒙操作系统：开发者指南

本文探讨了开发者如何更有效地学习鸿蒙操作系统，提供了来自行业专家的建议，包括系统化学习方法、职业规划建议以及具体的开发技巧。 ... [详细]

蜡笔小新 2024-11-23 19:22:14
build
如何使用Maven将依赖插件一并打包进JAR文件

本文详细介绍了在使用Maven构建项目时，如何将所需的依赖插件一同打包进最终的JAR文件中，以避免手动部署依赖库的麻烦。 ... [详细]

蜡笔小新 2024-11-23 22:51:34
json
将XML数据迁移至Oracle Autonomous Data Warehouse (ADW)

随着Oracle ADW的推出，数据迁移至ADW成为业界关注的焦点。特别是XML和JSON这类结构化数据的迁移需求日益增长。本文将通过一个实际案例，探讨如何高效地将XML数据迁移至ADW。 ... [详细]

蜡笔小新 2024-11-23 20:27:56
xml
必须为元素类型 mapper 声明属性 namespace解决

在使用mybatis进行mapper.xml测试的时候发生必须为元素类型“mapper”声明属性“namespace”的错误项目目录结构UserMapper和UserMappe ... [详细]

蜡笔小新 2024-11-23 20:06:58
xml
基于角色的权限管理在AspNetForums中的应用

本文探讨了在AspNetForums平台中实施基于角色的权限控制系统的方法，旨在为不同级别的用户提供合适的访问权限，确保系统的安全性和可用性。 ... [详细]

蜡笔小新 2024-11-23 18:42:29
xml
将datatable导出为excel的三种方式（转）

一、使用Microsoft.Office.Interop.Excel.DLL需要安装Office代码如下：2publicstaticboolExportExcel(S ... [详细]

蜡笔小新 2024-11-23 16:37:33
build
Servlet基础入门指南（上）

本文介绍了Tomcat的基本操作，包括启动、关闭及首次访问的方法，并详细讲解了如何在IDEA中创建Web项目，配置Servlet及其映射，以及如何将项目部署到Tomcat。 ... [详细]

蜡笔小新 2024-11-23 11:55:30
xml
小程序实现点击获取数据与侧边栏功能

本文介绍了如何使用微信小程序的.wxml、.wxss和.js文件来实现点击获取数据及侧边栏显示功能。具体包括页面布局、样式设置以及事件处理。 ... [详细]

蜡笔小新 2024-11-23 11:10:38
java
重学前端学习笔记（二十四）HTML里的链接元素

笔记说明重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系& ... [详细]

蜡笔小新 2024-11-23 10:34:04
java
Java虚拟机及其发展历程

Java虚拟机（JVM）是每个Java开发者日常工作中不可或缺的一部分，但其背后的运作机制却往往显得神秘莫测。本文将探讨Java及其虚拟机的发展历程，帮助读者深入了解这一关键技术。 ... [详细]

蜡笔小新 2024-11-23 08:59:58
build
[附源码]计算机毕业设计JAVAjsp医药管理信息系统

[附源码]计算机毕业设计JAVAjsp医药管理信息系统项目运行环境配置：Jdk1.8Tomcat7.0MysqlHBuilderX（Webstor ... [详细]

蜡笔小新 2024-11-22 18:50:22

Bleach1121

这个家伙很懒，什么也没留下！

Tags | 热门标签

RankList | 热门文章