Bla bla bla ...
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint strichfarbe = new Paint(); strichfarbe.setColor(Color.rgb(250, 0, 0)); strichfarbe.setStrokeWidth(1.0f); strichfarbe.setStrokeCap(Paint.Cap.ROUND); canvas.drawLine(20.0f, 20.0f, 200.0f, 200.0f, strichfarbe); }
Diese Anweisungsfolge zeichnet einen diagonal verlaufenden Strich.
Den gleichen Strich kannst du auch breiter zeichnen, wenn du die Strichbreite mit setStrokeWidth einstellst.
Beim Zeichnen mit breitem Strich können die Strichenden abgerundet, abgeschnitten oder überstehend gezeichnet werden. Du verwendest die Methode setStrokeCap, um das Aussehen der Strichenden festzulegen.
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint strichfarbe = new Paint(); strichfarbe.setColor(Color.rgb(250, 0, 0)); strichfarbe.setStrokeWidth(25.0f); strichfarbe.setStrokeCap(Paint.Cap.ROUND); canvas.drawLine(20.0f, 20.0f, 200.0f, 200.0f, strichfarbe); }
Zunächst wird der Streckenzug als eine Folge von Bewegungen des gedachten Zeichenstifts in eine Datenstruktur vom Typ Path eingetragen. Nachdem alle Strichelemente des Streckenzugs festgelegt wurden, wird der Streckezug mit einem einzigen Befehl (drawPath) gezeichnet.
Die Strichelemente eines Streckenzuges können auf verschiedene Weise miteinander verbunden werden. Beim Zeichnen mit einem breiten Strich sehen *****. Die gewünschte Strichverbindung legst du mit einem Aufruf der methode setStrokeJoin fest.
@Override protected void onDraw(Canvas canvas) { Path polygon = new Path(); final int n = 5; final int centerX = 150; final int centerY = 150; final float centerAngle = 360.0f / n; final float initialAngle = 0.0f; final int radius = 60; for (int i = 0; i < n; i++) { float angle = 2*i*centerAngle + initialAngle; float arc = (float)(Math.PI*angle/180.0); float x = (float)(radius*Math.cos(arc)) + centerX; float y = (float)(radius*Math.sin(arc)) + centerY; if (i == 0) { polygon.moveTo(x, y); } else { polygon.lineTo(x, y); } } polygon.close(); strichfarbe.setColor(Color.rgb(40, 40, 250)); strichfarbe.setStrokeWidth(3.0f); strichfarbe.setStrokeCap(Paint.Cap.ROUND); strichfarbe.setStrokeJoin(Paint.Join.MITER); strichfarbe.setStyle(Paint.Style.STROKE); canvas.drawPath(polygon, strichfarbe); }
bla bla bla
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint strichfarbe = new Paint(); strichfarbe.setColor(Colorrgb(250, 0, 0)); strichfarbe.setStrokeWidth(2.0f); strichfarbe.setStrokeCap(Paint.Cap.ROUND); canvas.drawLine(20.0f, 20.0f, 200.0f, 200.0f, strichfarbe); }
Hier sind Beispiele einzufügen und zu erklären.
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint fuellfarbe = new Paint(); Paint randfarbe = new Paint(); fuellfarbe.setStyle(Paint.Style.FILL); fuellfarbe.setColor(Color.argb(158, 0, 250, 0)); randfarbe.setStrokeWidth(15.0f); randfarbe.setStyle(Paint.Style.STROKE); randfarbe.setColor(Color.argb(128, 100, 100, 250)); fuellfarbe.setAntiAlias(true); randfarbe.setAntiAlias(true); final int cx = 160; final int cy = 120; final int radius = 100; canvas.drawCircle(cx, cy, radius, fuellfarbe); // Kreis ausfuellen canvas.drawCircle(cx, cy, radius, randfarbe); // Kreis umranden }
Kreissektor
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint fuellfarbe = new Paint(); Paint randfarbe = new Paint(); fuellfarbe.setStyle(Paint.Style.FILL); fuellfarbe.setColor(Color.argb(158, 0, 250, 0)); randfarbe.setStrokeWidth(15.0f); randfarbe.setStyle(Paint.Style.STROKE); randfarbe.setColor(Color.argb(128, 100, 100, 250)); fuellfarbe.setAntiAlias(true); randfarbe.setAntiAlias(true); RectF rect = new RectF(10, 300, 210, 500); // einhuellendes Quadrat eines Kreises canvas.drawArc(rect, 0.0f, 120.0f, true, fuellfarbe); // Kreissektor ausfuellen canvas.drawArc(rect, 0.0f, 120.0f, true, randfarbe); // Kreissektor umranden }
Eine geometrische Figur kannst du einfarbig ausmalen. Du kannst aber auch eine Füllung mit ineinander übergehenden Farben herstellen. Dazu bereitest du zuerst einen Farbverlauf vor, den du in die Füllfarbe einträgst.
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint fuellFarbe = new Paint(); int [] colors = { Color.rgb(250, 0, 0), Color.rgb(0, 250, 0)}; float [] positions = {0.0f, 1.0f }; LinearGradient gradient = new LinearGradient(0.0f, 0.0f, 200.0f, 200.0f, colors, positions, Shader.TileMode.CLAMP); fuellFarbe.setShader(gradient); fuellFarbe.setStyle(Paint.Style.FILL); fuellFarbe.setAntiAlias(true); canvas.drawRect(0.0f, 0.0f, 200.0f, 200.0f, fuellFarbe); }
Waagerechter Verlauf:
LinearGradient gradient = new LinearGradient(0.0f, 0.0f, 200.0f, 0.0f, colors, positions, Shader.TileMode.CLAMP);
Mehrere Zwischenfarben:
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint fuellFarbe = new Paint(); int [] colors = { Color.rgb(250, 0, 0), Color.rgb(250, 250, 0), Color.rgb(0, 250, 0)}; float [] positions = {0.0f, 0.5f, 1.0f }; LinearGradient gradient = new LinearGradient(0.0f, 0.0f, 200.0f, 200.0f, colors, positions, Shader.TileMode.CLAMP); fuellFarbe.setShader(gradient); fuellFarbe.setStyle(Paint.Style.FILL); fuellFarbe.setAntiAlias(true); canvas.drawRect(0.0f, 0.0f, 200.0f, 200.0f, fuellFarbe); }
Du kannst in einem Farbverlauf auch durchscheinende Farben verwenden. Dafür verwendest du statt der Methode Color.rgb die Methode Color.argb, in der du zusätzlich zu den Grundfarben den Alpha-Faktor angibst, der die Deckkraft der Farbe festlegt.
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); Paint strichfarbe = new Paint(); Paint fuellFarbe = new Paint(); Paint redStroke = new Paint(); int [] colors1 = { Color.argb(128, 250, 0, 0), Color.argb(128, 0, 250, 0)}; int [] colors2 = { Color.argb(128, 180, 180, 250), Color.argb(128, 30, 30, 250)}; float [] positions = {0.0f, 1.0f }; LinearGradient gradient1 = new LinearGradient(0.0f, 0.0f, 200.0f, 200.0f, colors1, positions, Shader.TileMode.CLAMP); LinearGradient gradient2 = new LinearGradient(0.0f, 0.0f, 200.0f, 200.0f, colors2, positions, Shader.TileMode.CLAMP); strichfarbe.setShader(gradient2); strichfarbe.setStrokeWidth(19.0f); strichfarbe.setStrokeCap(Paint.Cap.ROUND); strichfarbe.setStrokeJoin(Paint.Join.MITER); strichfarbe.setStyle(Paint.Style.STROKE); strichfarbe.setAntiAlias(true); fuellFarbe.setShader(gradient1); fuellFarbe.setStyle(Paint.Style.FILL); fuellFarbe.setAntiAlias(true); redStroke.setColor(Color.rgb(255, 0, 0)); redStroke.setStrokeWidth(19.0f); redStroke.setStrokeCap(Paint.Cap.BUTT); redStroke.setStyle(Paint.Style.STROKE); redStroke.setAntiAlias(true); canvas.drawLine(10.0f, 10.0f, 210.0f, 210.0f, redStroke); canvas.drawCircle(110.0f, 110.0f, 90.0f, fuellFarbe); canvas.drawCircle(110.0f, 110.0f, 90.0f, strichfarbe); }
Hier gehören Kapitel über die Klasse Path und über die Verwendung quadratischer und kubischer Elementarkurven hin.
Um Text anzuzeigen, musst du eine Instanz von Paint vorbereiten, in der du eine Schrift (Typeface) und eine Schriftgröße festgelegt hast. Das Anzeigen des Textes geschieht dann mit der Methode drawText, die von Canvas bereitgestellt wird.
Paint fontToUse = new Paint(); Typeface font = Typeface.create("Arial", Typeface.NORMAL); fontToUse.setTypeface(font); fontToUse.setTextSize(20); fontToUse.setColor(Color.BLACK);