9

Grafiken, Schriften und Farben

von
Laura Lemay

Die Grundlagen der Funktionsweise von Applets zu kennen, war nur der erste Schritt. Als nächstes erfahren Sie, welche Möglichkeiten Java zum Zeichnen am Bildschirm bietet, wie sich der Bildschirm dynamisch aktualisieren läßt, wie Maus- und Tastaturereignisse gehandhabt und wie Elemente der Benutzeroberfläche erstellt werden. Alle diese Aufgaben werden Sie in dieser Woche durchführen. Sie beginnen heute mit dem Zeichnen am Bildschirm, d.h. Sie lernen, wie Linien und Formen mit den einfachen und integrierten Grafikobjekten erstellt werden, wie Sie Text in verschiedenen Schriftarten ausgeben und wie Sie die Farben in den Applets ändern. Heute lernen Sie insbesondere:

• Wie das Grafiksystem in Java funktioniert: die Graphics-Klasse, das Koordinatensystem sowie das Zeichnen und Ausgeben von Applets.
• Das Arbeiten mit Java-Grafikobjekten, z.B. Zeichnen und Ausfüllen von Linien, Rechtecken, Ovalen und Bögen.
• Das Erstellen und Verwenden von Fonts, das Ausgeben von Zeichen und Zeichenketten und die optimale Gestaltung des Layouts mit Schriftarten.
• Die Verwendung von Farben in Java, einschließlich der Color-Klasse, das Einrichten von Vorder- und Hintergrundfarben für Ihr Applet und die Benutzung des Farbschemas aus dem Windows-System des Computers.

Die Graphics-Klasse

Mit den Grafikfähigkeiten von Java können Sie Linien, Formen, Zeichen und Bilder in einem Applet am Bildschirm ausgeben. Grafikoperationen sind in Java größtenteils Methoden, die in der Graphics-Klasse definiert sind. Sie brauchen keine Instanz von Graphics zu erstellen, um etwas in einem Applet zu zeichnen. In der paint()-Methode Ihres Applet (die Sie gestern gelernt haben) erhalten Sie automatisch ein Graphics-Objekt. Durch Zeichnen in diesem Objekt, zeichnen Sie gleichzeitig in Ihrem Applet – das Ergebnis wird am Bildschirm angezeigt.

Die Graphics-Klasse ist Teil des Pakets java.awt. Wenn Sie also etwas in Ihrem Applet zeichnen (was durchaus üblich ist), stellen Sie sicher, daß Sie diese Klasse am Anfang der Java-Datei importieren:

import java.awt.Graphics;



public class MyClass extends java.applet.Applet {

    ...

}

Das Graphics-Koordinatensystem

Um ein Objekt am Bildschirm zu zeichnen, rufen Sie eine der in der Graphics-Klasse verfügbaren Zeichenmethoden auf. Alle Zeichenmethoden verfügen über Argumente, die Endpunkte, Ecken und Anfangspunkte des Objekts als Werte im Applet-Koordinatensystem darstellen. Eine Linie beginnt beispielsweise an den Punkten 10,10 und endet an den Punkten 20,20.

Das Koordinatensystem von Java hat seinen Ursprungspunkt (0,0) in der oberen linken Ecke. Positive X-Werte verlaufen nach rechts und positive Y-Werte nach unten. Alle Pixelwerte sind ganze Zahlen (Integer). Es gibt keine Pixelteilwerte oder Brüche. Abb. 9.1 zeigt, wie Sie in diesem Koordinatensystem ein einfaches Quadrat zeichnen.

Das Koordinatensystem von Java unterscheidet sich von vielen anderen Zeichen- oder Layoutprogrammen, deren Ursprungspunkte in der linken unteren Ecke liegen. Wenn Sie mit diesem »umgekehrten« Koordinatensystem nicht vertraut sind, sollten Sie ein wenig damit experimentieren.

Zeichnen und Ausfüllen

Die Graphics-Klasse enthält einen Satz von einfachen, vordefinierten Grafikelemente zum Zeichnen von Linien, Rechtecken, Vielecken, Ovalen und Bögen.

Linien

Gerade Linien werden mit der Methode drawLine gezeichnet. Für drawLine stehen vier Argumente zur Verfügung: die X- und Y-Koordinaten des Ausgangspunkts sowie die X- und Y-Koordinaten des Endpunkts. Zum Beispiel: In der folgenden MyLine-Klasse wird eine Linie vom Punkt 25,25 zum Punkt 75,75 gezeichnet. Beachten Sie, daß die Methode drawLine in der Graphics-Klasse definiert ist (wie auch alle anderen Grafik-Methoden, die Sie heute noch kennenlernen werden). Im folgenden verwenden Sie diese Methode für den aktuellen Grafikkontext, der in der Variablen g gespeichert ist:

import java.awt.Graphics;



public class MyLine extends java.applet.Applet {

    public void paint(Graphics g) {

        g.drawLine(25,25,75,75);

    }

}

Abb. 9.2 zeigt, wie die einfache MyLine-Klasse in einem Java-fähigen Browser, z.B. dem Netscape Navigator angezeigt wird.

Rechtecke

Die Java-Grafikelemente umfassen nicht nur eine, sondern drei Arten von Rechtecken:

• Einfache Rechtecke
• Abgerundete Rechtecke (runde Ecken)
• Dreidimensionale Rechtecke (mit schattiertem Rand)

Für jedes dieser Rechtecke können Sie unter zwei Methoden wählen: Die Umriß- oder die Füllmethode, um das Rechteck als Kontur oder als gefüllte Fläche darzustellen.

Um ein einfaches Rechteck zu zeichnen, verwenden Sie entweder die Methode drawRect() oder fillRect(). Beide lassen sich mit vier Argumenten versehen: Die X- und Y-Koordinaten für die oberste linke Ecke des Rechtecks sowie für die Höhe und Breite. Zum Beispiel: Die folgende Klasse (MyRect) zeichnet zwei Quadrate: Das linke wird mit der Umrißlinie dargestellt und das rechte ist gefüllt. Abb. 9.2 zeigt das Ergebnis.

import java.awt.Graphics;



public class MyRect extends java.applet.Applet {

    public void paint(Graphics g) {

        g.drawRect(20,20,60,60);

        g.fillRect(120,20,60,60);

    }

}

Abgerundete Rechtecke werden mit runden Ecken gezeichnet. Die Methoden drawRoundRect() und fillRoundRect() für das Zeichnen abgerundeter Rechtecke sind den Methoden für die einfachen Rechtecke ähnlich; sie verfügen jedoch über zwei zusätzliche Argumente für die Breite und Höhe der Rundung der Ecken. Diese beiden Argumente bestimmen, wo der Bogen entlang der Rechteckkanten beginnt. Das erste Argument definiert die Rundung auf der horizontalen und das zweite auf der vertikalen Ebene. Größere Werte für die Breite und Höhe der Rundung lassen das Rechteck insgesamt stärker gerundet erscheinen. Werte, die der Breite und Höhe des Rechtecks entsprechen, erzeugen einen Kreis. In Abb. 9.4 finden Sie einige Beispiel für abgerundete Ecken.

Die folgende paint()-Methode innerhalb der Klasse MyRect zeichnet zwei abgerundete Rechtecke: Eines mit Umrißlinie und abgerundeten Ecken von 10 Pixel Breite und Höhe und ein gefülltes mit abgerundeten Ecken von 20 Pixel Breite und Höhe (Abb. 9.5 zeigt die sich daraus ergebenden Formen):

import java.awt.Graphics;



public class MyRRect extends java.applet.Applet {

    public void paint(Graphics g) {

        g.drawRoundRect(20,20,60,60,10,10);

        g.fillRoundRect(120,20,60,60,20,20);

    }

}

Polygone

Vielecke (Polygone) sind Formen mit einer unbegrenzten Anzahl von Seiten. Um ein Polygon zu zeichnen, benötigen Sie verschiedene X- und Y-Koordinaten. Das Polygon wird dann als Satz von geraden Linien gezeichnet, die ihren Endpunkt dort haben, wo die nächste Linie beginnt usw..

Ebenso wie bei Rechtecken können Sie diese mit Umrißlinie oder in gefüllter Form zeichnen (mit den Methoden drawPolygon() und fillPolygon()). Sie haben ferner die Wahl, wie die Liste der Koordinaten dargestellt werden soll – entweder als Aneinanderreihung von X- und Y-Koordinaten oder als eine Instanz der Polygon-Klasse.

Beim ersten Verfahren haben die Methoden drawPolygon() und fillPolygon()drei Argumente:

• Eine Reihe von ganzen Zahlen, welche die X-Koordinaten darstellen
• Eine Reihe von ganzen Zahlen, welche die Y-Koordinaten darstellen
• Eine ganze Zahl für die Gesamtzahl der Punkte

Die X- und Y-Reihen sollten selbstverständlich die gleiche Anzahl von Elementen enthalten.

Das folgende Beispiel zeigt das Zeichnen eines Polygons mit dieser Methode. Abbildung 9.6 zeigt das Ergebnis.

import java.awt.Graphics;



public class MyPoly extends java.applet.Applet {

    public void paint(Graphics g) {

        int exes[] = { 39,94,97,142,53,58,26 };

        int whys[] = { 33,74,36,70,108,80,106 };

        int pts = exes.length;



        g.drawPolygon(exes,whys,pts);

    }

}

Beachten sie, daß Java ein Polygon automatisch schließt. Wenn Sie keine geschlossene Form wünschen, müssen Sie für ein ungefülltes Polygon die Methode drawPolyline() verwenden, die am Ende dieses Abschnitts beschrieben wird.

Beim zweiten Verfahren des Aufrufs von drawPolygon()und fillPolygon()wird ein Polygon-Objekt dazu verwendet, die einzelnen Punkte des Polygons zu speichern. Die Polygon-Klasse ist sinnvoll, wenn Sie dem Polygon weitere Punkte hinzufügen möchten oder ein Polygon spontan erstellt werden soll. Mit der Polygon-Klasse können Sie das Polygon anstelle von einzelnen Reihen als Objekt behandeln.

Um ein Polygon-Objekt zu erstellen, definieren Sie entweder zuerst ein leeres Polygon:

Polygon poly = new Polygon();

oder Sie erstellen ein Polygon aus mehreren Punkten anhand von ganzen Zahlen, wie im vorherigen Beispiel:

int exes[] = { 39,94,97,142,53,58,26 };

int whys[] = { 33,74,36,70,108,80,106 };

int pts = exes.length;

Polygon poly = new Polygon(exes,whys,pts);

Nachdem das Polygon-Objekt erstellt ist, können Sie es nach Bedarf mit weiteren Punkten versehen:

poly.addPoint(20,35);

Zum Zeichnen eines Polygons verwenden Sie das Polygon-Objekt als Argument für drawPolygon() und fillPolygon(). Der Code aus dem obigen Beispiel soll hier noch einmal mit einem Polygon-Objekt geschrieben werden. Ferner ist dieses Polygon gefüllt, wie in Abb. 9.7 zu sehen ist.

import java.awt.Graphics;

import java.awt.Polygon;



public class MyPoly2 extends java.applet.Applet {

    public void paint(Graphics g) {

        int exes[] = { 39,94,97,142,53,58,26 };

        int whys[] = { 33,74,36,70,108,80,106 };

        int pts = exes.length;

        Polygon poly = new Polygon(exes,whys,pts);

        g.fillPolygon(poly);

    }

}

Die Methode drawPolyline() wird dazu verwendet, offene Polygone zu zeichnen. Die Methode funktioniert genau auf dieselbe Weise wie das erste Beispiel für eine Polygon-Zeichnung in diesem Abschnitt. Sie definieren zwei Ganzzahl-Reihen, welche die X- und Y-Koordinaten jedes Punktes enthalten und eine weitere Ganzzahl für die Anzahl der Punkte.

Das folgende Beispiel zeichnet ein Polygon, das nicht komplett ist. Abb. 9.8 stellt das Resultat dar.

import java.awt.Graphics;



public class MyPoly3 extends java.applet.Applet {

    public void paint(Graphics g) {

        int exes[] = { 39,94,97,142,53,58,26 };

        int whys[] = { 33,74,36,70,108,80,106 };

        int pts = exes.length;



        g.drawPolyline(exes,whys,pts);

    }

}

Ovale

Ovale dienen dazu, Ellipsen und Kreise zu zeichnen. Stellen Sie sich ein Oval wie ein Rechteck mit übermäßig abgerundeten Ecken vor. Im Grunde werden Ovale mit denselben vier Argumenten definiert: X- und Y-Koordinate der oberen Ecke sowie der Breite und Höhe des Ovals selbst. Der Anfangspunkt eines Ovals befindet sich links oben, in einiger Entfernung von der Umrißlinie des Ovals. Wenn Sie sich ein Oval als Rechteck vorstellen, erleichtern Sie sich dadurch die Plazierung.

Wie bei den anderen Zeichenoperationen auch, erstellt die Methode drawOval() den Umriß eines Ovals, während fillOval() ein gefülltes Oval zeichnet.

Das folgende Beispiel zeichnet zwei Ovale: einen Kreis und eine Ellipse. Abb. 9.9 zeigt, wie diese beiden Ovale am Bildschirm erscheinen.

import java.awt.Graphics;



public class MyOval extends java.applet.Applet {

    public void paint(Graphics g) {

    g.drawOval(20,20,60,60);

    g.fillOval(120,20,100,60);

    }

}

Bögen

Von allen Formen, die sich mit den Methoden aus der Graphics-Klasse erstellen lassen, handelt es sich bei den Bögen um die komplizierteste Form, deshalb soll sie auch zuletzt erläutert werden. Ein Bogen ist ein Teil eines Ovals. Stellen Sie sich einen Bogen deshalb als Abschnitt eines kompletten Ovals vor. Abb. 9.10 zeigt einige Bögen.

Die Methode drawArc() verfügt über sechs Argumente: die Ausgangsecke, die Breite und Höhe, der Startwinkel des Bogens und den Winkel, der beim Zeichnen überstrichen werden soll. Auch hier zeichnet die Methode drawArc() den Umriß des Bogens und fillArc() einen gefüllten Bogen. Gefüllte Bögen werden als Abschnitte eines Kreises gezeichnet. Die beiden Endpunkte werden hierbei in der Kreismitte zusammengefügt.

Wichtig zu wissen ist, daß ein Bogen im Prinzip als Oval definiert und dann nur teilweise gezeichnet wird. Die Anfangsecke sowie die Breite und Höhe sind nicht der Anfangspunkt und die Breite und Höhe des eigentlichen Bogens, sondern der vollen Ellipse, aus welcher der Bogen stammt. Diese ersten Punkte bestimmen die Größe und Form des Bogens. Die zwei letzteren Argumente (für die Winkel) bestimmen die Anfangs- und Endpunkte.

Wir beginnen mit einem einfachen Bogen – einer C-Form, die in Abb. 9.11 zu sehen ist.

Um die Methode zum Zeichnen dieses Bogens zu bilden, stellen Sie sich den Bogen zunächst als Kreis vor. Dann ermitteln Sie die X- und Y-Koordinaten sowie die Breite und Höhe des Kreises. Diese vier Werte bilden die ersten vier Argumente für die Methoden drawArc() und fillArc(). Abb. 9.12 zeigt wie Sie diese Werte für den Bogen erhalten.

Die letzten beiden Argumente erhalten Sie, wenn Sie sich den Kreis in einer Gradteilung entgegen dem Uhrzeigersinn vorstellen. Null Grad liegt bei 3 Uhr, 90 Grad bei 12 Uhr, 180 Grad bei 9 Uhr und 270 Grad bei 6 Uhr. Der Anfangspunkt des Bogens liegt oben bei 90 Grad; also ist 90 das fünfte Argument.

Das sechste und letzte Argument bildet eine weitere Gradzahl, die angibt, wie weit sich der Bogen entlang der Kreislinie erstreckt und in welcher Richtung er verläuft. Hierbei handelt es sich also nicht um die Gradzahl des Endpunktes, wie Sie vielleicht meinen. Da es sich in unserem Beispiel um einen Bogen handelt, der den halben Kreis umfaßt, verläuft der Bogen insgesamt um 180 Grad. Somit ist 180 das letzte Argument. Da der Bogen entgegen dem Uhrzeigersinn, also gemäß dem Javasystem verläuft, ist die Richtung positiv. Wenn Sie den halben Kreis rechts herum zeichnen, ist die Richtung negativ, in diesem Fall wäre das letzte Argument -180. Abb. 9.13 zeigt, wie diese Konstruktion aufgebaut wird.

Im folgenden finden Sie den Code zu diesem Beispiel. Sie zeichnen eine Umrißlinie des C-Bogens und stellen den zweiten C-Bogen gefüllt dar (siehe Abb. 9.14).

import java.awt.Graphics;



public class MyOval extends java.applet.Applet {

    public void paint(Graphics g) {

    g.drawArc(20,20,60,60,90,180);

    g.fillArc(120,20,60,60,90,180);

    }

}

Mit Kreisen lassen sich Bögen gut darstellen. Bögen aus Ellipsen hingegen sind etwas komplizierter. Im folgenden wird das Erstellen des Bogens aus Abb. 9.15 erläutert.

Wie bei einem kreisförmigen Bogen, besteht auch dieser Bogen aus dem Teil eines kompletten Ovals, in diesem Fall ist das Oval jedoch eine Ellipse. Durch Vervollständigung des Ovals können Sie die Argumente für Anfangspunkt, Breite und Höhe der Methode drawArc bzw. fillArc ermitteln (siehe Abb. 9.16).

Anschließend müssen Sie nur noch den Anfangswinkel und Winkelbereich ermitteln. Dieser Bogen beginnt leider nicht an so schönen Punkten wie 90 oder 180 Grad, deshalb müssen Sie ein wenig experimentieren. Der Anfangspunkt liegt etwa bei 25 Grad und der Bogen verläuft dann im Uhrzeigersinn um 130 Grad (siehe Abb. 9.17).

Damit sind alle Teile des Bogens ermittelt. Der Code kann geschrieben werden. Der folgende Java-Code definiert sowohl einen Bogen mit Umrißlinie als auch einen gefüllten Bogen (am gefüllten Bogen können Sie erkennen, daß diese wie Kreisabschnitte gezeichnet werden):

import java.awt.Graphics;



public class MyOval extends java.applet.Applet {

    public void paint(Graphics g) {

    g.drawArc(10,20,150,50,25,-130);

    g.fillArc(10,80,150,50,25,-130);

    }

}

Abb. 9.18 zeigt zwei elliptische Bögen.

Im folgenden werden die Schritte zum Erstellen von Bögen in Java noch einmal zusammengefaßt:

1. Stellen Sie sich Bögen als Teilbereiche eines Ovals vor.

• Konstruieren Sie das komplette Oval mit Anfangspunkt, Höhe und Breite (oft hilft es, ein Oval auf dem Bildschirm zu zeichnen, um eine Orientierung für die Positionierung zu erhalten).
• Ermitteln Sie den Anfangswinkel des Bogens.
• Ermitteln Sie den Winkelbereich und Richtung des Bogens (positive Werte verlaufen entgegen dem Uhrzeigersinn, negative Werte im Uhrzeigersinn).

Einfaches Grafikbeispiel

Das folgende Beispiel erläutert ein Applet, das viele der hier erläuterten Grafikelemente dazu benutzt, einfache Grundformen zu zeichnen. Es handelt sich um eine Tischlampe mit einem gepunkteten Schirm (so eine Art kubistischer Pilz). Listing 9.1 enthält den kompletten Code für diese Lampe, während Abb. 9.19 das Ergebnis zeigt.

Listing 9.1: Die Lamp-Klasse

 1: import java.awt.*;

 2:

 3: public class Lamp extends java.applet.Applet {

 4:

 5:     public void paint(Graphics g) {

 6:         // Stellfläche für Lampe

 7:         g.fillRect(0,250,290,290);

 8:

 9:         // Lampenfuß

10:         g.drawLine(125,250,125,160);

11:         g.drawLine(175,250,175,160);

12:

13:         // Lampenschirm, obere und untere Kante

14:         g.drawArc(85,157,130,50,-65,312);

15:         g.drawArc(85,87,130,50,62,58);

16:

17:         // Lampenschirm, Seiten

18:         g.drawLine(85,177,119,89);

19:         g.drawLine(215,177,181,89);

20:

21:         // Punkte auf dem Schirm

22:         g.fillArc(78,120,40,40,63,-174);

23:         g.fillOval(120,96,40,40);

24:         g.fillArc(173,100,40,40,110,180);

25:    }

26: }

Kopieren und Löschen

Nachdem Sie einige Elemente am Bildschirm gezeichnet haben, möchten Sie diese vielleicht versetzen oder das gesamte Applet löschen. In der Graphics-Klasse stehen Methoden für diese Vorgänge zur Verfügung.

Die Methode copyArea() kopiert einen rechteckigen Bereich des Bildschirms an eine andere Position. copyArea() nimmt sechs Argumente entgegen: X- und Y-Koordinaten der oberen Ecke des zu kopierenden Rechtecks, Breite und Höhe des Rechtecks und Entfernung in X- und Y-Richtung, in welche kopiert werden soll. Die folgende Zeile kopiert zum Beispiel einen quadratischen Bereich von 100 Pixel pro Seite um 100 Pixel nach rechts:

g.copyArea(0,0,100,100,100,0);

Zum Löschen eines rechteckigen Bereichs verwenden Sie die clearRect-Methode. ClearRect enthält dieselben vier Argumente wie drawRect() und fillRect() und füllt das betreffende Rechteck mit der aktuellen Hintergrundfarbe des Applets (nähere Erläuterungen zum Einstellen der aktuellen Hintergrundfarbe erhalten Sie noch heute).

Um das gesamte Applet zu löschen, verwenden Sie die Methode size(). Diese gibt ein Dimension-Objekt aus, das die Breite und Höhe des Applets darstellt. Sie erhalten die aktuellen Werte für Breite und Höhe, indem Sie die Instanzvariablen widht und height verwenden.

g.clearRect(0,0,size().width,size().height);

Text und Schriftarten

Wenn Sie die Graphics-Klasse zusammen mit der Font-Klasse (und gelegentlich auch mit der FontMetrics-Klasse) verwenden, können Sie am Bildschirm Text ausgeben. Die Font-Klasse stellt eine bestimmte Schriftart – Name, Stil und Punktgröße – dar, während FontMetrics Informationen über diese Schriftart angibt (z.B.: die tatsächliche Höhe oder Breite eines bestimmten Zeichens). Auf diese Weise können Sie den Text in einem Applet exakt definieren.

Beachten Sie, daß der Text einmal auf dem Bildschirm gezeichnet wird und dann dort bleiben soll. Informationen zur Texteingabe auf der Tastatur erhalten Sie später in dieser Woche.

Erstellen von Font-Objekten

Um Text am Bildschirm auszugeben, müssen Sie zunächst eine Instanz der Font-Klasse erstellen. Font-Objekte stellen eine einzelne Schriftart dar, d.h. deren Namen, Stil und Punktgröße. Fontnamen sind Zeichenfolgen, welche die Familie einer Schriftart angeben, z.B.: »Times Roman«, »Courier« oder »Helvetica«. Font-Stile sind Konstanten, die mit der Font-Klasse definiert werden. Diese lassen sich mit Hilfe von Variablen angeben, z.B.: Font.PLAIN (Normal), Font.BOLD (Fett) oder Font.ITALIC (kursiv). Die Punktgröße ist die Größe der Schriftart, die von der Schriftart selbst definiert wird; die Punktgröße kann der Höhe der Zeichen entsprechen oder auch nicht.

Um ein einzelnes Font-Objekt zu erstellen, verwenden Sie die folgenden drei Argumente für den neuen Konstruktor der Font-Klasse.

Font f = new Font("TimesRoman", Font.BOLD, 24);

In diesem Beispiel wird ein Fontobjekt für die Schriftart Times Roman, fett, 24 Punkt erstellt. Beachten Sie, daß Sie diese wie die Font-Klasse java.awt wie die meisten Java-Klassen zuerst importieren müssen, ehe Sie diese verwenden können.

Welche Schriftarten sich in Applets verwenden lassen, hängt davon ab, welche Schriftarten auf dem System installiert sind, auf dem die Applets ausgeführt werden. Wenn Sie eine Schriftart für ein Applet ausgewählt haben, die auf dem aktuellen System nicht vorhanden ist, ersetzt Java diese automatisch durch die Standard-Schriftart. Mit dem folgenden Code können Sie eine Liste der auf dem System verfügbaren Schriftarten anzeigen:

String[] fontslist = this.getToolkit().getFontList();

Mit Hilfe dieser Liste ist häufig eine sinnvolle Entscheidung bei der Wahl der Schriftarten für Applets möglich. Doch es empfiehlt sich weiterhin, den Standardschriften wie TimesRoman, Helvetica und Courier den Vorrang zu geben.

Anzeige von Zeichen und Zeichenketten

Mit einem Font-Objekt können Sie mit den Methoden drawChars() und drawString() Text am Bildschirm anzeigen. Doch zunächst müssen Sie die aktuelle Schriftart für das Font-Objekt mit der Methode setFont einrichten.

Die aktuelle Schriftart bildet einen Teil des Grafikstatus, der von dem Graphics-Objekt, in dem Sie zeichnen, aufgenommen wird. Jedesmal wenn Sie ein Zeichen oder eine Zeichenkette am Bildschirm ausgeben, zeichnet Java den Text in der aktuellen Schriftart. Um die Schriftart eines Textes zu ändern, müssen Sie also zunächst die aktuelle Schriftart neu definieren. Im folgenden sehen Sie eine paint()-Methode, die eine neue Schriftart festlegt, diese als aktuelle Schriftart definiert und die Zeichenkette »This is a big font.« ab Punkt 10, 100 ausgibt:

public void paint(Graphics g) {

    Font f = new Font("TimesRoman", Font.PLAIN, 72);

    g.setFont(f);

    g.drawString("This is a big font.", 10, 100);

}

Dieser Code kommt Ihnen vermutlich bekannt vor, denn damit wurden alle Beispiele des Hello World- und Hello Again-Applet in diesem Buch erstellt.

Die letzten beiden Argumente von drawString bestimmen den Punkt, an dem die Zeichenkette beginnt. Der X-Wert ist der Anfang des linken Textrandes. Y ist die Grundlinie für die gesamte Zeichenkette.

Die drawChars-Methode ist ähnlich, hat jedoch als Argument keine Zeichenkette, sondern eine Reihe von Zeichen. drawChars() hat fünf Argumente: Die Reihe der Zeichen, eine ganze Zahl, die das erste Zeichen der Reihe darstellt, eine weitere ganze Zahl für das letzte Zeichen der Reihe (alle Zeichen zwischen dem ersten und dem letzten werden gezeichnet) und X und Y für den Anfangspunkt. In den meisten Fällen ist drawString() nützlicher als drawChars().

Listing 9.2 zeigt ein Applet, das mehrere Textzeilen in verschiedenen Schriftarten anzeigt. Das Ergebnis ist in Abb. 9.20 zu sehen.

Listing 9.2: Viele verschiedene Schriftarten

 1: import java.awt.Font;

 2: import java.awt.Graphics;

 3:

 4: public class ManyFonts extends java.applet.Applet {

 5:

 6:    public void paint(Graphics g) {

 7:        Font f = new Font("TimesRoman", Font.PLAIN, 18);

 8:        Font fb = new Font("TimesRoman", Font.BOLD, 18);

 9:        Font fi = new Font("TimesRoman", Font.ITALIC, 18);

10:        Font fbi = new Font("TimesRoman", Font.BOLD + Font.ITALIC, 18);

11:

12:        g.setFont(f);

13:        g.drawString("This is a plain font", 10, 25);

14:        g.setFont(fb);

15:        g.drawString("This is a bold font", 10, 50);

16:        g.setFont(fi);

17:        g.drawString("This is an italic font", 10, 75);

18:        g.setFont(fbi);

19:        g.drawString("This is a bold italic font", 10, 100);

20:    }

21:

22: }

Informationen über eine Schriftart

Gelegentlich müssen Sie vielleicht Entscheidungen in einem Java-Programm auf der Basis der Qualität der aktuellen Schriftart treffen, z.B. in bezug auf deren Schriftgröße und die Gesamthöhe der Zeichen. Solche grundlegenden Informationen zu Schriftarten und Font-Objekten lassen sich mit einfachen Methoden für Graphics-Objekte und Font-Objekte ermitteln. Tabelle 9.1 listet einige dieser Methoden auf.

Tabelle 9.1: Font-Methoden

Weitere Informationen über die aktuelle Schriftart (die Länge oder Höhe bestimmter Zeichen) lassen sich mit der Klasse FontMetrics ermiteln. Sie beschreibt spezifische Informationen der betreffenden Schriftart, etwa den Abstand zwischen den Zeilen, die Höhe und Breite der einzelnen Zeichen usw.. Um mit diesen Werten zu arbeiten, müssen Sie ein FontMetrics-Objekt erstellen, das auf der aktuellen Schriftart basiert. Verwenden Sie dazu die Applet-Methode getFontMetrics():

Font f = new Font("TimesRoman", Font.BOLD, 36);

FontMetrics fmetrics = getFontMetrics(f);

g.setFont(f);

In Tabelle 9.2 finden Sie einige interessante Elemente, die Sie mit FontMetrics herausfinden können. Alle diese Methoden müssen für ein FontMetrics-Objekt aufgerufen werden.

Tabelle 9.2: FontMetrics-Methoden

Als Beispiel für die Art der Informationen, die Sie mit FontMetrics verwenden können, zeigt Listing 9.3 den Java-Code eines Applets, das eine Zeichenkette automatisch horizontal und vertikal im Applet-Bereich zentriert. Die Position dafür ändert sich je nach gewählter Schriftart und -größe. Durch die Verwendung von FontMetrics-Informationen können Sie die tatsächliche Größe einer Zeichenkette ermitteln und sie an der richtigen Stelle ausgeben. Abb. 9.21 zeigt das Ergebnis (weniger interessant als das Kompilieren und Experimentieren mit verschiedenen Applet-Größen).

Listing 9.3: Zentrieren einer Zeichenkette.

1: import java.awt.Font;

2: import java.awt.Graphics;

3: import java.awt.FontMetrics;

4:

5: public class Centered extends java.applet.Applet {

6:

7:    public void paint(Graphics g) {

8:        Font f = new Font("TimesRoman", Font.PLAIN, 36);

9:        FontMetrics fm = getFontMetrics(f);

10:        g.setFont(f);

11:

12:        String s = "This is how the world ends.";

13:        int xstart = (size().width – fm.stringWidth(s)) / 2;

14:        int ystart = size().height / 2;

15:

16:        g.drawString(s, xstart, ystart);

17:    }

18:}

Beachten Sie, daß die Methode size() in den Zeilen 13 und 14, die Breite und Höhe des gesamten Applet-Bereichs als Dimension-Objekt ausgibt. Sie können die individuelle Breite und Höhe mit den Instanzvariablen width und height für diese Dimension ermitteln, indem Sie den Methodenaufruf und den Variablennamen verketten.

Beachten Sie ferner, daß die Textzeile, wie in Abb. 9.21 zu sehen, nicht exakt vertikal innerhalb des Applet-Bereichs zentriert ist. Dieses Beispiel zentriert die Grundlinie des Textes innerhalb des Applets. Wenn Sie die Methoden getAscent() und getDescent() aus der FontMetrics-Klasse verwenden (um die Anzahl der Pixel von der Grundlinie bis zum Ende der Oberlänge von Zeichen bzw. zum Ende der Unterlänge von Zeichen zu erhalten), können Sie die Mitte der Textzeile exakt bestimmen.

Farben

Das Zeichnen schwarzer Linien und Textzeichen auf einem grauen Hintergrund mag ja ganz nett sein, aber die Auswahl zwischen verschiedenen Farben wäre doch noch etwa besser. Java enthält in der Color-Klasse Methoden und Eigenschaften zur allgemeinen Arbeit mit Farben. Ferner stehen Methoden zum Einstellen von aktuellen Hinter- und Vordergrundfarben zur Verfügung. Dies bietet die Möglichkeit, mit den von Ihnen definierten Farben zu zeichnen.

Das abstrakte Farbmodell von Java verwendet 24-Bit-Farben, wobei eine Farbe jeweils aus einer Kombination von Rot-, Grün- und Blauwerten besteht. Jede Komponente einer Farbe kann eine Nummer von 0 bis 255 erhalten. 0,0,0 ist z.B. die Farbe Schwarz, währende 255,255,255 weiß ist. Auf diese Weise lassen sich in Java Millionen von Farben erzeugen.

Das abstrakte Farbmodell von Java wird auf jenem Farbmodell abgebildet, das sich auf dem System befindet, auf welchem Java ausgeführt wird. Hier stehen häufig nur 256 Farben oder weniger zur Verfügung. Wenn eine benötigte Farbe in einem Color-Objekt nicht zur Anzeige zur Verfügung steht, kann die daraus resultierende Farbe auf einer anderen abgebildet werden, je nachdem, wie der Browser die Farbe implementiert und je nach aktueller Plattform. Mit anderen Worten: Obwohl Java zwar die Möglichkeit bietet mit Millionen von Farben zu arbeiten, läßt sich dies in der Praxis nicht immer umsetzen.

Mit Color-Objekt arbeiten

Um ein Objekt in einer bestimmten Farbe zu zeichnen, müssen Sie eine Instanz der Color-Klasse erstellen, welche diese Farbe repräsentiert. Die Color-Klasse definiert ein Set von Standard-Farbobjekten, welches in Klassenvariablen gespeichert wird, um Farbobjekte auf schnelle Weise in den gängigsten Farben zu erhalten. Mit Color.red erhalten Sie zum Beispiel ein Color-Objekt, das Rot (RGB-Wert von 255, 0, 0) darstellt. Color.white ergibt Weiß (RGB-Wert von 255, 255, 255) usw.. In Tabelle 9.3 sind jene Standardfarben aufgeführt, die durch Variablen in der Color-Klasse definiert werden können.

Tabelle 9.3: Standardfarben

Falls sich die gewünschte Farbe nicht unter diesen Standardfarbobjekten befindet, können Sie ein Farbobjekt auch durch jede beliebige Kombination aus Rot, Grün und Blau erstellen. Dazu müssen Sie allerdings die Werte der gewünschten Farbe kennen. Sie erstellen ein neues Farbobjekt wie folgt:

Color c = new Color(140,140,140);

Diese Zeile des Java-Codes erstellt ein Color-Objekt für die Farbe Dunkelgrau. Sie können jede beliebige Kombination aus Rot-, Grün- und Blauwerten zur Definition eines Color-Objekts angeben.

Alternativ erstellen Sie ein Color-Objekt mit den drei Gleitpunktzahlen von 0.0 bis 1.0:

Color c = new Color(0.55,0.55,0.55);

Aktuelle Farben testen und einrichten

Um ein Objekt oder Text mit einem Color-Objekt zu zeichnen, müssen Sie zunächst die aktuelle Farbe für dieses Objekt einrichten, ebenso wie Sie die aktuelle Schriftart definiert haben. Verwenden Sie dazu die Methode setColor() (eine Methode für Graphics-Objekte):

g.setColor(Color.green);

Nachdem Sie die aktuelle Farbe definiert haben, werden alle Zeichenoperationen mit dieser Farbe durchgeführt.

Neben dem Einrichten von aktuellen Farben für den grafischen Bereich können Sie auch die Hinter- und Vordergrundfarben für das Applet selbst mit den Methoden setBackground() und setForeground() einstellen. Beide Methoden sind in der Klasse java.awt.Component definiert. Von dieser Klasse erbt Applet und damit alle Ihre Klassen automatisch.

Die Methode setBackground() definiert die Hintergrundfarbe für ein Applet, die standardmäßig hellgrau ist (um eine Übereinstimmung mit der Standardhintergrundfarbe der Browser zu erzeugen). Sie verwendet ein einziges Argument, ein Color-Objekt:

setBackground(Color.white);

Die Methode setForeground() verwendet ebenfalls eine einzelne Farbe als Argument. Die Vordergrundfarbe wird für alle Elemente benutzt, die im Applet gezeichnet werden, ungeachtet der Farbe, in der sie gezeichnet wurden. Sie können setForeground() dazu verwenden, die Farbe alle Elemente im Applet zu ändern, ohne diese dafür neu zeichnen zu müssen.

setForeground(Color.black);

Neben den Methoden setColor(), setForeground() und setBackground() gibt es noch entsprechende get-Methoden, mit denen Sie die aktuelle Grafikfarbe sowie Hintergrund und Vordergrund abrufen können. Diese Methoden sind getColor() (im Graphics-Objekt definiert), getForeground() (im Applet definiert) und getBackground() (ebenfalls im Applet). Sie können diese Methoden dazu verwenden, Farben auf der Basis von bereits im Applet vorhandenen Farben auszuwählen:

setForeground(g.getColor());

Einfaches Farbbeispiel

Listing 9.4 zeigt den Code für ein Applet, das den Zeichenbereich des Applets mit quadratischen Kästchen füllt, die jeweils eine zufällig gewählte Farbe enthalten. Dieser Code ist so geschrieben, daß er für alle Applet-Größen benutzt werden kann und den verfügbaren Bereich automatisch mit der entsprechenden Anzahl von Kästchen ausfüllt.

Listing 9.4: Kästchen mit Zufallsfarben

1:  import java.awt.Graphics;

2:  import java.awt.Color;

3:

4:  public class ColorBoxes extends java.applet.Applet {

5:

6:      public void paint(Graphics g) {

7:          int rval, gval, bval;

8:

9:          for (int j = 30; j < (size().height -25); j += 30)

10:             for (int i = 5; i < (size().width -25); i += 30) {

11:                 rval = (int)Math.floor(Math.random() * 256);

12:                 gval = (int)Math.floor(Math.random() * 256);

13:                 bval = (int)Math.floor(Math.random() * 256);

14:

15:                 g.setColor(new Color(rval,gval,bval));

16:                 g.fillRect(i, j, 25, 25);

17:                 g.setColor(Color.black);

18:                 g.drawRect(i-1, j-1, 25, 25);

19:             }

20:     }

21: }

Kern dieses Beispiels sind die zwei for-Schlaufen. Die erste zeichnet die Zeilen und die zweite gibt die einzelnen Kästchen in den Zeilen aus. Beim Zeichnen eines Kästchens wird zuerst die Zufallsfarbe ermittelt, anschließend wird das Kästchen gezeichnet. Um jedes Kästchen wird eine schwarze Umrißlinie gezogen, damit diese nicht von der Hintergrundfarbe des Applet überblendet werden. Da diese paint()-Methode neue Farben erzeugt, sobald das Applet ausgeführt wird, können Sie die Farben regenerieren, indem Sie das Applet-Fenster verschieben oder durch ein anderes Fenster überlagern. Abb. 9.22 zeigt das endgültige Applet (obwohl der Schwarzweiß-Druck die Farbpalette natürlich nicht wiedergeben kann).

Standardsystemfarben verwenden (nur Java 1.1)

Eine der neuen Funktionen in Java 1.1 bietet die Möglichkeit, das Farbschema der Systemfarben zu verwenden, welches der Benutzer für den Desktop, die Fenster und andere Elemente der Bildschirmanzeige ausgewählt hat.

Diese Farben lassen sich unter Bezug auf die Variablen der SystemColor-Klasse verwenden, die Teil des Klassenpakets java.awt ist. Die Variablen für SystemColor werden mit Methoden verwendet, welche die aktuelle Farbe auf dieselbe Weise definieren wie die bereits erläuterten Color-Variablen.

Die folgende Anweisung wählt die Systemfarbe für den Desktop – durch SystemColor.desktop definiert – als aktuellen Hintergrund aus:

setBackground(SystemColor.desktop);

Diese Farben stellen keinen speziellen RGB-Wert dar, darin unterscheiden sie sich von den Color-Variablen, denn der Benutzer kann diese Farben jederzeit ändern. Tabelle 9.4 listet einige der 26 Systemfarben auf, die Sie in Ihren Programmen verwenden können. Wenn Sie eigene grafische Benutzeroberflächen für Programme erstellen, werden Sie diese sicher häufiger benötigen. Denn damit lassen sich Programme an jene Oberflächen anpassen, die der Benutzer bereits für sein System gewählt hat.

Tabelle 9.4: Systemfarben

Listing 9.5 zeigt ein kurzes Applet, das einige dieser Systemfarben als Text oder Rechtecke verwendet. Laden Sie das Programm mehrere Male mit dem Applet-Viewer, nachdem Sie das Farbschema Ihres Systems geändert haben.

Listing 9.5: Der komplette Text von SysColor.java

1: import java.awt.Graphics;

 2: import java.awt.SystemColor;

 3:

 4: public class SysColor extends java.applet.Applet {

 5:

 6:     public void init() {

 7:         setBackground(SystemColor.window);

 8:     }

 9:

10:     public void paint(Graphics g) {

11:         g.setColor(SystemColor.windowText);

12:         g.drawString("Window text is this color", 20, 50);

13:         g.setColor(SystemColor.activeCaption);

14:         g.fillRect(5, 58, 180, 19);

15:         g.setColor(SystemColor.activeCaptionText);

16:         g.drawString("Active caption colors", 20, 70);

17:         g.setColor(SystemColor.inactiveCaption);

18:         g.fillRect(5, 78, 180, 19);

19:         g.setColor(SystemColor.inactiveCaptionText);

20:         g.drawString("Inactive caption colors", 20, 90);

21:     }

22: }

Bei der Übertragung in den Schwarzweiß-Druck dieses Buches wird das Beispiel sicherlich etwas weniger deutlich sein, dennoch ist in Abb. 9.23 dargestellt, wie das SysColor-Applet aussieht, wenn Sie es auf einer Webseite laden und mit dem Applet-Viewer anzeigen.

Zusammenfassung

Sie stellen Elemente am Bildschirm dar, indem Sie diese innerhalb eines Applets zeichnen: Formen, Grafiken, Text oder Bilder. Heute haben Sie die Grundlagen zum Zeichnen in Java kennengelernt, einschließlich der Verwendung von Graphics-Objekten zum Erstellen rudimentärer Formen. Ferner wissen Sie nun, wie die Schriftarten und die Maße zu den Schriftarten für die Texteingabe verwendet werden.

Darüber hinaus haben Sie mit Farbobjekten gearbeitet, um die Farbe eines am Bildschirm gezeichneten Elements zu ändern. Sie wissen, daß Sie in Java 1.1 mit der SystemColor-Klasse Ihre Programme so gestalten können, daß diese den vom Benutzer ausgewählten Systemfarben entsprechen. Diese Grundlagen für das Zeichnen bieten die Möglichkeit, auch Animation innerhalb von Applets einzufügen (dazu ist eigentlich nur ein wiederholtes Zeichnen am Bildschirm erforderlich) und mit Bildern zu arbeiten. Diese Themen werden morgen behandelt.

Fragen und Antworten

F In allen Beispielen und den Tests aus diesem Kapitel, die ich durchgearbeitet habe, werden mit Grafikelementen wie drawLine und drawRect Linien produziert, die ein Pixel breit sind. Wie kann ich dickere Linien zeichnen?

A In der derzeitigen Version der Graphics-Klasse von Java ist das nicht möglich. Es gibt keine Methoden zum Ändern der Standardstrichbreite. Wenn Sie unbedingt dickere Linien zeichnen möchten, können Sie mehrere Linien in je einem Pixel Abstand plazieren, um diese Wirkung zu erhalten.

F Ich möchte eine Textzeile mit einem fett gedruckten Wort in der Mitte zeichnen. Ich weiß, daß ich zwei Font-Objekte – eine für die reguläre Schrift und eines für den Fettdruck – erstellen muß und, daß ich die aktuelle Schriftart dazwischen wieder einstellen muß. Das Problem ist, daß drawString() eine X- und Y-Position für den Anfang der Zeichenketten erfordert und ich keinen Bezugspunkt dafür finde. Wie kann ich herausfinden, wo das fettgedruckte Wort beginnt?

A Die Möglichkeiten, mit Java Text anzuzeigen, sind relativ primitiv. Java hat kein Konzept für den aktuellen Punkt, deshalb müssen Sie selbst herausfinden, wo das Ende der ersten Zeichenkette liegt, um bestimmen zu können, wo die nächste beginnt. Mit der Methode stringWidth() können Sie sowohl die Breite einer soeben gezeichneten Zeichenkette ermitteln und zusätzlichen Raum danach einfügen.

F Ich habe das Applet mit den Zufallsfarben ausprobiert, aber jedesmal werden zwar eine Menge Kästchen gezeichnet, viele enthalten aber dieselbe Farbe. Wenn die Farben wirklich zufällig ermittelt werden, wie ist das dann möglich?

A Dafür gibt es zwei Gründe. Erstens: Der Zufallsgenerator, den ich in diesem Code verwendet habe (aus der Math-Klasse) ist nicht besonders gut, dies wird sogar in der Dokumentation für diese Methode erwähnt. Wenn Sie einen besseren Zufallsgenerator verwenden möchten, benutzen Sie die Random-Klasse aus dem Paket java.util.

Zweitens: Der wahrscheinlichere Grund liegt aber wohl darin, daß in Ihrem Browser bzw. Ihrem System nicht genügend Farben zur Verfügung stehen, um alle Farben zu zeichnen, die das Applet erzeugt. Wenn Ihr System nicht die breite Farbpalette für die Color-Klasse unterstützt, oder wenn der Browser zu viele Farben für andere Elemente belegt hat, werden die Farben in den Kästchen doppelt angezeigt. Dies hängt davon ab, wie der Browser bzw. das System für solche Situationen konfiguriert ist. Im allgemeinen verwendet ein Applet nicht so viele Farben, deshalb werden Sie diesem Problem auch nicht allzu häufig begegnen.

F Ich habe festgestellt, daß es neben drawRect() und drawRoundRect() auch noch die Methode draw3Drect()gibt. Sie haben dazu gar nichts erwähnt. Warum?

A Die Methode draw3Drect()zeichnet dreidimensionale Rechtecke. Dies hört sich zwar großartig an, aber beim aktuellen Stand der Dinge erlaubt Java lediglich eine Strichbreite von 1 Pixel und dies hat leider den Nachteil, daß die Rechtecke nicht allzu dreidimensional aussehen. Deshalb habe ich diese Methode in diesem Kapitel nicht erläutert.

F Ich habe einen gekachelten Hintergrund auf meiner Webseite. Ich kann Bilder mit transparenten Hintergründen erstellen, damit der gekachelte Hintergrund hindurch scheint. Ist dies auch bei Applets möglich?

A Mit Java 1.1 können Sie keine transparenten Applet-Hintergründe erstellen, damit die Webseite hindurchscheint. Für Applets empfiehlt sich generell ein einfarbiger Hintergrund. Sie können aber die Hintergrundfarbe des Applet an die Hintergrundfarbe der Webseite anpassen, damit diese nicht noch einmal extra abgehoben wird.

Dazu habe ich noch eine Idee: Wenn Sie für den Seitenhintergrund ein gekacheltes Bild verwenden, können Sie dieses importieren und als Hintergrund für das Applet zeichnen (darüber erfahren Sie morgen mehr). Wenn Sie diese Technik verwenden, müssen die Ränder der Kacheln aber exakt angepaßt werden, damit ein übergangsloses Erscheinungsbild entsteht. Dies ist sehr schwer, weil sich nicht exakt bestimmen läßt, an welcher Position auf der Seite das Applet erscheint. Eine wirklich perfekte Lösung für dieses Problem gibt es leider im Augenblick nicht.