自定义查看drawArc,检测用户在弧的绘制path上的触摸

我正在创build一个自定义视图,它是一种弧形滑块进度视图。我可以通过计算扫描来基于用户触摸位置(在x轴上)绘制更多或更less的弧线,我首先通过计算百分比用户沿着x轴触摸的地方…… 0%将会在左边,而100%将会在右边。

我想要更进一步,而不是基于用户按下的x坐标绘制弧线,我只想在用户触摸到实际的弧线绘制path时使其移动,因此更逼真。 我还是新来的自定义意见,我的math是有限的,但如果我得到一些提示,我将不胜感激

当用户沿着x轴以百分比移动手指在矩形区域时的外观

class ArcProgress extends View { Context cx; float width; float height; float center_x, center_y; final RectF oval = new RectF(); final RectF touchArea = new RectF(); float sweep = 0; float left, right; int percent = 0; public ArcProgress(Context context) { super(context); cx = context; } public int getPercentage() { return percent; } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); setBackgroundColor(0xfff0ebde); width = (float) getWidth(); height = (float) getHeight(); float radius; if (width > height) { radius = height / 3; } else { radius = width / 3; } Paint paint = new Paint(); paint.setAntiAlias(true); paint.setColor(0xffd2c8b6); paint.setStrokeWidth(35); paint.setStyle(Paint.Style.STROKE); center_x = width / 2; center_y = height / 2; left = center_x - radius; float top = center_y - radius; right = center_x + radius; float bottom = center_y + radius; oval.set(left, top, right, bottom); //this is the background arc, it remains constant canvas.drawArc(oval, 180, 180, false, paint); paint.setStrokeWidth(10); paint.setColor(0xffe0524d); //this is the red arc whichhas its sweep argument manipulated by on touch canvas.drawArc(oval, 180, sweep, false, paint); } @Override public boolean onTouchEvent(MotionEvent event) { if (event.getAction() == MotionEvent.ACTION_MOVE) { float xPosition = event.getX(); float yPosition = event.getY(); if (oval.contains(xPosition, yPosition)) { float x = xPosition - left; float s = x * 100; float b = s / oval.width(); percent = Math.round(b); sweep = (180 / 100.0f) * (float) percent; invalidate(); } else { if (xPosition < left) { percent = 0; sweep = (180 / 100.0f) * (float) percent; invalidate(); } if (xPosition > right) { percent = 100; sweep = (180 / 100.0f) * (float) percent; invalidate(); } } } return true; } } 

Solutions Collecting From Web of "自定义查看drawArc,检测用户在弧的绘制path上的触摸"

这对你有用吗? 你不需要很多math。 您可以计算触摸点距圆弧中心的距离(这是一个很容易的圆圈),并与您使用的半径进行比较。 这将告诉你,如果点在弧(几乎,见下面的全部情况)。

 Point touchEv = ...; Point circleCenter = ...; //the radius of the circle you used to draw the arc float circleRadius = ...; //how far from the arc should a touch point treated as it's on the arc float maxDiff = getResources().getDimension(R.dimen.max_diff_dp); //calculate the distance of the touch point from the center of your circle float dist = Math.pow(touchEv.x-circleCenter.x,2) + Math.pow(touchEv.y- circleCenter.y,2) dist = Math.sqrt(dist); //We also need the bounding rect of the top half of the circle (the visible arc) Rect topBoundingRect = new Rect(circleCenter.x - circleRadius, circleCenter.y - circleRadius, circleCenter.x + circleRadius, circleCenter.y); if (Math.abs(dist - circleRadius) <= maxDiff && topBoundingRect.contains(touchEv.x, touchEv.y)) { // the user is touching the arc } 

我只想在用户触摸实际弧线path时才移动它

onTouchEvent()的开始,你需要检查xPositionyPosition是否满足某些条件。 如果是的话,你做的东西,你现在正在做的。 如果不是,则return true

条件:

我们要检查x,y是否在那个灰色的弧形背景中:

在这里输入图像说明

我们计算从(x,y)到中心点(a,b)的距离:

 final dist = distance(x, y, a, b) 

distance()是点(x,y)和(a,b)之间的简单欧式距离:

 double distance(int x, int y, int a, int b) { return Math.sqrt((x - a) * (x - a) + (y - b) * (y - b)); } 

如果y > Y && dist >= r && dist <= R ,那么x,y在那个灰色圆弧背景中。