Android App 에서 간단 한 스 크 래 치 카드 추첨 효 과 를 실현 하 는 실례 상세 설명

주요 사상:
하나의 view 를 다 층 으로 디자인 합 니 다.배경 층,당 첨 정보 등 이 있 습 니 다.
커버 층,스 크 래 치 에 사용,Bitmap 와 연 결 된 Canvas 사용
이 Bitmap 에 서 는 canvas.drawPath api 를 사용 하여 제스처 가 미 끄 러 지 는 것 을 처리 합 니 다.
paint.setXfermode 를 사용 하여 제스처 슬라이딩 영역 을 제거 합 니 다.

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 통로 사각형