Grafičko programiranje

Grafičko sučelje i grafičke biblioteke

• Moderni operacijski sustavi imaju grafičko sučelje.
• Microsoft Windows ili Mac imaju vlastiti Windows sistem prepoznatljive vanjske grafike
• UNIX/Linux platforme su fleksibilnije - tamo se grafičko sučelje bazira na Xwindow sustavu
na koji se dodaju različiti window manager-i koji se mogu razlikovati u vanjštini npr. CDE,
GNOME, ..., ali im je unutranja arhitektura slična
• Prva računala sa grafičkim sučeljem nastala su oko 1973 u Xerox Parc
laboratorijama, kasnije komercijalne verzije su se počele pojavljivati negdje u
periodu 1980-1983: Apple, XWindows, Microsoft Windows
• Zajedničko svima je što oslobađaju korisnika od pamćenja i izvršavanja rutinskih
naredbi u naredbenom retku
• Korištenje prozora je intuitivno zbog upotrebe miša na raznim grafičkim
komponentama (meni, ikone, gumbi,...)
GUI programiranje
• Gotovo svi proizvođači softverskih alata podržavaju izradu grafičkih
aplikacija u njima -naziva se i GUI programiranje, GUI=graphical user
interface – standard današnjih aplikacija
• Postoje mnoge grafičke biblioteke neke od njih su: Win32/C, MFC
(Microsoft Foundation classes)/C++, VCL/Delphi, Qt/C++, GTK+/C,
Swing/Java ...

• Zajednički nazivnik svih biblioteka (ili gotovo svih) da koriste obilato

objektno-orijentirano programiranje (čak i kada ga jezik ne podržava
eksplicitno kao što je slučaj s C-om)
GUI u Javi
• Nalazi se u paketima java.awt.* i javax.swing.* (AWT=abstract window toolkit)
• java.awt je stariji paket koji je samo tanak omotač oko odgovarajućih grafičkih komponenti koje postoje na
operacijskom sustavu na kojem se program izvršava.
• javax.swing -uzima iz sistema samo najnužnije i kreira grafičke komponente direktno u Javi .
• Paket java.awt postoji u Javi od verzije 1.0. Budući da za kreiranje grafičkih komponenti na ekranu koristi
biblioteke grafičkih rutina prisutne na danoj platfomi, program pisan s awt rutinama ima različit izgled na
različitim platformama. Takav dizajn grafičkog sučelja u Javi brzo je pokazao svoje nedostatke koji proizlaze
iz razlika prisutnih u grafičkim bibliotekama na različitim platformama. Štoviše, jedan te isti program može
pokazivati različite bugove na različitim platformama.

• Paket javax.swing uveden je u Javu u verziji 1.2 s idejom da ispravi nedostatke AWT-a. Swing koristi tek
minimalno grafičke rutine platforme na kojoj se program izvršava i stoga daje programskom sučelju
konsistentan izgled na različitim platformama. Pored tog Swing ima znatno bogatiji izbor grafičkih
komponenti i danas je Java-in standardni paket za kreiranje korisničkog sučelja. Ipak, Swing nije potpuna
zamjena za AWT i oba se paketa često koriste zajedno.

Kreiranje prozora
• Prozor najviše razine u jednoj aplikaciji
(prozor koji nije sadržan u drugom
prozoru) naziva se frame u Javinoj
terminologiji.
• U AWT biblioteci modelira ga klasa
Frame, a u swing biblioteci klasa
JFrame, koja proširuje Frame. JFrame je
jedna od rijetkih Swing komponenti
koju iscrtavaju grafičke biblioteke na
danoj platformi.
import javax.swing.*;
public class SimpleFrameTest {
public static void main(String[] args) {
SimpleFrame frame = new SimpleFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}
class SimpleFrame extends JFrame
{
public SimpleFrame()
{
setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);
}
public static final int DEFAULT_WIDTH = 300;
public static final int DEFAULT_HEIGHT = 200;
}
Jpanel
Jframe
lanac
nasljeđivanja
java.awt za pozicioniranje ekrana
• JFrame nasljeđuje brojne metode od klasa Window i Container. Među njima su i metode za
pozicioniranje prozora na ekranu: setSize i setLocation, no da bismo dobro pozicionirali ekran
trebamo znati njegovu rezoluciju. Tu informaciju možemo dobiti od klase java.awt.Toolkit.

• Koordinate točke na ekranu izražavaju se u pikselima. Ishodište koordinatnog sustava (0,0) je u

lijevom gornjem vrhu ekrana; os x ide slijeva na desno, a os y odozgo prema dolje. U paketu
java.awt postoji klasa
• koja služi za reprezentaciju širine i visine ekrana. Dimenzije ekrana bismo dobili na sljedeći način:

Toolkit kit = Toolkit.getDefaultToolkit(); // Statička metoda

Dimension screen = kit.getScreenSize();
int height = screen.height; // Javne varijable članice !!
int width = screen.width;
public SimpleFrame()
{
Toolkit kit = Toolkit.getDefaultToolkit(); // Statička metoda
Dimension screen = kit.getScreenSize();
//setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);
// Centriramo prozor na ekranu

int height = screen.height; // Javne varijable člabice !!

int width = screen.width;
setSize(width/2, height/2);
setLocation(width/4, height/4);

setTitle("Centrirani prozor");
}
JPanel
• Moguće je direktno prikazivati informacije u frame-u, no to nije dobar način konstrukcije
korisničkog sučelja. Frame je komponenta koja je namijenjena držanju drugih,
specijaliziranih komponenti. Za crtanje koristimo komponentu koja se naziva JPanel.

• Da bismo dodali neku komponentu prozoru (JPanel) treba prvo od prozora dobiti content
pane pomoću metode getContentPane. Content pane je Container u koji stavljamo druge
komponente. U tu svrhu on ima metodu add. Kod za dodavanje komponente izgleda
ovako:

• Container contentPane = frame.getContentPane();

• Component c = ....
• contentPane.add(c);
JPanel
• JPanel klasa implementira panel. Panel je
• Površina po kojoj se može crtati;
• Container koji može sadržavati druge komponente.

• Za crtanje:

• Definira se klasa koja proširuje JPanel;

• Preradi (nadjača) se metoda paintComponente u kojoj se treba nalaziti kod za
crtanje.
Grafički objekti
• Metoda paintComponent definirana je u klasi JComponent i uzima
jedan argument tipa Graphics.
• Graphics je klasa koja sadrži metode za crtanje, pisanje i prikazivanje
slika. Svo crtanje u Javi ide kroz Graphics objekt.
class MojPanel extends JPanel
{
public void paintComponent(Graphics g)
{
// kod za crtanje
}
}
Svaki puta kad je potrebno iscrtati panel event handler
će pozvati metodu paintComponent automatski. Isto
vrijedi za paintComponent metode svih drugih
komponenti.

Programer nikad ne poziva metodu paintComponent

sam! Stoga ne moramo brinuti niti o konstrukciji i
konfiguraciji Graphics objekta. U paintComponent se
samo koristi.
package helloworld;
import java.awt.*;
import javax.swing.*;

public class HelloWorld

{
public static void main(String[] args)
{
HelloWorldFrame frame = new HelloWorldFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}
class HelloWorldFrame extends JFrame
{
public HelloWorldFrame()
{
setTitle("Hello World");
setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);
// Dodajemo panel na frame
// Uzmimo content pane na koji ćemo zalijepiti naš panel
Container contentPane = getContentPane(); // metoda iz JFrame

// Kreiramo naš panel

HelloWorldPanel panel = new HelloWorldPanel();
// Dodajemo ga u content pane
contentPane.add(panel);
class HelloWorldPanel extends JPanel
}
{
public void paintComponent(Graphics g)
public static final int DEFAULT_WIDTH = 300;
{
public static final int DEFAULT_HEIGHT = 200;
super.paintComponent(g);
}
g.drawString("Hello World!",MESSAGE_X, MESSAGE_Y);
}

public static final int MESSAGE_X = 105;

public static final int MESSAGE_Y = 100;
}
Metode za crtanje
public void paintComponent(Graphics g)
{
Graphics2D g2 = (Graphics2D) g;
...
}
• 2D biblioteka ima niz geometrijskih oblika:

• Point2D
• Line2D
• Rectangle2D
• Shape2D java.awt.geom
package drawtest;
import java.awt.*;
import java.awt.geom.*;
import javax.swing.*;

public class DrawTest

{
public static void main(String[] args)
{
DrawFrame frame = new DrawFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}
class DrawFrame extends JFrame
{
public DrawFrame()
{
setTitle("DrawTest");
setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);

Container contentPane = getContentPane();

DrawPanel panel = new DrawPanel();
contentPane.add(panel);
}

public static final int DEFAULT_WIDTH = 400;

public static final int DEFAULT_HEIGHT = 400;
}
class DrawPanel extends JPanel
{
public void paintComponent(Graphics g)
{
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;

// crtamo pravokutnik
double leftX = 100;
double topY = 100;
double width = 200;
double height = 150;

Rectangle2D rect = new Rectangle2D.Double(leftX, topY, width, height);

g2.draw(rect);

// crtamo elipsu unutar pravokutnika rect

Ellipse2D elipsa = new Ellipse2D.Double();
elipsa.setFrame(rect);
g2.draw(elipsa);
// crtamo dijagonalnu liniju
g2.draw(new Line2D.Double(leftX, topY, leftX+width, topY+height));

// crtamo krug s istim centrom

double centerX = rect.getCenterX();
double centerY = rect.getCenterY();
double radius = 150;

Ellipse2D krug = new Ellipse2D.Double();

krug.setFrameFromCenter(centerX, centerY, centerX+radius, centerY+radius);
g2.draw(krug);
}
}