绘制箭头时的偏移路径

时间:2019-04-11 13:16:45

标签: java android android-canvas

我通过执行以下操作来绘制箭头:

id  key colorid amount
1   Red 1110    24
1   Red 1147    22

这是我得到的结果:

arrow image

如您所见,我画的线伸出在箭头的后面。

我的问题:

我该如何修改当前需要的内容,以免在箭头的后面看到该线。

我曾尝试deltaX = this.mPoints[1].x - this.mPoints[3].x; deltaY = this.mPoints[1].y - this.mPoints[3].y; frac = (float) 0.1; point_x_1 = this.mPoints[3].x + (1 - frac) * deltaX + frac * deltaY; point_y_1 = this.mPoints[3].y + (1 - frac) * deltaY - frac * deltaX; point_x_2 = this.mPoints[1].x; point_y_2 = this.mPoints[1].y; point_x_3 = this.mPoints[3].x + (1 - frac) * deltaX - frac * deltaY; point_y_3 = this.mPoints[3].y + (1 - frac) * deltaY + frac * deltaX; Path path = new Path(); path.setFillType(Path.FillType.EVEN_ODD); path.moveTo(point_x_1, point_y_1); path.lineTo(point_x_2, point_y_2); path.lineTo(point_x_3, point_y_3); path.lineTo(point_x_1, point_y_1); path.lineTo(point_x_1, point_y_1); path.close(); canvas.drawLine(this.mPoints[3].x, this.mPoints[3].y, this.mPoints[1].x, this.mPoints[1].y, this.mPaint); canvas.drawPath(path, mPaint); 使用各种值,但是由于线的角度每次都会改变,所以它没有用。

1 个答案:

答案 0 :(得分:1)

使线条在当前绘制线条的90%处结束(这是1 - frac,因此线条应在箭头三角形的底部结束):

deltaX = this.mPoints[1].x - this.mPoints[3].x;
deltaY = this.mPoints[1].y - this.mPoints[3].y;

frac = (float) 0.1;

point_x_1 = this.mPoints[3].x + (1 - frac) * deltaX + frac * deltaY;
point_y_1 = this.mPoints[3].y + (1 - frac) * deltaY - frac * deltaX;

point_x_2 = this.mPoints[1].x;
point_y_2 = this.mPoints[1].y;

point_x_3 = this.mPoints[3].x + (1 - frac) * deltaX - frac * deltaY;
point_y_3 = this.mPoints[3].y + (1 - frac) * deltaY + frac * deltaX;

line_end_x = this.mPoints[1].x - frac * deltaX; // This
line_end_y = this.mPoints[1].y - frac * deltaY;

Path path = new Path();
path.setFillType(Path.FillType.EVEN_ODD);
path.moveTo(point_x_1,  point_y_1);
path.lineTo(point_x_2, point_y_2);
path.lineTo(point_x_3, point_y_3);
path.lineTo(point_x_1, point_y_1);
path.lineTo(point_x_1, point_y_1);

path.close();

// line_end_* instead of this.mPoints[1].*
canvas.drawLine(this.mPoints[3].x, this.mPoints[3].y, line_end_x, line_end_y, this.mPaint);
canvas.drawPath(path, mPaint);

我一直无法测试数学,但我认为这是正确的。试试看。