Android App中實(shí)現(xiàn)簡單的刮刮卡抽獎(jiǎng)效果的實(shí)例詳解
主要思想:
將一個(gè)view設(shè)計(jì)成多層:背景層,含中獎(jiǎng)信息等;
遮蓋層,用于刮獎(jiǎng),使用關(guān)聯(lián)一個(gè)Bitmap的Canvas
在該Bitmap上,使用它的canvas.drawPath的api來處理 手勢滑動(dòng)(類似刮獎(jiǎng)的動(dòng)作)
使用paint.setXfermode 來進(jìn)行消除手勢滑動(dòng)區(qū)域

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();//調(diào)用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 這是一個(gè)可變的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 連續(xù)畫筆銜接時(shí):
- MITER 在外邊緣以一個(gè)銳角連接
- ROUND 以圓弧
- BEVEL 以直線
Paint.Cap 指定對于 線和路徑(lines and paths) 的開始和結(jié)束點(diǎn)的處理方式:
- 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 實(shí)現(xiàn)九宮格抽獎(jiǎng)功能
- Android自定義view制作抽獎(jiǎng)轉(zhuǎn)盤
- Android自定義View實(shí)現(xiàn)抽獎(jiǎng)轉(zhuǎn)盤
- Android自定義View實(shí)現(xiàn)QQ運(yùn)動(dòng)積分轉(zhuǎn)盤抽獎(jiǎng)功能
- Android抽獎(jiǎng)輪盤的制作方法
- Android使用surfaceView自定義抽獎(jiǎng)大轉(zhuǎn)盤
- Android打造流暢九宮格抽獎(jiǎng)活動(dòng)效果
- Android中利用SurfaceView制作抽獎(jiǎng)轉(zhuǎn)盤的全流程攻略
- Android簡單實(shí)現(xiàn)圓盤抽獎(jiǎng)界面
- Android實(shí)現(xiàn)九宮格抽獎(jiǎng)
相關(guān)文章
Android實(shí)現(xiàn)日夜間模式的深入理解
相信Android的日間/夜間模式切換相信大家在平時(shí)使用 APP 的過程中都遇到過,比如知乎、簡書中就有相關(guān)的模式切換。實(shí)現(xiàn)日間/夜間模式切換的方案也有許多種,趁著今天有空來講一下日間/夜間模式切換的幾種實(shí)現(xiàn)方案,也可以做一個(gè)橫向的對比來看看哪種方案最好。2016-09-09
Android ViewPager實(shí)現(xiàn)智能無限循環(huán)滾動(dòng)回繞效果
這篇文章主要為大家詳細(xì)介紹了Android ViewPager實(shí)現(xiàn)智能無限循環(huán)滾動(dòng)回繞效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07
Android UI組件LinearLayout線性布局詳解
這篇文章主要為大家詳細(xì)介紹了AndroidUI組件LinearLayout線性布局,具有一定的實(shí)用性,感興趣的小伙伴們可以參考一下2016-08-08
Android開發(fā)實(shí)現(xiàn)按鈕點(diǎn)擊切換背景并修改文字顏色的方法
這篇文章主要介紹了Android開發(fā)實(shí)現(xiàn)按鈕點(diǎn)擊切換背景并修改文字顏色的方法,涉及Android界面布局與相關(guān)屬性設(shè)置技巧,需要的朋友可以參考下2018-01-01
Android日期和時(shí)間選擇器實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了Android日期和時(shí)間選擇器實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-11-11
Android利用ObjectAnimator實(shí)現(xiàn)ArcMenu
這篇文章主要為大家詳細(xì)介紹了Android利用ObjectAnimator實(shí)現(xiàn)ArcMenu的相關(guān)資料,感興趣的小伙伴們可以參考一下2016-07-07

