Lekce 2 - Programování jednoduchých Java GUI her - Kreslení

V minulé lekci, Programování jednoduchých Java GUI her - IDE, Okno, Panel, jsme se seznámili s komponentami JFrame a JPanel z balíčku javax.swing.

V tomto díle se podíváme na to, jak na JPanel kreslit různé tvary a text.

Kreslení

Třída hlavního okna bude zůstávat většinou stejná jako v předchozích příkladech.

import javax.swing.JFrame;

public class MujProgram extends JFrame {

    MujProgram() {
        this.setTitle("Jednoduchý Kreslící Program");
        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        KresliciPanel panel = new KresliciPanel();
        this.add(panel);

        this.pack();
    }

    public static void main(String[] args) {
        MujProgram program = new MujProgram();
        program.setVisible(true);
    }
}

Měnit se bude hlavně třída panelu.

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Font;
import java.awt.Graphics;
import javax.swing.JPanel;

public class KresliciPanel extends JPanel {

    public KresliciPanel() {
        this.setPreferredSize(new Dimension(400, 300));
        this.setFont(new Font("Courier", Font.BOLD, 20));
        this.setBackground(Color.RED);
    }

    public void paintComponent(Graphics g) {
        super.paintComponent(g);

        // Kreslení textu
        g.drawString("Ahoj", 50, 80);
        g.setColor(Color.GREEN);
        g.drawString("Nazdar", 120, 70);
        g.setColor(Color.WHITE);
        g.drawString("Čau", 10, 210);

        // Kreslení čar
        g.drawLine(30, 30, 200, 90);
        g.drawLine(50, 110, 90, 30);
        g.setColor(Color.MAGENTA);
        g.drawLine(10, 250, 360, 40);

        // Kreslení a vyplňování tvarů
        g.drawRect(300, 20, 65, 35);

        g.setColor(Color.DARK_GRAY);
        g.fillRect(200, 150, 50, 30);
        g.drawRect(200, 150, 50, 30);

        g.fillOval(320, 260, 70, 30);
        g.setColor(Color.CYAN);
        g.drawOval(320, 260, 70, 30);
    }
}

Kreslení na Graphics v Java Swing - Tvorba her v Java Swing

Přibyly nám dva nové importy z balíčku AWT. Třída Font slouží pro práci s písmem a třída Graphics pro práci s grafikou.

public KresliciPanel() {
    this.setPreferredSize(new Dimension(400, 300));
    this.setFont(new Font("Courier", Font.BOLD, 20));
    this.setBackground(Color.RED);
}

Pokud nám nevyhovuje přednastavené písmo, můžeme sami určit, jaký font se má použít. Stačí vytvořit instanci třídy Font a zadat tři parametry (typ písma, jaké má být, velikost v bodech). Jaké typy písma jsou k dispozici záleží na vašem operačním systému. K tomu zda má být písmo tučně, normálně či kurzívou slouží konstanty Font.BOLD, Font.PLAIN a Font.ITALIC.

Komponenty, na které je možno malovat, poskytují metodu paintComponent(), krerá je volána při vykreslení komponenty a ve které můžeme nadefinovat, co se má na komponentu kreslit.

public void paintComponent(Graphics g) {
}

Parametr Graphics představuje grafický kontext a umožňuje nám kreslení na libovolné grafické zařízení a je do metody vložen, takže se nemusíme starat o jeho vytvoření. Můžeme ho jednoduše rovnou začít používat.

super.paintComponent(g);

V naší třídě jsme přepsali metodu painComponent() a tím pádem jsme ztratili funkcionalitu, která byla naprogramována v rodičovské třídě. Tato metoda například kreslí pozadí. To by se nám docela hodilo takže to uděláme tak, že zavoláme rodičovskou metodu, ta se provede a pak se vykoná kód, který jsme napsali my.

// Kreslení textu
g.drawString("Ahoj", 50, 80);
g.setColor(Color.GREEN);
g.drawString("Nazdar", 120, 70);
g.setColor(Color.WHITE);
g.drawString("Čau", 10, 210);

Pokud chceme nakreslit text, voláme metodu drawString() třídy Graphics. Jako parametr zadáváme požadovaný text a souřadnice, kam chceme text nakreslit. Metoda setColor() nastavuje barvu, kterou se bude kreslit.

// Kreslení čar
g.drawLine(30, 30, 200, 90);
g.drawLine(50, 110, 90, 30);
g.setColor(Color.MAGENTA);
g.drawLine(10, 250, 360, 40);

Metoda drawLine(x1, y1, x2, y2) nakreslí čáru od bodu se souřadnicemi [x1, y1] k bodu se souřadnicemi [x2, y2].

// Kreslení a vyplňování tvarů
g.drawRect(300, 20, 65, 35);

g.setColor(Color.DARK_GRAY);
g.fillRect(200, 150, 50, 30);
g.drawRect(200, 150, 50, 30);

g.fillOval(320, 260, 70, 30);
g.setColor(Color.CYAN);
g.drawOval(320, 260, 70, 30);

Metoda drawRect(x1, y1, šířka, výška) nakreslí obrys obdélníku. Výplň obdélníku se provede metodou fillRect(x1, y1, šířka, výška). Doporučený postup je nejdříve provést vyplnění a teprve poté obrys, zvlášť pokud používáte rozdílné barvy. Metoda fillOval(x1, y1, šířka, výška) a drawOval(x1, y1, šířka, výška) vyplňuje a kreslí elipsu a zadané parametry určují obrysový obdélník elipsy. Kreslících metod existuje samozřejmě mnohem více a já vám ukáži ještě jednu užitečnou.

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import javax.swing.JPanel;

public class KresliciPanel2 extends JPanel {
    private int[] souradniceX = {
        50, 50, 70, 70, 90, 90, 110, 110,
        130, 130, 150, 150, 250, 250, 270,
        270, 290, 290, 310, 310, 330, 330,
        350, 350, 330, 330, 300, 270, 270};
    private int[] souradniceY = {
        300, 120, 120, 140, 140, 120, 120,
        140, 140, 120, 120, 200, 200, 50,
        50, 70, 70, 50, 50, 70, 70, 50, 50,
        300, 300, 240, 210, 240, 300};

    public KresliciPanel2() {
        this.setPreferredSize(new Dimension(400, 300));
        this.setBackground(Color.blue);
    }

    @Override
    public void paintComponent(Graphics g) {
        super.paintComponent(g);

        // parametry: pole souřadnic bodu x, pole souřadnice bodu y, počet bodů
        g.setColor(Color.darkGray);
        g.fillPolygon(souradniceX, souradniceY, souradniceX.length);
        g.drawPolygon(souradniceX, souradniceY, souradniceX.length);
    }
}