自定义view实现刮刮乐

2024-06-20 03:58
文章标签 实现 自定义 view 刮乐

本文主要是介绍自定义view实现刮刮乐,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在这里插入图片描述

  • 分析实现原理
    1、首先最上层是一个颜色层
    2、其次就是文字背景 当然也可以定义一些比较丰富的样式
    3、最后就是手势实现一个橡皮檫一样的功能
  • 其实整个功能主要就是这个橡皮檫比较难以实现点,如果了解PorterDuffXfermode的使用那么就简单了,首先看一张经典图片:
    在这里插入图片描述
    这张图片就是一个求各种交集,其中比较常用的src_in 和 DstIn,通常用来实现圆形、圆角或者奇形怪状的图,

定义几个自定义的属性

declare-styleable name="GuaGuaLeView"><attr name="paintWidth" format="integer"/><attr name="guaGuaBgColor" format="color"/><attr name="bgId" format="reference"/></declare-styleable>

layout布局使用

    <com.XXX.zdydemo1.view.GuaGuaLeViewandroid:id="@+id/mGuaGuaLeView"android:layout_width="match_parent"android:layout_height="wrap_content"app:guaGuaBgColor="@color/colorAccent"app:paintWidth="50"app:bgId="@mipmap/a0"/>

自定义GuaGuaLeView

public class GuaGuaLeView extends View {private Bitmap mBGBitmap;private Bitmap mOutBitmap;private Paint mPaint ;private Path mPath;private Canvas mCanvas;/**画笔的宽度*/int paintWidth = 80;/**刮刮背景色*/int guaGuaBgColor = Color.GRAY;/**默认图*/int bgId = R.mipmap.a0;public GuaGuaLeView(Context context) {this(context,null);}public GuaGuaLeView(Context context, @Nullable AttributeSet attrs) {this(context, attrs,0);}ViewTreeObserver.OnGlobalLayoutListener layoutListener=new ViewTreeObserver.OnGlobalLayoutListener() {@Overridepublic void onGlobalLayout() {}};public GuaGuaLeView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);getViewTreeObserver().addOnGlobalLayoutListener(layoutListener);mBGBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.a0);TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.GuaGuaLeView, 0, defStyleAttr);int count = array.getIndexCount();for (int i = 0 ; i < count ; i++){int attr = array.getIndex(i);switch (attr){case R.styleable.GuaGuaLeView_guaGuaBgColor:guaGuaBgColor = array.getColor(attr,Color.GRAY);break;case R.styleable.GuaGuaLeView_paintWidth:paintWidth =  array.getInt(R.styleable.GuaGuaLeView_paintWidth,paintWidth);break;case R.styleable.GuaGuaLeView_bgId:bgId = array.getResourceId(attr,R.mipmap.a0);break;}}array.recycle();init();initPaint();}/*** @param mBGBitmap*/public void setmBGBitmap(Bitmap mBGBitmap) {this.mBGBitmap = mBGBitmap;}private void init() {mBGBitmap = BitmapFactory.decodeResource(getResources(), bgId);mOutBitmap = Bitmap.createBitmap(mBGBitmap.getWidth(),mBGBitmap.getHeight(), Bitmap.Config.ARGB_8888);mCanvas=new Canvas(mOutBitmap);mCanvas.drawColor(guaGuaBgColor);}private void initPaint() {mPath = new Path();mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));mPaint.setStrokeJoin(Paint.Join.ROUND);mPaint.setStrokeCap(Paint.Cap.ROUND);mPaint.setStyle(Paint.Style.STROKE);mPaint.setColor(Color.TRANSPARENT);mPaint.setStrokeWidth(paintWidth);mPaint.setAntiAlias(true);mPaint.setDither(true);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);if (mBGBitmap!=null){setMeasuredDimension(mBGBitmap.getWidth(),mBGBitmap.getHeight());}}@Overridepublic boolean onTouchEvent(MotionEvent event) {switch (event.getAction()){case MotionEvent.ACTION_DOWN:mPath.reset();mPath.moveTo(event.getX(),event.getY());break;case MotionEvent.ACTION_MOVE:mPath.lineTo(event.getX(),event.getY());mCanvas.drawPath(mPath,mPaint);invalidate();break;case MotionEvent.ACTION_UP:case MotionEvent.ACTION_CANCEL:break;}return true;}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);Paint paint=new Paint();paint.setColor(Color.BLACK);paint.setStrokeWidth(2);paint.setStyle(Paint.Style.FILL_AND_STROKE);paint.setTextSize(80);String s = "恭喜中奖了";Rect rect = new Rect();paint.getTextBounds(s,0,s.length(),rect);canvas.drawBitmap(mBGBitmap,0,0,paint);canvas.drawText(s,(mBGBitmap.getWidth()-rect.right)/2,(mBGBitmap.getHeight()-rect.bottom)/2,paint);canvas.drawBitmap(mOutBitmap,0,0,paint);}/*** @param var* @return*/public int dpToPx(int var){float density = getResources().getDisplayMetrics().density;return (int) (density*var + 0.5f);}
}

这篇关于自定义view实现刮刮乐的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1077038

相关文章

基于C++的UDP网络通信系统设计与实现详解

《基于C++的UDP网络通信系统设计与实现详解》在网络编程领域,UDP作为一种无连接的传输层协议,以其高效、低延迟的特性在实时性要求高的应用场景中占据重要地位,下面我们就来看看如何从零开始构建一个完整... 目录前言一、UDP服务器UdpServer.hpp1.1 基本框架设计1.2 初始化函数Init详解

Java中Map的五种遍历方式实现与对比

《Java中Map的五种遍历方式实现与对比》其实Map遍历藏着多种玩法,有的优雅简洁,有的性能拉满,今天咱们盘一盘这些进阶偏基础的遍历方式,告别重复又臃肿的代码,感兴趣的小伙伴可以了解下... 目录一、先搞懂:Map遍历的核心目标二、几种遍历方式的对比1. 传统EntrySet遍历(最通用)2. Lambd

springboot+redis实现订单过期(超时取消)功能的方法详解

《springboot+redis实现订单过期(超时取消)功能的方法详解》在SpringBoot中使用Redis实现订单过期(超时取消)功能,有多种成熟方案,本文为大家整理了几个详细方法,文中的示例代... 目录一、Redis键过期回调方案(推荐)1. 配置Redis监听器2. 监听键过期事件3. Redi

SpringBoot全局异常拦截与自定义错误页面实现过程解读

《SpringBoot全局异常拦截与自定义错误页面实现过程解读》本文介绍了SpringBoot中全局异常拦截与自定义错误页面的实现方法,包括异常的分类、SpringBoot默认异常处理机制、全局异常拦... 目录一、引言二、Spring Boot异常处理基础2.1 异常的分类2.2 Spring Boot默

基于SpringBoot实现分布式锁的三种方法

《基于SpringBoot实现分布式锁的三种方法》这篇文章主要为大家详细介绍了基于SpringBoot实现分布式锁的三种方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、基于Redis原生命令实现分布式锁1. 基础版Redis分布式锁2. 可重入锁实现二、使用Redisso

SpringBoo WebFlux+MongoDB实现非阻塞API过程

《SpringBooWebFlux+MongoDB实现非阻塞API过程》本文介绍了如何使用SpringBootWebFlux和MongoDB实现非阻塞API,通过响应式编程提高系统的吞吐量和响应性能... 目录一、引言二、响应式编程基础2.1 响应式编程概念2.2 响应式编程的优势2.3 响应式编程相关技术

C#实现将XML数据自动化地写入Excel文件

《C#实现将XML数据自动化地写入Excel文件》在现代企业级应用中,数据处理与报表生成是核心环节,本文将深入探讨如何利用C#和一款优秀的库,将XML数据自动化地写入Excel文件,有需要的小伙伴可以... 目录理解XML数据结构与Excel的对应关系引入高效工具:使用Spire.XLS for .NETC

自定义注解SpringBoot防重复提交AOP方法详解

《自定义注解SpringBoot防重复提交AOP方法详解》该文章描述了一个防止重复提交的流程,通过HttpServletRequest对象获取请求信息,生成唯一标识,使用Redis分布式锁判断请求是否... 目录防重复提交流程引入依赖properties配置自定义注解切面Redis工具类controller

Nginx更新SSL证书的实现步骤

《Nginx更新SSL证书的实现步骤》本文主要介绍了Nginx更新SSL证书的实现步骤,包括下载新证书、备份旧证书、配置新证书、验证配置及遇到问题时的解决方法,感兴趣的了解一下... 目录1 下载最新的SSL证书文件2 备份旧的SSL证书文件3 配置新证书4 验证配置5 遇到的http://www.cppc

Nginx之https证书配置实现

《Nginx之https证书配置实现》本文主要介绍了Nginx之https证书配置的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起... 目录背景介绍为什么不能部署在 IIS 或 NAT 设备上?具体实现证书获取nginx配置扩展结果验证