Benutzer-Werkzeuge

Webseiten-Werkzeuge


api:documentation:grafik:grundobjekte

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen RevisionVorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
api:documentation:grafik:grundobjekte [2021/01/05 23:50] – [Bitmap (Feld aus Quadraten)] Martin Pabstapi:documentation:grafik:grundobjekte [2022/03/30 08:32] (aktuell) – [Kreis/Ellipse (Füllfarbe, Linienfarbe)] Martin Pabst
Zeile 1: Zeile 1:
 ====== Grafikobjekte ====== ====== Grafikobjekte ======
-===== Kreis (Füllfarbe, Linienfarbe) =====+===== Kreis/Ellipse (Füllfarbe, Linienfarbe) =====
 {{ :api:documentation:grafik:pasted:20210105-111046.png?400 }} {{ :api:documentation:grafik:pasted:20210105-111046.png?400 }}
 <WRAP center round info 100%> <WRAP center round info 100%>
-Durch ''new Circle(400, 300, 150)'' wird ein Kreis mit Mittelpunkt $(400/300)$ und Radius $150$ gezeichnet.  \\ \\ +Durch ''new Circle(400, 300, 150)'' wird ein Kreis mit Mittelpunkt $(400/300)$ und Radius $150$ gezeichnet, durch ''new Ellipse(400, 300, 150, 50)'' eine Ellipse mit den Radien 150 in x-Richtung und 50 in y-Richtung. \\ \\ 
 **Füllfarbe** **Füllfarbe**
 Jedes grafische Objekt hat eine Füllfarbe. Sie kann mit der Methode ''setFillColor'' gesetzt werden. Mit diesem Bezeichner gibt es insgesamt vier überlagerte Methoden, die die Angabe der Farbe auf verschiedene Arten gestatten: Jedes grafische Objekt hat eine Füllfarbe. Sie kann mit der Methode ''setFillColor'' gesetzt werden. Mit diesem Bezeichner gibt es insgesamt vier überlagerte Methoden, die die Angabe der Farbe auf verschiedene Arten gestatten:
Zeile 32: Zeile 32:
 **Rand:** \\  **Rand:** \\ 
 Jedes Objekt besitzt einen Rand, der standardmäßig nicht gezeichnet wird (''setBorderColor(null)''). Sobald Du eine Randfarbe mit ''setBorderColor'' setzt, ist er sichtbar. Seine Dicke kann mit der Methode ''setBorderWith'' verändert werden. Jedes Objekt besitzt einen Rand, der standardmäßig nicht gezeichnet wird (''setBorderColor(null)''). Sobald Du eine Randfarbe mit ''setBorderColor'' setzt, ist er sichtbar. Seine Dicke kann mit der Methode ''setBorderWith'' verändert werden.
 + \\ \\ 
 +**Standardwerte:** \\ 
 +Standardmäßig wird jedes gefüllte graphische Objekt initial in blauer Farbe ohne Rand sichtbar gezeichnet. Diese Standardwerte lassen sich mit den Methoden
 +  * ''Shape.setDefaultVisibility(boolean visibility)''
 +  * ''FilledShape.setDefaultFillColor'' und
 +  * ''FilledShape.setDefaultBorder'' 
 +verändern.
  
 </WRAP> </WRAP>
Zeile 50: Zeile 57:
 c1.setBorderColor(Color.blue); c1.setBorderColor(Color.blue);
 c1.setBorderWidth(20); c1.setBorderWidth(20);
 +
 +Ellipse e1 = new Ellipse(500, 300, 150, 50);
 +e1.setFillColor(Color.red);
  
 Circle c2 = new Circle(200, 200, 150); Circle c2 = new Circle(200, 200, 150);
Zeile 125: Zeile 135:
  
  \\   \\ 
 +
 +===== Textfeld =====
 +<WRAP left round info 60%>
 +**Text:** \\ 
 +Oft möchte man in der Grafikausgabe auch Text unterbringen, z.B. um in einem Spiel eine Überschrift, das Level oder die erreichten Punkte anzuzeigen. 
 +Ein ''Text''-Objekt wird mithilfe der Koordinaten (x, y) der linken oberen Ecke sowie der Schriftgröße (in Pixeln) instanziert. Optional kann als fünfter Parameter auch eine Schriftart/Schriftfamilie angegeben werden, z.B.
 +<code myJava>
 +Text t1 = new Text(400, 300, 50, "Das ist ein Text");
 +Text t2 = new Text(400, 300, 50, "Das ist ein Text", "Courier");
 +</code>
 +
 +  * Die Ausrichtung des Textfeldes (linksbündig, zentriert, rechtsbündig) kann mit der Methode ''setAlignment'' gesetzt werden, z.B. ''setAlignment(Alignment.center)''. Entsprechend ist die x-Koordinate, die im Konstruktor angegeben wurde, dann nicht die linke Kante des Textes (linksbündig), sondern die Mitte (Ausrichtung zentriert) bzw. rechte (Ausrichtung rechtsbündig) Kante.
 +  * Der Textinhalt des Textfeldes kann mit der Methode ''setText'' gesetzt werden.
 +
 +</WRAP>
 +
 +<HTML>
 +<div class="java-online" style="height: 350px; width: 60%" data-java-online="{'withBottomPanel': false, 'id': 'Text'}">
 +<script type="text/plain" title="Text.java">
 +Text t1 = new Text(400, 20, 50, "linksbündig");
 +Text t2 = new Text(400, 100, 50, "zentriert");
 +t2.setAlignment(Alignment.center);
 +Text t3 = new Text(400, 180, 50, "rechtsbündig");
 +
 +Text t4 = new Text(400, 280, 50, "", "Courier");
 +t4.setAlignment(Alignment.center);
 +t4.setFillColor(Color.white);
 +t4.rotate(45);
 +
 +int z = 0;
 +while(true) {
 +   z++;
 +   t4.setText(z);
 +}
 +</script>
 +</div>
 +</HTML>
 +
 + \\ 
 +
 +
 ===== Dreieck (Triangle) ===== ===== Dreieck (Triangle) =====
 {{ :api:documentation:grafik:pasted:20210105-134329.png?420}} {{ :api:documentation:grafik:pasted:20210105-134329.png?420}}
Zeile 176: Zeile 227:
 <WRAP left round info 80%> <WRAP left round info 80%>
 **Line:** \\  **Line:** \\ 
-Ein Line-Objekt wird unter Angabe der Koordinaten seiner zwei Endpunkte instanziert, z.B. ''Line k = new Line(10, 20, 600, 400); \\ \\ +Ein Line-Objekt wird unter Angabe der Koordinaten seiner zwei Endpunkte instanziert, z.B. ''Line k = new Line(10, 20, 600, 400);'' \\ \\ 
 **Ändern von Punkten:** \\  **Ändern von Punkten:** \\ 
 Mit den Methoden ''setPoint(double x, double y, int index)'' und ''setPoints(double x1, double y1, double x2, double y2)'' können die Koordinaten der Endpunkte verändert werden. Mit den Methoden ''setPoint(double x, double y, int index)'' und ''setPoints(double x1, double y1, double x2, double y2)'' können die Koordinaten der Endpunkte verändert werden.
Zeile 199: Zeile 250:
 <WRAP left round info 80%> <WRAP left round info 80%>
 **Bitmap:** \\  **Bitmap:** \\ 
-Ein Bitmap-Objekt stellt ein in viele kleine Quadrate aufgeteiltes Rechteck dar. Die Anzahl der Quadrate in x- bzw. y-Richtung sowie left, top (Position der linken oberen Ecke), width (Breite) und height (Höhe) der Bitmap werden im Konstruktor festgelegt. Anschließend können die Quadrate einzeln beliebig eingefärbt werden. \\ \\  +Ein Bitmap-Objekt stellt ein in viele kleine Quadrate aufgeteiltes Rechteck dar. Die Anzahl der Quadrate in x- bzw. y-Richtung sowie left, top (Position der linken oberen Ecke), width (Breite) und height (Höhe) der Bitmap werden im Konstruktor festgelegt. Anschließend können die Quadrate einzeln beliebig eingefärbt werden.
-**Tipp:** Jeder Punkt wird durch zwei OpenGL-Dreiecke gezeichnet. Bei mehr als 40000 Punkten in der Bitmap (d.h. 80000 Dreiecken) kommen derzeit (Stand 2020) normale Bürorechner an ihre Leistungsgrenze ;-)+
 </WRAP> </WRAP>
  
 <HTML> <HTML>
-<div class="java-online" style="height: 550px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': 'Bitmap'}">+<div class="java-online" style="height: 550px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': 'Bitmap', 'speed': 'max'}">
 <script type="text/plain" title="Bitmap.java"> <script type="text/plain" title="Bitmap.java">
 // Beispiel: Mandelbrotmenge // Beispiel: Mandelbrotmenge
Zeile 245: Zeile 295:
 </HTML> </HTML>
  
 +===== Turtle (Schildkröte) =====
 +<WRAP left round info 80%>
 +**Turtle:** \\ 
 +Objekte der Klasse ''Turtle'' stellen eine "Schildkröte" dar (gleichschenkliges Dreieck), die Anfangs nach rechts blickt. Sie lässt sich mit den Methoden
 +  * ''forward(double länge)'' ( Vorwärtsbewegen)
 +  * ''turn(double winkelInGrad)'' (Blickrichtung ändern)
 +steuern lässt. Ihr Weg wird mit der aktuellen Stiftfarbe und -breite mitgezeichnet, die mit den Methoden
 +  * ''setBorderColor(farbe)'' (Stiftfarbe), 
 +  * ''setAlpha(alphaWert)'' (Undurchsichtigkeit, zwischen 0 == durchsichtig und 1 == undurchsichtig) und
 +  * ''setBorderWidth(breite)'' (Stiftbreite)
 +geändert werden können.
 +</WRAP>
 +
 +<HTML>
 +<div class="java-online" style="height: 400px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': 'Turtle1'}">
 +<script type="text/plain" title="Turtle1.java">
 +
 +for(int seitenzahl = 3; seitenzahl < 9; seitenzahl++) {
 +   Turtle t = new Turtle(-100 + 80 * seitenzahl, 700 - 60 * seitenzahl);
 +   t.showTurtle(true);
 +   t.setAlpha(0.3);
 +   t.setBorderColor(Color.randomColor());
 +   for(int seite = 0; seite < seitenzahl; seite++) {
 +      t.forward(600 / seitenzahl);
 +      t.turn(360 / seitenzahl);
 +   }
 +}
 +</script>
 +</div>
 +</HTML>
 +
 +
 +
 +===== Kreisbogen (Arc) und Kreissektor (Sector) =====
 +<HTML>
 +<div class="java-online" style="height: 400px; width: 100%" data-java-online="{'withBottomPanel': false, 'id': 'ArcSector'}">
 +<script type="text/plain" title="ArcSector.java">
 +Arc a1 = new Arc(300, 200, 50, 100, 45, 225);
 +a1.setFillColor(0x4B0082);
 +Arc a2 = new Arc(500, 200, 50, 100, 300, 90);
 +a2.setFillColor(null);
 +a2.setBorderColor(Color.red);
 +
 +Sector s1 = new Sector(300, 500, 100, 45, 180);
 +s1.setFillColor(0xCD5C5C);
 +
 +Sector s2 = new Sector(500, 500, 100, 45, 180);
 +s2.setFillColor(null);
 +s2.setBorderColor(Color.green);
 +s2.drawRadii(false);
 +</script>
 +</div>
 +</HTML>
  
  
api/documentation/grafik/grundobjekte.1609887041.txt.gz · Zuletzt geändert: 2021/12/29 11:29 (Externe Bearbeitung)

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki