Android App中实现简单的刮刮卡抽奖效果的实例详解

作者:匆忙拥挤repeat 时间:2023-07-12 19:06:44 

主要思想:
将一个view设计成多层:背景层,含中奖信息等;
遮盖层,用于刮奖,使用关联一个Bitmap的Canvas
在该Bitmap上,使用它的canvas.drawPath的api来处理 手势滑动(类似刮奖的动作)
使用paint.setXfermode 来进行消除手势滑动区域

Android App中实现简单的刮刮卡抽奖效果的实例详解


public class GuaView extends View {

private Bitmap mBitmap; //遮盖的图层
 private Canvas mCanvas; //绘制遮盖图层
 private Paint mOuterPaint;
 private Path mPath;
 private float mLastX;
 private float mLastY;

private Bitmap mCoverBitmap; //遮盖图
 private int mWidth, mHeight;
 private Paint mInnerPaint;
 private String mInfo;

public GuaView(Context context) {
   this(context, null);
 }

public GuaView(Context context, AttributeSet attrs) {
   super(context, attrs);

init();
 }

private void init() {
   mPath = new Path();
   mOuterPaint = new Paint();
   mInnerPaint = new Paint();
   mCoverBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.fg_guaguaka);

mInfo = "¥ 5 0 0";
 }

@Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
   super.onMeasure(widthMeasureSpec, heightMeasureSpec);
   mWidth = mCoverBitmap.getWidth();
   mHeight = mCoverBitmap.getHeight();
   setMeasuredDimension(mWidth, mHeight);

mBitmap = Bitmap.createBitmap(mWidth, mHeight, Bitmap.Config.ARGB_8888);
   mCanvas = new Canvas(mBitmap);
   mCanvas.drawBitmap(mCoverBitmap, 0, 0, null);

setOuterPaint();
   setInnerPaint();

}

private void setInnerPaint() {
   mInnerPaint.setColor(Color.RED);
   mInnerPaint.setStyle(Paint.Style.STROKE);
   mInnerPaint.setStrokeCap(Paint.Cap.ROUND);
   mInnerPaint.setStrokeJoin(Paint.Join.ROUND);
   mInnerPaint.setAntiAlias(true);
   mInnerPaint.setDither(true); //防抖
   mInnerPaint.setStrokeWidth(5);
   mInnerPaint.setTextSize(100);
   mInnerPaint.setTextAlign(Paint.Align.CENTER);
 }

private void setOuterPaint() {
   mOuterPaint.setColor(Color.GREEN);
   mOuterPaint.setStyle(Paint.Style.STROKE);
   mOuterPaint.setStrokeCap(Paint.Cap.ROUND);
   mOuterPaint.setStrokeJoin(Paint.Join.ROUND);
   mOuterPaint.setAntiAlias(true);
   mOuterPaint.setDither(true); //防抖
   mOuterPaint.setStrokeWidth(20);
 }

@Override //Path
 public boolean onTouchEvent(MotionEvent event) {
   float x = event.getX();
   float y = event.getY();
   switch (event.getAction()) {
     case MotionEvent.ACTION_DOWN:
       mLastX = x;
       mLastY = y;
       mPath.moveTo(x, y);
       break;
     case MotionEvent.ACTION_MOVE:
       float deltaX = Math.abs(x - mLastX);
       float deltaY = Math.abs(y - mLastY);
       if (deltaX > 5 || deltaY > 5) {
         mPath.lineTo(x, y);
       }
       mLastX = x;
       mLastY = y;
       break;
     case MotionEvent.ACTION_UP:
       break;
   }
   invalidate();//调用onDraw
   return true;
 }

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

canvas.drawColor(Color.parseColor("#bbbbbb")); //背景底色 灰色
   canvas.drawText(mInfo, mWidth / 2, mHeight / 4 * 3, mInnerPaint); //绘制文本
   canvas.drawBitmap(mBitmap, 0, 0, null); //绘制mBitmap  这是一个可变的bitmap,通过mCanvas绘制,首先绘制了mCoverBitmap
   drawPath();

}

private void drawPath() {
   //使用该mode:dst和src相交后, 只保留dst,且除去相交的部份
   mOuterPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));
   mCanvas.drawPath(mPath, mOuterPaint);
 }
}

Paint.Join 连续画笔衔接时:

  •         MITER 在外边缘以一个锐角连接

  •         ROUND 以圆弧

  •         BEVEL 以直线

Paint.Cap 指定对于 线和路径(lines and paths) 的开始和结束点的处理方式:

  •         BUTT  ends with the path  不超越它

  •         ROUND  with the center at the end of the path 半圆

  •         SQUARE  with the center at the end of the path 方形

标签:Android,刮刮卡
0
投稿

猜你喜欢

  • SpringBoot的API文档生成工具SpringDoc使用详解

    2021-11-09 07:15:45
  • WCF如何使用动态代理精简代码架构

    2023-09-17 16:25:42
  • c#读取XML多级子节点

    2023-10-10 21:03:44
  • java 文件流的处理方式 文件打包成zip

    2022-07-08 12:43:03
  • springmvc如何使用POJO作为参数

    2021-06-02 00:29:46
  • SpringBoot登录用户权限拦截器

    2022-07-15 04:18:04
  • Java内置GUI Frame类的使用

    2021-10-25 18:06:49
  • Java并发内存模型详情

    2023-06-04 23:50:23
  • C#模板方法模式(Template Method Pattern)实例教程

    2022-09-12 02:59:23
  • java实现小猫钓鱼游戏

    2021-10-10 19:59:48
  • Android 实现会旋转的饼状统计图实例代码

    2022-04-08 09:38:50
  • VS2019打包WPF安装程序最新教程(图文详解)

    2021-11-18 15:52:08
  • 教你怎么用Idea打包jar包

    2023-03-15 03:30:51
  • C#操作DataTable的实现步骤

    2021-06-04 13:20:23
  • java多线程之铁路售票系统

    2022-01-31 12:25:14
  • RxJava+Retrofit实现网络请求封装的方法

    2023-08-13 19:39:13
  • Mybatis-Plus字段策略FieldStrategy的使用

    2023-12-13 14:44:41
  • 深入理解Android Bitmap

    2023-07-29 08:52:14
  • Java之操作Redis案例讲解

    2023-06-18 03:48:41
  • java LeetCode刷题稍有难度的贪心构造算法

    2022-01-06 20:56:21
  • asp之家 软件编程 m.aspxhome.com