Wie zeichnen Sie einen Pfad mit Grenzen?

Möchte ich einen Pfad zeichnen, ähnlich wie die Bild. Es hat zwei schwarze Ränder und die Innenseite ist weiß statt transparent. Wie es zu erreichen ? insbesondere die gemeinsame position.

drawPath zweimal mit unterschiedlichen Farben und Strichstärken
wenn Sie es versuchte, würden Sie finden, es funktioniert nicht. Das Gelenk wird nicht über die schwarzen Linien.
ok, so dass Sie nicht tun es mit einem Pfad, Sie haben zum zeichnen von zwei-Pfad-Segmente, die ein überziehen der andere

InformationsquelleAutor Acheese | 2013-10-31

android android-canvas

Das gewünschte Ergebnis zu erhalten, müssen Sie die zeichnen Sie den Pfad in Teile.

Ziehst du die Teile zweimal, mit zwei verschiedenen Paint Objekte, die sich nur in der Schlaganfall-Breite und-Farbe. Nach dem zeichnen jeder Teil, der Pfad wird zurückgesetzt. Die code-Kommentare, die erklären sollen, der rest:

public class SView extends View {

    Path path;
    Paint paint, paintWhite;
    RectF rf, rf2, rf3;

    public SView(Context context) {
        super(context);

        path = new Path();

        //'paint' has a wider stroke-width 
        //compared to 'paintWhite' and 
        //thus becomes the border paint
        paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setAntiAlias(true);
        paint.setStrokeWidth(15);
        paint.setStyle(Style.STROKE);

        //'paintWhite' colors the inner path
        paintWhite = new Paint();
        paintWhite.setColor(Color.WHITE);
        paintWhite.setAntiAlias(true);
        paintWhite.setStrokeWidth(12);
        paintWhite.setStyle(Style.STROKE);

        //For this example, we'll draw three
        //arcs bound by the following RectF
        //objects
        rf = new RectF(200, 200, 500, 500);
        rf2 = new RectF(200, 200, 400, 500);
        rf3 = new RectF(100, 200, 400, 500);                    
    }

    @Override
    protected void onDraw(Canvas canvas) {          

        //First arc bound by 'rf'
        path.arcTo(rf, 0, 180);

        //Draw 'path' using 'paint' 
        //and then, again using 'paintWhite'       
        canvas.drawPath(path, paint);
        canvas.drawPath(path, paintWhite);

        //Reset 'path' so as to clear 
        //history
        path.reset();

        //Repeat with the rest of arcs
        path.arcTo(rf2, 180, 180);      
        canvas.drawPath(path, paint);
        canvas.drawPath(path, paintWhite);      
        path.reset();           

        path.arcTo(rf3, 0, 180);            
        canvas.drawPath(path, paint);
        canvas.drawPath(path, paintWhite);  

    }       
}

Ausgabe:

Wie zeichnen Sie einen Pfad mit Grenzen?

Hinweis: Die arc überschneidet, ist gebunden RectF rf3, und wird zuletzt gezeichnet.

Da wir zeichnen die white Anteil zusammen mit der borders, Sie werden nicht am Ende mit der vier-Wege-Kreuzung. Die Teile überlappen sich in einem flyover Art von Mode: in der Reihenfolge, in der Sie gezeichnet werden.

Leistung zu erhöhen (nehme ich an), können Sie prüfen, ob Sie den nächsten Teil des Weges wird sich mit jedem vorangegangenen vor dem zurücksetzen der Pfad. Wenn der nächste Teil nicht überschneiden, reset und zeichnen Sie das Teil mit den zwei Malen, Objekte. Wenn es nicht, fügen Sie einfach den Teil, auf den Weg und warten Sie bis zur nächsten Kreuzung, um es zu zeichnen. Sie werden natürlich brauchen, um zu halten eine Geschichte der Teile gezeichnet (wie im Beispiel oben, Geschichte enthalten würde, die Grenzen: 'RectF' - Objekte). Allerdings bin ich mir nicht 100% sicher, ob dies besser ist, als immer wieder das zurücksetzen der Pfad und dann die Zeichnung der Teile.

InformationsquelleAutor Vikram

1

Können Sie versuchen, mit zwei verschiedenen Farben von Objekten zu ziehen in die gleiche Richtung. Das erste Paint-Objekt haben Sie die gewünschte Farbe für die Ränder und eine große Breite der Striche. Die zweite Farbe wird haben ein geringeres Schlaganfall-Breite mit PorterDuff.Mode.CLEAR festgelegt sind.
```
linePaint = new Paint();
linePaint.setAntiAlias(true);
linePaint.setColor(Color.YELLOW);
linePaint.setStrokeWidth(6);
linePaint.setStyle(Paint.Style.STROKE);

clearPaint = new Paint();
clearPaint.setAntiAlias(true);
clearPaint.setXfermode(new PorterDuffXfermode(Mode.CLEAR));
clearPaint.setStyle(Paint.Style.STROKE);
clearPaint.setStrokeWidth(3);
```
Dann in Ihrer onDraw () - Methode zeichnen Sie den gleichen Weg zweimal über die beiden oben genannten Farben.
```
canvas.drawPath(path, linePaint);
canvas.drawPath(path, clearPaint);
```
Dies ist möglicherweise nicht sehr effizient in Bezug auf Leistung, aber es ist der einfachste Weg, die ich denken konnte.

EDIT: habe Nicht nicht getestet, diese durch und durch mich, so lassen Sie mich wissen, wenn es Probleme gibt.

UPDATE: Nachdem dieses zu testen, habe ich herausgefunden, dass die PorterDuff.- Modus.CLEAR löschen Sie die gesamte pixel-Informationen in die Leinwand " backing bitmap. So wird man in der Regel am Ende mit etwas wie dieses:

Die Lösung dieses Problem zu beheben wäre eine off-screen-Leinwand und zeichnen Sie den Pfad auf.
```
Canvas canvas2 = new Canvas();
Bitmap backingBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);


canvas2.setBitmap(backingBitmap);
canvas2.drawPaint(clearPaint);
canvas2.drawPath(path, linePaint);
canvas2.drawPath(path, clearPaint);

canvas.drawBitmap(backingBitmap, 0, 0, null);
```
Mithilfe der oben beschriebenen Methode, erhalten Sie das folgende Ergebnis:

Den Nachteil, erstellen von bitmaps kann die Leistung beeinträchtigen, wenn Sie tun es jeden Rahmen. Die Größe der Bitmap wirkt sich auch auf die Leistung negativ. So dass Sie wollen zu erstellen, die off-screen-Leinwand, die nur bei Bedarf und so lange, wie Sie nicht brauchen, um zurücksetzen Ihrer path-info, Sie können weiterhin die Zeichnung auf der zuvor erstellten backingBitmap.
- Vielen Dank für Ihre Darstellung. Ich bekam Ihren Punkt, aber ein weiterer sehr tödliche problem ist der Schnittpunkt der Zeile : ich muss wissen, welche Leitung ist auf der Spitze. Wenn man sich sorgfältig auf mein Bild findest du die Schnittmenge von Ihnen unterscheiden.
- Ah, ja, ich habe bemerkt, dass, während die Veröffentlichung meiner Antwort, aber ich konnte nicht herausfinden, wie das erreicht werden kann. Ich werde aktualisieren, meine Antwort, wenn ich eine bessere Lösung, die Adressen, die.
InformationsquelleAutor Dev N

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.