zu www.bildungsgueter.de nächster Abschnitt zur Inhaltsübersicht des Kapitels vorheriger Abschnitt

Mit breitem Strich zeichnen

Im zuletzt behandelten Beispiel wurden drei Quadrate mit einem dünnen Strich umrandet. Wenn du mit einem dickeren Strich zeichnen willst, musst du die Strichstärke in der verwendeten Umrandungsfarbe einstellen. Die erforderliche Methode heißt setStrokeWidth. Die Methode ist mit einer Gleitkommazahl in einfacher Genauigkeit aufzurufen.

Für einen 5 Pixel breiten Strich schreibst du:

farbe.setStrokeWidth(5.0f);

Die Strichbreite wird vor der Ausführung des Zeichenbefehls festgelegt; sie kann vor jedem Zeichenbefehl verändert werden.

Hier werden drei Quadrate mit breiten Strichen in unterschiedlichen Farben umrandet:

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Rect r = new Rect(10, 10, 120, 120);
        Paint farbe = new Paint();
        farbe.setStrokeWidth(5.0f);
        farbe.setStyle(Paint.Style.STROKE);

        farbe.setColor(Color.rgb(128, 0, 0));
        canvas.drawRect(r, farbe);

        farbe.setColor(Color.rgb(0, 128, 0));
        r.offset(50, 50);
        canvas.drawRect(r, farbe);

        farbe.setColor(Color.rgb(0, 0, 128));
        r.offset(50, 50);
        canvas.drawRect(r, farbe);
    }

Drei mit dickem Strich umrandete Rechtecke

Wenn du mit einem breiten Strich zeichest, wird die Farbe zu beiden Seiten der gezeichneten Strecke verteilt. Die gezeichnete Strecke bildet die Mittellinie des breiten Strichs. Das siehst du sehr gut, wenn du die gleichen Quadrate zunächst mit dickem Strich und danach nochmals mit einem dünnen Strich einer anderen Farbe zeichnest:

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Rect r = new Rect(10, 10, 120, 120);
        Paint strich = new Paint();
        strich.setColor(Color.WHITE);
        strich.setStrokeWidth(1.0f);
        strich.setStyle(Paint.Style.STROKE);

        Paint farbe = new Paint();
        farbe.setStrokeWidth(5.0f);
        farbe.setStyle(Paint.Style.STROKE);

         // rotes Rechteck zeichnen
        farbe.setColor(Color.rgb(128, 0, 0));
        canvas.drawRect(r, farbe);
        canvas.drawRect(r, strich);

         // grünes Rechteck zeichnen
        farbe.setColor(Color.rgb(0, 128, 0));
        r.offset(50, 50);
        canvas.drawRect(r, farbe);
        canvas.drawRect(r, strich);

         // blaues Rechteck zeichnen
        farbe.setColor(Color.rgb(0, 0, 128));
        r.offset(50, 50);
        canvas.drawRect(r, farbe);
        canvas.drawRect(r, strich);
    }

In diesem Beispiel bereitest du zwei Umrandungsfarben vor, um rascher zeichnen zu können. Die Instanz von Paint, die mit einem dünnen weißen Strich zeichnet, verwendest du unverändert für die Umrandung aller drei Quadrate; die mit breitem Strich zeichnende Instanz wechselt für jedes Quadrat die Farbe.

Drei mit dickem und mit dünnem Strich umrandete Rechtecke

Du kannst den Farb

Hier zeichnest du zuerst alle drei Quadrate mit dicken Strichen in unterschiedlicher Farbe, danach zeichnest du sie nochmals mit einem dünnen weißen Strich.

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Rect r = new Rect(10, 10, 120, 120);
        Paint strich = new Paint();
        strich.setColor(Color.WHITE);
        strich.setStrokeWidth(1.0f);
        strich.setStyle(Paint.Style.STROKE);
        Paint farbe = new Paint();
        farbe.setStrokeWidth(5.0f);
        farbe.setStyle(Paint.Style.STROKE);
        farbe.setColor(Color.rgb(128, 0, 0));
        canvas.drawRect(r, farbe);
        farbe.setColor(Color.rgb(0, 128, 0));
        r.offset(50, 50);
        canvas.drawRect(r, farbe);
        farbe.setColor(Color.rgb(0, 0, 128));
        r.offset(50, 50);
        canvas.drawRect(r, farbe);
        canvas.drawRect(r, strich);
        r.offset(-50, -50);
        canvas.drawRect(r, strich);
        r.offset(-50, -50);
        canvas.drawRect(r, strich);
    }

Da die Reihenfolge der Zeichenbefehle nun eine andere ist, sieht auch das Ergebnis geringfügig anders aus. Bemerkst du den Unterschied?

Drei mit dickem und mit dünnem Strich umrandete Rechtecke

vorheriger Abschnitt zur Inhaltsübersicht des Kapitels nächster Abschnitt