Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set validation in canvas android?

I am working on canvas application and I have created a canvas with color picker ,Undo,Redo and clear functions and it is also working fine.Now, I want to validate whether the user is currently drawing a line on the background line on the canvas.

For example, I am having a background image with dotted lines,now I want the user to draw on the dotted lines and I have to validate it whether it is correct or not? Is it possible in canvas and how can I proceed with this?

Could someone give any suggestion about this which will be really help full for me to proceed with next step in my application and my code is here,

public class HomeScreen extends Activity implements ColorPickerDialog.OnColorChangedListener {
    public int width;
    public int height;
    public Arrays paths1;
    private Bitmap mBitmap;
    private Canvas mCanvas;
    private Path mPath;
    private Paint mBitmapPaint;
    Context context;
    private Paint circlePaint;
    private Path circlePath;
    /* MyView mv; */
    DrawingPanel dp;
    AlertDialog dialog;
    private ArrayList<Path> undonePaths = new ArrayList<Path>();
    private ArrayList<Path> paths = new ArrayList<Path>();
    FrameLayout frmLayout;
    Canvas canvas;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_home_screen);
        dp = new DrawingPanel(this);

        frmLayout = (FrameLayout) findViewById(R.id.frameLayout);

        frmLayout.addView(dp);

        ((Button) findViewById(R.id.Clear)).setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                paths = new ArrayList<Path>();

                if (paths != null)
                    paths.clear();
                if (dp != null)
                    dp.invalidate();
            }
        });

        ((Button) findViewById(R.id.Undo)).setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                if (paths.size() > 0) {
                    undonePaths.add(paths.remove(paths.size() - 1));
                    dp.invalidate();
                }
            }
        });

        ((Button) findViewById(R.id.Redo)).setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                if (undonePaths.size() > 0) {
                    paths.add(undonePaths.remove(undonePaths.size() - 1));
                    dp.invalidate();
                }
            }
        });

        ((Button) findViewById(R.id.letters)).setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                startActivity(new Intent(HomeScreen.this, Letters.class));
            }
        });

        ((Button) findViewById(R.id.color)).setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                  mCanvas=new Canvas();
                new ColorPickerDialog(HomeScreen.this, HomeScreen.this, mPaint.getColor()).show();

            }
        });

        dp.setDrawingCacheEnabled(true);
        Bundle extras = getIntent().getExtras();
        Integer userName;
        if (extras != null) {
            userName = extras.getInt("name");
            // and get whatever type user account id is
        }

        dp.setBackgroundResource(R.drawable.atemplate);// set the back
        // ground if you wish
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setDither(true);
        mPaint.setColor(0xFFFF0000);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeJoin(Paint.Join.ROUND);
        mPaint.setStrokeCap(Paint.Cap.ROUND);
        mPaint.setStrokeWidth(20);

        mEmboss = new EmbossMaskFilter(new float[] { 1, 1, 1 }, 0.4f, 6, 3.5f);
        // mBlur = new BlurMaskFilter(8, BlurMaskFilter.Blur.NORMAL);
    }

    private Paint mPaint;
    private MaskFilter mEmboss;
    private MaskFilter mBlur;

    public void colorChanged(int color) {
        mPaint.setColor(color);
    }

    public class DrawingPanel extends View implements OnTouchListener {

        private Canvas mCanvas;
        private Path mPath;
        private Paint mPaint, circlePaint, outercirclePaint;

        // private ArrayList<Path> undonePaths = new ArrayList<Path>();
        private float xleft, xright, xtop, xbottom;

        public DrawingPanel(Context context) {
            super(context);
            setFocusable(true);
            setFocusableInTouchMode(true);
            this.setOnTouchListener(this);
            circlePaint = new Paint();
            mPaint = new Paint();
            outercirclePaint = new Paint();
            outercirclePaint.setAntiAlias(false);
            circlePaint.setAntiAlias(false);
            mPaint.setAntiAlias(false);
            mPaint.setColor(0xFF000000);
            outercirclePaint.setColor(0x44FFF000);
            circlePaint.setColor(0xF57F35);
            outercirclePaint.setStyle(Paint.Style.FILL_AND_STROKE);
            circlePaint.setStyle(Paint.Style.FILL);
            mPaint.setStyle(Paint.Style.STROKE);
            mPaint.setStrokeJoin(Paint.Join.MITER);
            mPaint.setStrokeCap(Paint.Cap.ROUND);
            mPaint.setStrokeWidth(10);
            outercirclePaint.setStrokeWidth(10);
            mCanvas = new Canvas();
            mPath = new Path();
            paths.add(mPath);
        }

        public void colorChanged(int color) {
            mPaint.setColor(color);
        }

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

        @Override
        protected void onDraw(Canvas canvas) {

            for (Path p : paths) {
                canvas.drawPath(p, mPaint);
            }

        }

        private float mX, mY;
        private static final float TOUCH_TOLERANCE = 0;

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

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

        private void touch_up() {
            mPath.lineTo(mX, mY);
            // commit the path to our offscreen
            mCanvas.drawPath(mPath, mPaint);
            // kill this so we don't double draw
            mPath = new Path();
            paths.add(mPath);
        }

        @Override
        public boolean onTouch(View arg0, MotionEvent event) {
            float x = event.getX();
            float y = event.getY();

            switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                // if (x <= cx+circleRadius+5 && x>= cx-circleRadius-5) {
                // if (y<= cy+circleRadius+5 && cy>= cy-circleRadius-5){
                // paths.clear();
                // return true;
                // }
                // }
                touch_start(x, y);
                invalidate();
                break;
            case MotionEvent.ACTION_MOVE:
                touch_move(x, y);
                invalidate();
                break;
            case MotionEvent.ACTION_UP:
                touch_up();
                invalidate();
                break;
            }
            return true;
        }
    }
}
like image 334
user2841300 Avatar asked Feb 27 '14 05:02

user2841300


2 Answers

Are you thinking to create a app like pattern locker which are in android devices, try to implement like this way.

@Override
public boolean onTouchEvent(MotionEvent event) {
    // MotionEvent object holds X-Y values
    if(event.getAction() == MotionEvent.ACTION_DOWN) {
        String text = "You click at x = " + event.getX() + " and y = " + event.getY();
        Toast.makeText(this, text, Toast.LENGTH_LONG).show();
    }

    return super.onTouchEvent(event);
}

this link may help

like image 81
Maveňツ Avatar answered Nov 17 '22 00:11

Maveňツ


Your programming skills are good. Difficulty here depends on how complicated the lines are. Have you tried saving the position of the dots? and then compare it to getX and getY when the user presses the screen.

like image 26
Murad Avatar answered Nov 17 '22 01:11

Murad