Programiranje GUI-ja u Javi

Objekt JFrame

• Okvir je objekt u kome korisnik gradi interfejs. Svaka aplikacija koju gradimo
proširuje (extends) objekt JFrame, što znači da će naša aplikacija ****acquire
sve karakteristike okvira. To je centralna stvar u razvoju Java GUI aplikacija.
Okvir je objekt kontejner (container), pošto on „drži” druge kontrole. Jedno od
svojstava objekta kontejner je svojstvo vidlivosti (visible property) koje ako se
postavi na vrednost false, znači da će sve kontrole postati nevidljive.

• Ovde ćemo objasniti neka šire korišćena svojstva (Properties), metode

(Methods) i događaje (Events) okvira (frame). Da vas podsetim, svojstva
opisuju izgled i vrednost kontrole, metode su akcije koje možete ****impose na
kontrolama a događaji se pojavlju kada se nešto uradi sa kontrolom (obično od
strane korisnika). Ovo nije ****exhaustive list – potražite u literaturi iscrpnije
informacije. Možda sada ne prepoznajete sve pomenute termine, ali kako vaše
učenje bude napredovalo biće vam sve jasnije.

• Svojstva okvira (Frame Properties):

title Naslov prozora okvira.

font Naziv, stil, veličina fonta.
background Boja pozadine okvira.
foreground Boja teksta ili grafike.
x Rastojanje od leve ivice ekrana do leve ivice okvira, u
pikselima.
y Rastojanje od gornje ivice ekrana do gornje ivice okvira, u
pikselima.
width Širina okvira u pikselima.
height Visina okvira u pikselima.
resizable Logička (Boolean) vrednost koja pokazuje da li je okvir
fiksne ili podesive veličine.
visible Ako je false, tada je okvir sakriven (i sve njegove
kontrole).

• Metode okvira (Frame Methods):

setTitle Postavlja naslov prozora okvira.

setFont Postavlja naziv, stil, veličinu fonta.
setBackground Postavlja boju pozadine okvira.
setForeground Postavlja boju teksta ili grafike.
 getX Daje rastojanje od leve ivice ekrana do leve ivice okvira, u
pikselima.
getY Daje rastojanje od gornje ivice ekrana do gornje ivice
okvira, u pikselima.
getWidth Daje širinu okvira u pikselima.
getHeight Daje visinu okvira u pikselima.
setBounds Koristi se da pozicionira okvir na ekranu.
setResizable Postavlja logićku (boolean) vrednost koja pokazuje da li je
okvir fiksne ili podesive veličine.
setVisible Postavlja logičku (boolean) vrednost koja pokazuje da li
je okvir vidljiv ili ne.

• Događaji okvira (Frame Event):

windowClosing Pojavljuje se (WindowEvent) kada se forma zatvara.

Dodaje se sa WindowListener pomoću
WindowAdaptera.

• Slušalac (listener) za događaj windowClosing dodaje se u metodi konstruktora

okvira pomoću:

addWindowListener(new WindowAdapter()
{
public void windowClosing(WindowEvent e)
{
exitForm(e);
}
});

A uobičajena metoda exitForm je:

private void exitForm(WindowEvent e)

{
System.exit(0);
}

• Tipična radnje vezane za upotrebu objekta okvira:

¾ Kreiranje objekta okvir, korišćenjem uobičajene metode konstruktora.

¾ Postavljanje svojstva title.
¾ Centriranje okvira u sredini ekrana (biće kasnije objašnjeno kako se to radi).
¾ Postavljanje svojstva resizable na false. Možete da imate forme podesive
veličine u Java GUI aplikacijama, ali toga neće biti na ovom kursu.
¾ Dodavanje slušaoca za događaj windowClosing.
¾ Attach menadžera GridBagLayout. Postavljanje kontrola u menadžer
rasporeda mreže i izvršavanje metode pack.

• Opšte okruženje Java koda za obavljanje ovih koraka za okvir sa nazivom

MyFrame (fajl mora da bude snimljen kao MyFrame.java) je:
/*
* MyFrame.java
*/
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;

public class MyFrame extends JFrame

{
public static void main(String args[])
{
//construct frame
new MyFrame().show();
}

public MyFrame()
{
// code to build the form
setTitle("My Frame");
setResizable(false);
addWindowListener(new WindowAdapter()
{
public void windowClosing(WindowEvent e)
{
exitForm(e);
}
});
getContentPane().setLayout(new GridBagLayout());
// code to position controls follows
.
.
.
pack();
}
private void exitForm(WindowEvent e)
{
System.exit(0);
}
}

Aranžiranje i centriranje okvira

• Da li ste primetili da je u svim aplikacijama koje smo do sada gradili okvir počinjao
u gornjem levom uglu ekrana? Međutim, bilo bi lepo kada bi okvir bio centriran
kada se aplikacija pokrene. Sada će biti pokazano kako to može da se uradi.
Prvo, pogledajmo kako veličinu okvira postavlja menadžer GridBagLayout.

• Koristimo menadžer GridBagLayout da postavimo naš GUI aplikacije (naravno,

možete koristite i druge menadžere rasporeda). Da vas podsetim, kod ovog
menaždera koristi se mreža (grid) za razmeštanje kontrola:
 gridx = 0 gridx = 1 gridx = 2 gridx = 3 gridx = 4
gridy = 0
gridy = 1
gridy = 2
gridy = 3
gridy = 4
gridy = 5

Objekt GridBagConstraints se koristi za smeštaj i pozicioniranje kontrole unutar

različitih elemenata mreže. Kontrole se smeštaju u ovu mrežu navođenjem
(referenciranjem) konkretne kolone (lokacija gridx) i reda (lokacija gridy). Videli
smo da se mreža (i okvir) automatski šire kako se dodaju kontrole. Širina kolone
se postavlja na „najširu” kontrolu u toj koloni. A visina reda se postavlja na
„najvišu” kontrolu u tom redu.

• There are other variables associated with GridBagConstraints that can be used
to adjust control size and, hence, associated column, row, and frame size. A
control can occupy more than one column or row. The number of columns
spanned by a control is set with the gridwidth variable; the number of rows
spanned is set with the gridheight variable. By default, a control fills one row and
one column. If we have a GridBagConstraints object named gridConstraints, a
control will occupy two rows and three columns, starting in the second column
(gridx = 1) and fourth row (gridy = 3), with this code:

gridConstraints.gridx = 1;
gridConstraints.gridy = 3;
gridConstraints.gridheight = 2;
gridConstraints.gridwidth = 3;

In our example grid, this control would be placed like this:

gridx = 0 gridx = 1 gridx = 2 gridx = 3 gridx = 4

gridy = 0
gridy = 1
gridy = 2
gridy = 3 Control goes here
gridy = 4
gridy = 5

• A particular control may completely fill its region or may not. If the control is
smaller than its allocated region, its dimensions may be adjusted to fill the region
– use the fill variable. There are four values:
 GridBagConstraints.NONE Control is not resized (default value)
GridBagConstraints.HORIZONTAL Control width fills display area.
GridBagConstraints.VERTICAL Control height fills display area.
GridBagConstraints.BOTH Control fills entire display area.

With our example gridConstraints object, a control will grow to fill the region
width using:

gridConstraints.fill = GridBagConstraints.HORIZONTAL;

This control would look like this in its grid region:

Control

• Smaller changes in control size can be made using the ipadx and ipady
variables. These determine how much a control size is to be increased beyond
its minimum size (in each direction). To add five pixels to the width and height of
a control using our gridConstraints example:

gridConstraints.ipadx = 5;
gridConstraints.ipady = 5;

• If you choose not to expand a control to fill its area, its position within its allocated
area is set with the anchor variable. There are nine possible values:

GridBagConstraints.NORTH Control is centered at top

GridBagConstraints.NORTHEAST
GridBagConstraints.EAST
GridBagConstraints.SOUTHEAST
GridBagConstraints.SOUTH
GridBagConstraints.SOUTHWEST
GridBagConstraints.WEST
GridBagConstraints.NORTHWEST
GridBagConstraints.CENTER
Control is in upper right corner
Control is at right, centered vertically
Control is in lower right corner
Control is centered at bottom
Control is in lower left corner
Control is at left, centered vertically
Control is in upper left corner
Control is centered horizontally and
vertically

To center a control (in both directions) in its display area, use:

gridConstraints.anchor = GridBagConstraints.CENTER;

This control would look like this in its grid region:

Control
• If a control completely fills its allocated display area, a border region (free space)
can be established around the control using the Insets object. Four values are
used to define the top, left, bottom and right side margins from the side of the
display area. The default is Insets(0, 0, 0, 0). With our example, if we want 10
pixels of space at the top and bottom, 20 on the left and 30 on the right, we would
use:

gridConstraints.insets = new Insets(10, 20, 10, 30);

This control would look something like this in its grid region:

Control

• Once the gridConstraints are established for a control, it is added to the frame’s
content pane using the add method. If the control is myControl, the code syntax
is:

getContentPane().add(myControl, gridConstraints);

• I think you are starting to see the flexibility available with the GridBagLayout
manager. Remember to establish all grid constraint values before adding a
control to the grid. We will start using some of these new concepts in building our
example applications. You, too, are encouraged to learn these ideas and use
them to “beautify” your GUI interfaces.

• Building an interface is an “art,” not a science. You will see the process involves
lots of trial and error and adjustments. And sometimes, you get results you would
never expect – components may not appear as you wish or may not appear at all!
The bottom line is – once all adjustments are made, your final frame size is
established and we can finally learn how to do the task we started out with –
centering the frame in the screen.

• First, to place a frame (width by height in size) at a horizontal position left and
vertical position top, we use the setBounds method:

setBounds(left, top, width, height);

All the dimensions are int types and measured in pixels. To center a frame in the
computer screen, we need to know find left and top.

• To find the centering position, we need two things: the dimensions of the frame
(use getWidth and getHeight methods) and the dimensions of the screen. The
dimensions of the screen are held in the frame’s ‘toolkit’. A Dimension object
holds the information we need. To retrieve this object, use:

Dimension screenSize =
Toolkit.getDefaultToolkit().getScreenSize();
 With this, screenSize.width holds the screen width and screenSize.height holds
the screen height. So, the code to center the frame using setBounds is:

setBounds((int) (0.5 * (screenSize.width - getWidth())),

(int) (0.5 * (screenSize.height - getHeight())), getWidth(),
getHeight());

This code needs to be after the pack method in the code establishing the frame,
so that proper frame size is used. We’ll use this centering code in every
application built in the remainder of this course.

Pripremio Dragan Мarković