Wie zeichnen Sie eine gekrümmte Linie zwischen 2 Punkten auf Leinwand?

Habe ich versucht viele verschiedene Ansätze von Beispielen rund um das web, aber ich kann nicht scheinen, um diese zu arbeiten. Ich bin versucht zu machen, eine Methode, die zieht eine geschwungene Linie zwischen 2 Punkten auf einer Leinwand. Die Kurve sein sollte, definiert durch einen radius-parameter.

Unten ist mein Aktueller code.

public OverlayBuilder drawCurvedArrow(int startX, int startY, int endX, int endY, int curveRadius, int padding, int color) {
    PointF mPoint1 = new PointF(startX, startY);
    PointF mPoint2 = new PointF(endX, endY);
    Paint paint  = new Paint();
    paint.setAntiAlias(true);
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth(12);
    paint.setColor(color);
    Path myPath = new Path();

    myPath.moveTo(startX, startY);
    myPath.quadTo(mPoint1.x, mPoint1.y, mPoint2.x, mPoint2.y);
    canvas.drawPath(myPath, paint);

    return this;
}

Bearbeiten

Das problem ist, dass ich kann nicht herausfinden, wie die Krümmung der Linie, die gezeichnet wird auf der Leinwand.

Versuchen canvas.drawArc().
Willst du damit sagen, dass Sie möchten, zeichnen Sie einen BOGEN zwischen zwei Punkten?

InformationsquelleAutor Langkiller | 2016-05-25

Ich eine Lösung gefunden, um mein problem selbst. Obwohl es waren einige gute Antworten, Sie waren nicht eine genaue Lösung zu meinem speziellen problem.

Hier ist was ich getan habe:

Fand die Stelle zwischen den 2 gegebenen Punkten
Berechnet den Winkel von 90 Grad zwischen den 2 Punkten
Berechnet die Stelle X Pixel von der Mitte Punkt mit der berechneten Grad aus vor.
Verwendet " - Pfad.cubicTo" mit diesen 3 Punkten (Nimmt positive und negative Werte, um zu bestimmen, welchen Weg die Zeile sollte Kurve).

Hier ist mein code, falls jemand anderes ausgeführt werden soll in das gleiche problem:

public OverlayBuilder drawCurvedArrow(int x1, int y1, int x2, int y2, int curveRadius, int color, int lineWidth) {

    Paint paint  = new Paint();
    paint.setAntiAlias(true);
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth(lineWidth);
    paint.setColor(ContextCompat.getColor(context, color));

    final Path path = new Path();
    int midX            = x1 + ((x2 - x1) / 2);
    int midY            = y1 + ((y2 - y1) / 2);
    float xDiff         = midX - x1;
    float yDiff         = midY - y1;
    double angle        = (Math.atan2(yDiff, xDiff) * (180 / Math.PI)) - 90;
    double angleRadians = Math.toRadians(angle);
    float pointX        = (float) (midX + curveRadius * Math.cos(angleRadians));
    float pointY        = (float) (midY + curveRadius * Math.sin(angleRadians));

    path.moveTo(x1, y1);
    path.cubicTo(x1,y1,pointX, pointY, x2, y2);
    canvas.drawPath(path, paint);

    return this;
}

Und hier ist ein Beispiel, wie die Umsetzung aussieht:

Wie zeichnen Sie eine gekrümmte Linie zwischen 2 Punkten auf Leinwand?

Hey Mann, was ist "OverlayBuilder" hier????
Hey! OverlayBuilder ist eine Klasse, die Sie mit dem builder-Muster. In diesem Fall nutze ich es für das zeichnen und schreiben Sachen auf Ansichten.
Wow, Mann,eine der besten Antworten, die ich ' V gesehen,danke
Danke @ZachBublil. Ich bin froh, dass Sie es für nützlich befunden 🙂
Vielen Dank für die Bereitstellung einer Arbeitsweise aus der box, ohne Anpassung 100 Variablen ersten

InformationsquelleAutor Langkiller

0

Ich glaube, Sie sind mit falschen Methode zu diesem Zweck, einer der Lösungen, die ich vorschlagen kann, ist unten
```
float radius = 20;
final RectF oval = new RectF();
oval.set(point1.x - radius, point1.y - radius, point1.x + radius, point1.y+   radius);
Path myPath = new Path();
myPath.arcTo(oval, startAngle, -(float) sweepAngle, true);
```
und für die Berechnung der startAngle müssen Sie
```
int startAngle = (int) (180 / Math.PI * Math.atan2(point.y - point1.y, point.x - point1.x));
```
für sweapAngle finden Sie eine detaillierte Beschreibung hier.
- Danke! Ich habe gesehen, dass dieses Beispiel in einem anderen Beitrag. Was ist sweepAngle? Sollte ich berechne seinen Wert irgendwie?
- Okay, ich werde sehen, was sich auf das.. hmm in der Berechnung von startAngle, was die variable, die den Punkt? Und was ist Punkt1 int die erste code-snippet? Die eine ist start Punkt und dem end Punkt?
- Tanks a lot für deine Hilfe, sehr dankbar dafür.. Allerdings fand ich die Lösung zu meinem speziellen problem.
InformationsquelleAutor Atif Rehman
-1

Angenommen, Sie haben zwei Punkte mPoint1 und mPoint2
```
int w=canvas.getWidth();
int h=canvas.getHeight();
int w_2= (w / 2);
int h_2= (h / 2);
PointF mPoint1 = new PointF(0, 0); //starts at canvas left top
PointF mPoint2 = new PointF(w_2, h_2);//mid of the canvas
Path drawPath1 =drawCurve(mPoint1, mPoint2);
canvas.drawPath(drawPath1, paint);
```
Methode um die Linie zu zeichnen
```
private Path drawCurve(PointF mPointa, PointF mPointb) {
            Path myPath = new Path();
            myPath.moveTo(mPointa.x, mPointa.y);
            final float x2 = (mPointb.x + mPointa.x) / 3;
            final float y2 = (mPointb.y + mPointa.y) / 3;
            myPath.quadTo(x2, y2, mPointb.x, mPointb.y);
            return myPath;
}
```
- Danke für deine Antwort @Hengst. In dem code, den Sie angegeben haben, wo der Wert definiert den radius?
- Ich hatte dies lange zurück, Können Sie versuchen, ändern Sie die 3 unterschiedlichen Wert (2,3 oder 4) ? (mPointb.x + mPointa.x) / VARIABLE
- Das habe ich versucht. wenn auf 2 festgelegt, es ist nur eine gerade Linie. bei Einstellung auf höhere Werte, eine peaking-Form gezeichnet wird.
- so etwas wie die aktualisierte Bild angezeigt wird
- hmm yeay gut.. das problem ist, dass ich will, dass es "Kurve heraus von der Mitte der Linie. Und dann will ich bestimmen, wie viel es sollte Kurve. Wie dieses: "Arbeitsbereich".co/1bt6SF4x.png
- Tanks a lot für deine Hilfe, sehr dankbar dafür.. Allerdings fand ich die Lösung zu meinem speziellen problem.
InformationsquelleAutor Sreehari

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.