Android中的刮刮卡效果

时间:2015-08-19 07:54:32

标签: android android-canvas android-bitmap

我想在android中设计一个 Scratch Card-like 效果。是否可以通过在位图背面堆叠优惠券并将CustomCanvas的颜色设置为灰色或其他东西来使用Framelayout或RelativeLayout执行此操作。我试过这样做,但我无法从背面获得叠加的图像。背景只是变白了,没有别的。我然后尝试了COLOR.TRANSPARENT,根本没有Scratch。我怎样才能做到这一点?

以下是扩展View类的CustomCanvas类:

public class CanvasView extends View {

    public int width,height;
    private Bitmap bitmap;
    private Canvas canvas;
    Context context;
    private Path mPath;
    private Paint paint;
    private float mX, mY;
    private static final float TOLERANCE = 5;


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

        mPath = new Path();
        paint = new Paint();
        paint.setAntiAlias(true);
        paint.setColor(Color.WHITE);
        paint.setStyle(Paint.Style.STROKE);
     paint.setStrokeJoin(Paint.Join.ROUND);


        paint.setStrokeWidth(100f);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);

        bitmap = Bitmap.createBitmap(w,h, Bitmap.Config.ARGB_8888);

        canvas = new Canvas(bitmap);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawBitmap(bitmap,0,0,paint);
        canvas.drawPath(mPath, paint);
    }

    private void startTouch(float x, float y){
        mPath.moveTo(x,y);
        mX = x;
        mY = y;
    }

    private void moveTouch(float x, float y){
        float dx = Math.abs(x-mX);
        float dy = Math.abs(y-mY);
        if(dx >= TOLERANCE || dy >= TOLERANCE){
            mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
            mX = x;
            mY = y;
        }
    }

     public void clearCanvas(){
         mPath.reset();
         invalidate();
     }

    private void upTouch(){
        mPath.lineTo(mX,mY);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
       float x = event.getX();
       float y = event.getY();

        switch(event.getAction()){
            case MotionEvent.ACTION_DOWN:
                   startTouch(x,y);
                    invalidate();
                break;
            case MotionEvent.ACTION_MOVE:
                moveTouch(x,y);
                invalidate();
                break;
            case MotionEvent.ACTION_UP:
                upTouch();
                float r = calculatingPercentage(bitmap.getWidth(),bitmap.getHeight());
                if(calculatingPercentage(bitmap.getWidth(),bitmap.getHeight()) >= 50.00){
                    Toast.makeText(getContext(),"Done 50%",Toast.LENGTH_SHORT).show();
                }
                invalidate();
                break;

        }
        return true;
    }
//FUNCTION I WAS USING TO CALCULATE THE SCRATCHED AREA'S PERCENTAGE

    private float calculatingPercentage(int width,int height){
        int[] xArray = new int[100];
        int[] yArray = new int[100];

        float percentTransparent;
        Random r = new Random();
        for(int i = 0; i<100;i++){
            xArray[i] = r.nextInt(width - 10) +10;
        }
        for(int i = 0; i<100;i++){
            yArray[i] = r.nextInt(height - 10) +10;
        }
        int pixelCount = 0;
        for(int i = 0; i<100;i++){
            int x = xArray[i];
            int y = yArray[i];
            int color = Color.WHITE;
            int black = Color.BLACK;
            if(bitmap.getPixel(xArray[i],yArray[i]) == Color.WHITE){

                pixelCount++;


            }

        }

        percentTransparent = (pixelCount/100);
        return percentTransparent;

    }
}

调用Canvasview类的ActivityB:

public class ActivityB extends Activity {

    private CanvasView customCanvas;
    private Button bt;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.fragment_a);

        customCanvas = (CanvasView) findViewById(R.id.signature_canvas);
        bt = (Button) findViewById(R.id.buttonAgain);
        bt.setVisibility(View.VISIBLE);
        bt.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                clearCanvas();
            }
        });


    }
    public void clearCanvas(){
        customCanvas.clearCanvas();

    }
}

这是我的fragment_a.xml布局:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/firstFrame"
    android:background="#F07818"
    tools:context="com.example.dremer.fragmentspractice.FragmentA">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="40dp"
        android:src="@drawable/benz"/>
    <com.example.dremer.fragmentspractice.CanvasView
    android:id="@+id/signature_canvas"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:textColor="#FFFFFF"
    android:background="#FFFFFF"/>

    <Button
        android:id="@+id/buttonAgain"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Scratch Again"
        android:layout_gravity="bottom|center"
        android:paddingBottom="20dp"/>



</FrameLayout>

你能帮帮我吗?

谢谢!

0 个答案:

没有答案