2013-02-15 88 views
3

弧在我的Android应用程序,我想提供跟踪信功能,如以下的图像:Android的画布 - 之间画弧点和删除路径

enter image description here

在这里,我想提供一个跟踪字母D,为此我需要在用户开始在弧上移动手指时在两点之间绘制弧线。在这里,如果用户从开始点开始移动手指并在结束点停止,那么只有它应该在这些点之间绘制弧线。在弧线路径上移动手指时也应该显示弧线。为此,我写了下面的代码。我面临的问题是,当在弧线路径上触发ACTION_UP事件时,它仍然在画布上显示弧形绘图。但是,如果在弧路径之间触发事件,我想从路径中移除该绘图。

这里是我的代码:

public class DrawView extends View implements OnTouchListener { 

List<Point> pointsD = new ArrayList<Point>(); 
pointsD.add(new Point(520, 70)); 
    pointsD.add(new Point(520, 335)); 
    pointsD.add(new Point(520, 70)); 
    pointsD.add(new Point(520, 335)); 

public boolean onTouch(View view, MotionEvent event) { 

    float x = event.getX(); 
    float y = event.getY(); 

    switch (event.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
     touch_start(x, y); 
     invalidate(); 
     break; 
    case MotionEvent.ACTION_MOVE: 
     touch_move(x, y); 
     invalidate(); 
     break; 
    case MotionEvent.ACTION_UP: 
     touch_up(x, y); 
     invalidate(); 
     break; 
    default: 
     break; 
    } 
    return true; 
} 
private void touch_start(float x, float y) { 
     if (checkPoint(x, y, mLastPointIndex)) { 
       mPath.reset(); 
      isPathStarted = true; 
      } else { 
      isPathStarted = false; 
     } 
} 

private void touch_move(float x, float y) { 

    if (isPathStarted) { 
     mPath.reset(); 
     Point p = null; 
     p = pointsD.get(mLastPointIndex); 
     mPath.moveTo(p.x, p.y); 
      float radius = 1; 
     RectF oval = new RectF(); 
     oval.set(scalePointX((int) (486 - radius)),scalePointY(70),        scalePointX((int) (686 + radius)), 
         scalePointY((int) (334 + radius))); 
     if (sweepAngelD <= 180 && startAngleD <= 360) { 
      mPath.arcTo(oval, startAngleD, sweepAngelD, true); 
     sweepAngelD += 1; 
     startAngleD += 2; 
     mCanvas.drawPath(mPath, mPaint); 
    } 
    mPath.reset(); 
} 

private void touch_up(float x, float y) { 
     mPath.reset(); 
      if (isPathStarted) { 
       float radius = 1; 
       RectF oval = new RectF(); 
       oval.set(scalePointX((int) (486 - radius)), 
         scalePointY(70), scalePointX((int) (686 + radius)), 
         scalePointY((int) (334 + radius))); 
       Point p = pointsD.get(mLastPointIndex); 
       mPath.moveTo(p.x, p.y); 
       mPath.arcTo(oval, startAngleD, sweepAngelD, true);     
       mCanvas.drawPath(mPath, mPaint); 
       mPath.reset(); 
       ++mLastPointIndex; 
      } else { 
       sweepAngelD = 1; 
       startAngleD = 270; 
       mPath.reset(); 
      } 
      isPathStarted = false; 
} 

private boolean checkPoint(float x, float y, int pointIndex){ 
if (pointIndex == pointsD.size()) { 
      // out of bounds 
      return false; 
     } 
     point = pointsD.get(pointIndex); 
     // EDIT changed point.y to poin.x in the first if statement 
     if (x > (point.x - TOUCH_TOLERANCE) 
       && x < (point.x + TOUCH_TOLERANCE)) { 
      if (y > (point.y - TOUCH_TOLERANCE) 
        && y < (point.y + TOUCH_TOLERANCE)) { 
       return true; 
      } 
     } 
    return false; 
} 
} 
+0

:请帮我,什么是scalePointX,在代码scalePointY方法?谢谢 – Arash 2013-12-26 10:43:12

+0

@arash此方法将根据不同的设备维护每个点的坐标值。 – zanky 2013-12-26 11:39:28

回答

3

我编辑下面我的代码,现在它正在..

public class DrawView extends View implements OnTouchListener { 

List<Point> pointsD = new ArrayList<Point>(); 
pointsD.add(new Point(520, 70)); 
    pointsD.add(new Point(520, 335)); 
    pointsD.add(new Point(520, 70)); 
    pointsD.add(new Point(520, 335)); 

public boolean onTouch(View view, MotionEvent event) { 

    float x = event.getX(); 
    float y = event.getY(); 

    switch (event.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
     touch_start(x, y); 
     invalidate(); 
     break; 
    case MotionEvent.ACTION_MOVE: 
     touch_move(x, y); 
     invalidate(); 
     break; 
    case MotionEvent.ACTION_UP: 
     touch_up(x, y); 
     invalidate(); 
     break; 
    default: 
     break; 
    } 
    return true; 
} 
private void touch_start(float x, float y) { 
     if (checkPoint(x, y, mLastPointIndex)) { 
       mPath.reset(); 
      isPathStarted = true; 
      } else { 
      isPathStarted = false; 
     } 
} 

private void touch_move(float x, float y) { 

    if (isPathStarted) { 
     mPath.reset(); 
     Point p = null; 
     p = pointsD.get(mLastPointIndex); 
     mPath.moveTo(p.x, p.y); 
      float radius = 1; 
     RectF oval = new RectF(); 
     oval.set(scalePointX((int) (486 - radius)),scalePointY(70),        scalePointX((int) (686 + radius)), 
         scalePointY((int) (334 + radius))); 
     if (sweepAngelD <= 180 && startAngleD <= 360) { 
      mPath.arcTo(oval, startAngleD, sweepAngelD, true); 
     sweepAngelD += 1; 
     startAngleD += 2; 

    } 
    mPath.reset(); 
} 

private void touch_up(float x, float y) { 
     mPath.reset(); 
      if (isPathStarted) { 
       float radius = 1; 
       RectF oval = new RectF(); 
       oval.set(scalePointX((int) (486 - radius)), 
         scalePointY(70), scalePointX((int) (686 + radius)), 
         scalePointY((int) (334 + radius))); 
       Point p = pointsD.get(mLastPointIndex); 
       mPath.moveTo(p.x, p.y); 
       mPath.arcTo(oval, startAngleD, sweepAngelD, true);     
       mCanvas.drawPath(mPath, mPaint); 
       mPath.reset(); 
       ++mLastPointIndex; 
      } else { 
       sweepAngelD = 1; 
       startAngleD = 270; 
       mPath.reset(); 
      } 
      isPathStarted = false; 
} 

private boolean checkPoint(float x, float y, int pointIndex){ 
if (pointIndex == pointsD.size()) { 
      // out of bounds 
      return false; 
     } 
     point = pointsD.get(pointIndex); 
     // EDIT changed point.y to poin.x in the first if statement 
     if (x > (point.x - TOUCH_TOLERANCE) 
       && x < (point.x + TOUCH_TOLERANCE)) { 
      if (y > (point.y - TOUCH_TOLERANCE) 
        && y < (point.y + TOUCH_TOLERANCE)) { 
       return true; 
      } 
     } 
    return false; 
} 
} 
+0

你是如何完成整件事的?我有一个显示跟踪字母的TextView,但我不确定如何在其上实现Canvas以允许用户绘制。 – Si8 2013-08-20 20:13:15

+1

我创建了png图像来显示跟踪信件并在画布上绘制该位图图像。之后,我在屏幕上绘制了不同的坐标点,然后我处理了点上的触摸功能,就像你在我的代码中看到的一样。 – zanky 2013-08-22 05:21:46

+0

我在我的App中得到了使用自定义字体显示的字母,但是您是如何得到'1'和'2'的? – Si8 2013-08-22 14:17:41