Android App中實(shí)現(xiàn)簡(jiǎn)單的刮刮卡抽獎(jiǎng)效果的實(shí)例詳解
主要思想:
將一個(gè)view設(shè)計(jì)成多層:背景層,含中獎(jiǎng)信息等;
遮蓋層,用于刮獎(jiǎng),使用關(guān)聯(lián)一個(gè)Bitmap的Canvas
在該Bitmap上,使用它的canvas.drawPath的api來(lái)處理 手勢(shì)滑動(dòng)(類(lèi)似刮獎(jiǎng)的動(dòng)作)
使用paint.setXfermode 來(lái)進(jìn)行消除手勢(shì)滑動(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,通過(guò)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ù)畫(huà)筆銜接時(shí):
- MITER 在外邊緣以一個(gè)銳角連接
- ROUND 以圓弧
- BEVEL 以直線
Paint.Cap 指定對(duì)于 線和路徑(lines and paths) 的開(kāi)始和結(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)盤(pán)
- Android自定義View實(shí)現(xiàn)抽獎(jiǎng)轉(zhuǎn)盤(pán)
- Android自定義View實(shí)現(xiàn)QQ運(yùn)動(dòng)積分轉(zhuǎn)盤(pán)抽獎(jiǎng)功能
- Android抽獎(jiǎng)輪盤(pán)的制作方法
- Android使用surfaceView自定義抽獎(jiǎng)大轉(zhuǎn)盤(pán)
- Android打造流暢九宮格抽獎(jiǎng)活動(dòng)效果
- Android中利用SurfaceView制作抽獎(jiǎng)轉(zhuǎn)盤(pán)的全流程攻略
- Android簡(jiǎn)單實(shí)現(xiàn)圓盤(pán)抽獎(jiǎng)界面
- Android實(shí)現(xiàn)九宮格抽獎(jiǎng)
相關(guān)文章
分享40條Android開(kāi)發(fā)的優(yōu)化建議
這篇文章主要為大家詳細(xì)介紹了40條Android開(kāi)發(fā)的優(yōu)化建議,幫助大家更好的開(kāi)發(fā)Android項(xiàng)目,感興趣的小伙伴們可以參考一下2016-08-08Android編程之點(diǎn)擊按鈕的響應(yīng)方式小結(jié)【3種方式】
這篇文章主要介紹了Android編程之點(diǎn)擊按鈕的響應(yīng)方式,結(jié)合實(shí)例形式分析總結(jié)了常用的三種按鈕響應(yīng)方式,需要的朋友可以參考下2017-02-02Flutter?DateTime獲取本月的開(kāi)始時(shí)間與結(jié)束時(shí)間方法
這篇文章主要為大家介紹了Flutter?DateTime獲取本月的開(kāi)始時(shí)間與結(jié)束時(shí)間方法示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步早日升職加薪2023-05-05超好看的下拉刷新動(dòng)畫(huà)Android代碼實(shí)現(xiàn)
超好看的下拉刷新動(dòng)畫(huà)Android代碼實(shí)現(xiàn),效果簡(jiǎn)單大方,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-01-01親自動(dòng)手實(shí)現(xiàn)Android App插件化
這篇文章主要教大家親自動(dòng)手實(shí)現(xiàn)Android App插件化,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12Android二級(jí)緩存加載圖片實(shí)現(xiàn)照片墻功能
這篇文章主要為大家詳細(xì)介紹了Android二級(jí)緩存加載圖片實(shí)現(xiàn)照片墻功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07Android 開(kāi)機(jī)直接運(yùn)行app并當(dāng)做手機(jī)桌面的實(shí)例
今天小編就為大家分享一篇Android 開(kāi)機(jī)直接運(yùn)行app并當(dāng)做手機(jī)桌面的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08