Program- eller händelsestyrd
exekvering
8 -1
• Programstyrd exekvering
– I ett ett textbaserat användargränssnitt
avgör programmet när det är dags för ineller utmatnig av data. Exekveringen är
programstyrd.
• Händelsestyrd (eng. event-driven) exekvering
– I ett program med grafiska användargränssnitt styrs programmets exekvering av
olika händelser som inträffar. Händelsen
initieras av någon aktivitet från användaren,
t.ex. ett musklick eller musrörelse eller
tangentnedtryckning. Programmet reagerar
när händelserna inträffar.
• Händelsestyrd programmering
– För att utveckla ett händelsestyrt program
som hanterar de händelser som inträffar
måste man oftast använda funktioner i något
grafiskt användarbibliotek
– I Java finns dessa som funktioner som klasser
i paketet java.awt.event
Grafiska program i
Java
8 -2
• Programmeringsgränssnittet för grafik i
Java : Java Graphics API innehåller en
mängd klasser för att utveckla grafiska
program. De viktigaste typerna av
klasser är:
– Komponenter för användargränssnittbeskriver fönster, knappar, textfält
etc.
– Layouthantering - organiserar och
placerar ut gränssnittskomponenter på
lämpligt sätt i ett fönster
– Händelsehantering - fångar och
hanterar händelser, t.ex. musklick
eller tangent-nedtryckningar, som
användaren initierar
– Grafik – ritverktyg med hjälpmedel
för färger och typsnitt, etc,
8 -3
8 -4
AWT och Swing?
Java Graphics API
• Java Graphics API erbjuder två besläktade gränssnitt för att
utveckla grafiska användargränssnitt. Bägge verktygen är
plattformsoberoende och applikationerna antar den
exekverande plattformens ”look and feel”
•
• AWT (Abstract Windowing Toolkit, java.awt)
– Många gränssnittsklasser i AWT använder en motsvarande s.k.
peer-klass för att ritas ut på en viss plattform. Denna bygger
på s.k. ”native” kod. Utseendet blir härigenom delvis beroende
av plattformen.
•
java.awt:
•
•
• Swing (java.swing)
– Ett nyare paket (fr. o. m JDK 1.2 ). Rekommenderas av de som
utvecklar Java. Bygger på och använder även klasser i AWT.
– Har utökad funktionalitet med fler och mer avancerade
komponenter. Utnyttjar plattformens kapacitet bättre.
– Använder s.k. lättviktskomponenter (utan peer-klasser) skrivna
helt i Java och får därför ett mer homogent utseende på olika
plattformar än AWT.
– Swing - ingår i JFC (Java Foundation Classes)
AWT
Java Graphics API är ett utmärkt exempel på användning av klasser,
arv och gränssnitt. Det består av två paket som innehåller bl.a följande
klasser:
•
•
Component - superklass till alla klasser för användargränssnitt.
Definierar många och viktiga egenskaper för alla komponenter.
Container - grupperar gränssnittskomponenter. Frame, Applet och
Panel är exempel på containrar som innehåller AWT-komponenter
– LayoutManager – är ett gränssnitt i Java som används av en
container för att positionera och placera komponenter på önskad
plats i en container
AWTEvent med sina subklasser - representerar händelser som
komponenterna skapar
Font, FontMetrics och Color – är hjälpklasser för att ange färg och
typsnitt på grafiska komponenter
Graphics - används för att rita text, linjer och figurer
javax.swing:
•
•
JComponent - superklass till alla lättvikts-swingkomponenter, som t.ex.
JButton JTextField m.m.
JFrame och JApplet - fönster där swingkomponenter placeras
AWTEvent
Swing
Font
LayoutManager
Classes in the java.awt
package
1
Heavyweight
FontMetrics
Button
JButton
Object
Color
Panel
Applet
JApplet
Window
Frame
JFrame
Dialog
JDialog
Graphics
• Swing-komponenter har i allmänhet ett J i början på namnet
Component
Container
*
• Man bör undvika att blanda AWT och Swing-komponenter
Swing Components
in the javax.swing package
JComponent
Lightweight
Swing-komponenter i
ett JFrame-fönster
8 -5
Klassen JFrame
•
•
•
Gränssnittskomponenter kan inte visas direkt på
skärmen utan måste placeras på en skärmyta som ingår
i något fönster. Skärmytan är en s.k. container (t.ex en
Frame eller en Applet).
Klassen Frame beskriver ett fristående fönster som
används i applikationer med AWT-komponenter
Klassen JFrame är grunden för att skapa en grafisk
applikation med Swing-komponenter. Ett JFramefönster består av en titelrad och en content pane där
komponenter placeras.
•
Skapa ett JFrame-fönster
•
Bygg upp gränssnittet genom att välja en LayoutManager, samt skapa och lägga till Swingkomponenter i fönstrets ContentPane
import javax.swing.*;
import java.awt.*;
class DemoInmatning extends JFrame
{
DemoInmatning()
{
Container con=getContentPane();
con.setLayout(new FlowLayout());
JFrame
JLabel rubrik = new JLabel("Namn:");
con.add(rubrik);
Titelrad
JTextField textFält = new JTextField(12);
con.add(textFält);
Content pane
JButton knapp=new JButton("Skapa");
con.add(knapp);
}
Komponent
•
En Applet är en skärmyta som ingår som en del i
webbläsarens fönster. Applets kommer att
presenteras närmare senare. När en Swingbaserad
Java applet ska skapas ärver man klassen JApplet.
public static void main(String[]args)
{
DemoInmatning frame = new DemoInmatning();
frame.setTitle("Demo Inmatning");
frame.setSize(300, 75);
frame.setVisible(true);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
8 -6
8 -7
Lyssnare som en inre
klass
Hantering av en händelse
En knappklickning leder till att ett ActionEvent-objekt skapas. Klassen
ActionEventDemo är en lyssnare som hanterar händelsen genom att
implementera metoden actionPerformed i lyssnargränssnittet
ActionListener
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class ActionEventDemo extends JFrame implements
ActionListener
{
private Button knapp = new Button("OK");
private JTextField textfält = new JTextField(14);
Lyssnaren kan även definieras som en egen klass. Eftersom den inte
används av andra klasser defineras den enklast som en inre klass
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class ActionEventDemo extends JFrame
{
private Button knappen = new Button("OK");
private JTextField textfältet = new JTextField(14);
public ActionEventDemo()
{
getContentPane().setLayout(new FlowLayout());
getContentPane().add(knappen);
getContentPane().add(textfältet);
knappen.addActionListener(new Lyssnare());
}
public ActionEventDemo()
{
getContentPane().setLayout(new FlowLayout());
getContentPane().add(knapp);
getContentPane().add(textfält);
Händelsehanterare
knapp.addActionListener(this);
}
(Lyssnarmetod)
private class Lyssnare implements ActionListener
{
public void actionPerformed(ActionEvent event)
{
textfältet.setText(" OK-knappen har klickats ");
}
}
public void actionPerformed(ActionEvent event)
{
textfält.setText("OK-knappen har klickats");
}
public static void main(String[] argument)
{
ActionEventDemo fönstret = new ActionEventDemo();
fönstret.setTitle("ActionEvent Demo");
fönstret.pack();
fönstret.setVisible(true);
fönstret.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
public static void main(String[] argument)
{
ActionEventDemo fönstret = new ActionEventDemo();
fönstret.setTitle("ActionEvent Demo");
fönstret.pack();
fönstret.setVisible(true);
fönstret.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
8 -8
Ett exempel med två textfält
och en knapp
8 -9
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class DemoTextField extends JFrame implements ActionListener
{
private JTextField tfIn;
private JTextField tfOut;
private JButton bt;
public DemoTextField()
{
setTitle("Demo TextField");
Container con=getContentPane();
con.setLayout(new FlowLayout());
tfIn = new JTextField("Skriv något här");
con.add(tfIn);
bt = new JButton("OK");
con.add(bt);
tfOut = new JTextField(15);
con.add(tfOut);
Fånga och hantera
händelser
8 - 10
• För att hantera en händelse definierar man en
lyssnare och:
• (1) registrerar lyssnarobjektet som ska lyssna på
källobjektets händelser
• (2) implementerar de speciella lyssnarmetoder i
ett lyssnargränssnitt som motsvarar den aktuella
händelsen
• När en händelse inträffar anropas automatiskt
motsvarande lyssnarmetod i lyssnaren.
– Händelseobjektet skickas med som parameter
till lyssnarmetoden
Lyssnarobjekt
(1) bt.addActionListener(this);
bt.addActionListener(this);
setSize(250, 100);
setVisible(true);
setDefaultCloseOperation(EXIT_ON_CLOSE);
}
public void actionPerformed(ActionEvent event)
{
tfOut.setText(tfIn.getText());
}
public static void main(String[] argument)
{
new DemoTextField();
}
}
(2) public void actionPerformed(ActionEvent event)
{
tf.setText("OK");
Lyssnarmetod
}
Händelseklass
Namnkonventioner
för händelser och lyssnare
8 - 11
Händelseklasser, lyssnargränssnitt och lyssnarmetoder
Händelseklass
Lyssnargränssnitt
ActionEvent
ItemEvent
WindowEvent
ActionListener
ItemListener
WindowListener
ContainerEvent
ComponentEvent
FocusEvent
TextEvent
KeyEvent
MouseEvent
AdjustmentEvent
Lyssnarmetod
(hanterare)
actionPerformed
itemStateChanged
windowClosing
windowOpened
windowIconified
windowDeiconified
windowClosed
windowActivated
windowDeactivated
ContainerListener
componentAdded
componentRemoved
ComponentListener
componentMoved
componentHidden
componentResized
componentShown
FocusListener
focusGained
focusLost
TextListener
textValueChanged
KeyListener
keyPressed
keyReleased
keyTyped
MouseListener
mousePressed
mouseReleased
mouseEntered
mouseExited
mouseClicked
MouseMotionListener mouseDragged
mouseMoved
AdjustmentListener adjustmentValueChanged
•
•
8 - 12
Det finns normalt ett lyssnargränssnitt för varje
händelseklass.
Namnet på händelseklassen motsvaras av namnet på
lyssnargränssnittet och namnet på metoden för att
registrera en lyssnare till en komponent
Ex:
…
ok.addActionListener(new Lyssnare());
class Lyssnare implements ActionListener
{
public void actionPerformed(ActionEvent event)
{
result.setText(”OK”);
}
}
Händelseklass: ActionEvent
Registrera lyssnare: addActionListener
Lyssnargränssnitt: ActionListener
Allmänt:
Lyssnare registreras med addXListener för XEvent
Lyssnargränssnittet heter XListener för XEvent
Några vanliga
gränssnittskomponenter
Properties i klassen
JComponent
8 - 13
•
Exempel på några klasser för färdiga gränssnittskomponenter:
Exempel på vanliga properties i klassen JComponent
font
Typsnitt som används för komponentens text
toolTipText
Typsnitt som används för komponentens när
markören är över den
background
Komponentens bakgrundsfärg
foreground
Komponentens förgrundsfärg
doubleBuffered
Anger om komponenten ritas ut med
JButton beskriver en knapp som kan innehålla text
JCheckbox beskriver en markeringsruta tillhörande
text som användaren kan markera
8 - 14
s.k.dubbelbuffring
border
Anger komponentens ram
preferredSize
Anger komponentens ideala storlek
JChoice beskriver en combobox i form av en popup-meny med olika
alternativ som kan väljas. Det valda alternativet visas i rutan.
minimumSize
Anger komponentens minsta storlek
JTextField och JTextArea beskriver textområden med en
resp flera rader där användaren kan skriva in eller läsa text
maximumSize
Anger komponentens största storlek
JLabel beskriver en enkel textstrång som visas i ett fönster
JList beskriver en ruta med flera element där ett eller flera kan väljas.
Listan är bläddringsbar om inte alla element får plats i rutan
Scrollbar beskriver en rullningslist där användaren förändra
ett värde som ligger mellan två givna värden
JPanel beskriver ett delfönster, används i komplicerade gränssnitt
8 - 15
8 - 16
JButton
JLabel
Några konstruktorer och metoder för JButton :
En label-komponent visar en kort text eller bild i ett
fönster. Används oftast för att beskriva andra komponenter
JButton(String text)
Några konstruktorer och metoder för JLabel :
JButton(String text, Icon icon)
JLabel(String text, int horizontalAlignment)
JLabel(String text)
JButton(Icon icon)
JLabel(Icon icon)
JLabel(Icon icon, int horizontalAlignment)
knapp.setText(”Annat”);
// Sätter ny text på knapp
String s = knapp.getText(); // Hämta aktuell knapptext
knapp.setEnabled(false);
knapp.setEnabled(true);
// Gör knappen ”otryckbar”
l.setText(”Ny text”);
// Sätter ny text på label’n
String s = l.getText()
// Returnerar aktuell text
8 - 17
8 - 18
JTextField
Några konstruktorer och metoder för JTextField :
JTextField(int columns)
Skapar ett tomt textfält med specificerat antal kolumner
JTextArea
En textyta där flera textrader kan matas in
Textytan kan förses med rullningslister.
Några konstruktorer och metoder för JTextArea:
JTextField(String text)
Skapar ett textfält initierat med texten text
JTextArea(int r, int k)
JTextField(String text, int columns)
Skapar ett initierat textfält med texten text och specificerat antal kolumner
JTextArea(String s, int r, int k)
Skapar en textrea, med r rader och k kolumner
tf.setText(”Annan text”);
// Sätter in texten
Skapar ett initierat textarea med texten s
och r rader och k kolumner
tf.getText();
// Returnerar texten
ta.getText();
tf.setEditable(false);
// Förhindrar inmatning
ta.setText(”Ny text” + ”\n” + ”Nästa rad”); //sätter in ny text
//returnerar hela texten (i en String)
ta.append(”\nOch nästa rad...”);
//lägga till ny text på slutet
ta.setEditable(false);
//förhindrar inmatning
ta.setLineWrap(true);
//ger automatisk radbrytning
Exempel med
JComboBox
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class DemoComboBox extends JFrame
{
public DemoComboBox()
{
setTitle("Demo ComboBox");
JComboBox cb = new JComboBox();
cb.addItem("Merkurius");
cb.addItem("Venus");
cb.addItem("Jorden");
cb.addItem("Mars");
cb.addItem("Jupiter");
cb.addItem("Saturnus");
cb.addItem("Neptunus");
cb.addItem("Uranus");
cb.addItem("Pluto");
Container con = getContentPane();
con.setLayout(new FlowLayout());
con.add(cb);
setDefaultCloseOperation(EXIT_ON_CLOSE);
8 - 19
8 - 20
JComboBox
•
En combobox är en lista i form av en popup-meny med
olika alternativ som kan väljas. Det valda alternativet
visas i rutan
Några konstruktorer och metoder för JComboBox:
JComboBox()
Skapar en tom combobox
JComboBox (Object[] stringItems)
Skapar en combobox initierad med stringItems, ett fält med
strängar
jcbo.addItem(Object item)
Lägger till alternativet item till jcbo
}
jcbo.getItemAt(int index)
public static void main(String[] argument)
{
DemoComboBox f = new DemoComboBox();
f.setSize(185, 250);
f.setVisible(true);
}
}
Returnerar alternativet i jcbo med angivet index
8 - 21
8 - 22
JList
Exempel med JList
•
En lista där ett eller flera alternativ i listan kan väljas
av användaren. Scrollning kan fås med klassen
JScrollPane om antalet alternativ i listan är stort.
…
ListTest()
{
super("Exempel Lista");
List li=new List(6);
li.add("Merkurius");
li.add("Venus");
li.add("Jorden");
li.add("Mars");
li.add("Jupiter");
li.add("Saturnus");
li.add("Neptunus");
li.add("Uranus");
li.add("Pluto");
getContentPane().setLayout(new FlowLayout());
getContentPane().add(li);
setDefaultCloseOperation(EXIT_ON_CLOSE);
setSize(200,150);
show();
}
Några konstruktorer och metoder i JList
JList()
Skapar en tom lista
JList(stringItems)
Skapar en lista initierad med stringItems, ett
fält med strängar
li.getSelectedIndex()
Ger index för det första markerade alternativ
li.getSelectedIndices()
Ger ett fält med index för markerade alternativ
li.getSelectedValue()
Ger första markerade alternativ i listan
list.getSelectedValues()
Ger ett fält med de markerade alternativen i
listan
JCheckbox och
JRadioButton
8 - 23
…
RadioTest()
{
super("Exempel checkboxar");
Container con=getContentPane();
con.setLayout(new GridLayout(2,1));
8 - 24
Gruppera radioknappar
Görs genom att JRadioButton läggs i en ButtonGroup
RadioTest2()
{
super("Exempel checkboxar");
JCheckBox cb=new JCheckBox("Valbar");
JPanel p1=new JPanel();
p1.add(cb);
con.add(p1);
JRadioButton
JRadioButton
JRadioButton
JRadioButton
JRadioButton rb=new JRadioButton("Valbar2");
JPanel p2=new JPanel();
p2.add(rb);
con.add(p2);
JRadioButton("Blå");
JRadioButton("Röd", true);
JRadioButton("Vit");
JRadioButton("Svart");
ButtonGroup grupp=new ButtonGroup();
grupp.add(b1);
grupp.add(b2);
grupp.add(b3);
grupp.add(b4);
Några konstruktorer och metoder för JCheckbox och JRadioButton :
JPanel p=new JPanel();
p.add(b1);
p.add(b2);
p.add(b3);
p.add(b4);
JCheckBox()
JCheckBox(String text)
JCheckBox(String text, boolean selected) markerad om selected är true
getContentPane().add(p);
JCheckBox(Icon icon)
JCheckBox(String text, Icon icon)
b1=new
b2=new
b3=new
b4=new
JCheckBox(String text, Icon icon, boolean selected)
•
Tyvärr kan man inte (enkelt) se vilken i gruppen som är vald...
(samma konstruktorer för JRadioButton)
•
Avläsning kan göras genom att anropa isSelected() för de
olika knapparna
cb.isSelected()
Returnerar true om cb är markerad
Ex: Användaraktiviteter,
8 - 25
källobjekt och händelseklasser
Exempel några användaraktiviteter på källobjekt och
motsvarande händelseklasser:
Användaraktivitet
Klickat på en knapp
Trycka på retur i ett
textfält
Bytt textinnehåll
Dubbelklickat på ett
listobjekt
Markererat eller
avmarkerat element
med enkelklick
Markererat eller
avmarkerat element
Källobjekt
JButton
JTextField
Händelseklass
ActionEvent
ActionEvent
JTextComponent TextEvent
JList
ActionEvent
JList
ItemEvent
JComboBox
ItemEvent
Java´s APIdokumentation
8 - 26
Exempel med
FlowLayout
8 - 27
Layouthanterare
•
•
En layouthanterare (eng. Layout Manager) är ett objekt i
AWT som styr utplaceringen av komponenter för att anpassa
ett gränssnitt efter skillnader i olika plattformar.
Varje container har en layouthanterare. Så här definieras en
layouthanterare av typen FlowLayout för en container:
con.setLayout(new FlowLayout());
•
Några vanliga typer av layouthanterare är:
– FlowLayout
Ordnar komponenter radvis från vänster till höger, tills
att raden har fyllts, på liknande sätt som texten i en
boksida,. Komponenternas ursprungliga storlek behålls vid
utplaceringen.
– GridLayout
Fönstret delas upp i ett rutnät med rader och kolumner.
Komponenterna ordnas radvis från vänster till höger. Alla
komponenter får samma storlek.
– BorderLayout
Fönstret delas in i fem områden. Fyra områden längs
fönstrets fyra kanter och ett femte område i fönstrets
mitt.
– GridBagLayout
Liknar GridLayout men delar in fönstret ett rutnät med
rutor av olika storlek. En komponent kan uppta flera
celler.
– CardLayout
CardLayout skiljer sig från andra layouthanterare genom
att alla komponenter inte syns på en gång. Man definierar
istället en ”kortlek” som användaren kan bläddra i och
studera ett i taget (jmfr flikar)
import javax.swing.*;
import java.awt.*;
class FlowLayoutDemo extends JFrame
{
FlowLayoutDemo()
{
Container con=getContentPane();
con.setLayout(new FlowLayout());
con.setBackground(Color.white);
con.add(new JButton("Knapp 1"));
con.add(new JButton("Knapp 2"));
con.add(new JLabel("Label 3"));
con.add(new JTextField("Text 4"));
}
public static void main(String[]args)
{
FlowLayoutDemo frame = new FlowLayoutDemo();
frame.setTitle("FlowLayout Demo");
frame.setSize(200, 100);
frame.setVisible(true);
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
}
}
•
Komponentplaceringen ändras automatiskt om fönstrets
storlek ändras.
8 - 28
Exempel med
GridLayout
8 - 29
FlowLayout
• Komponenterna ordnas radvis från vänster till
höger. När en rad fyllts påbörjas nästa rad.
• Konstruktorer:
new FlowLayout(a)
a anger justering på raden och kan vara
FlowLayout.LEFT, FlowLayout.CENTER eller
FlowLayout.RIGHT
import javax.swing.*;
import java.awt.*;
class GridLayoutDemo extends JFrame
{
GridLayoutDemo()
{
Container con=getContentPane();
con.setLayout(new GridLayout(2,3));
con.add(new JButton("Knapp 1"));
con.add(new JButton("Knapp 2"));
con.add(new JTextField("Text 4"));
con.add(new JLabel("Label 3"));
con.add(new JButton("Knapp 5"));
}
new FlowLayout(a, dx, dy)
dx och dy anger avståndet i pixlar mellan
komponenterna
new FlowLayout()
Komponenterna centreras på raden med default
avstånd mellan komponenterna
• FlowLayout är default LayoutManager för
klasserna JApplet och JPanel.
public static void main(String[]args)
{
GridLayoutDemo frame = new GridLayoutDemo();
frame.setTitle("GridLayout Demo");
frame.setSize(300,100);
frame.setVisible(true);
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
}
}
8 - 30
Exempel med
BorderLayout
8 - 31
GridLayout
• Fönstret delas in i ett rutnät med rader och
kolumner. Alla celler rymmer en komponent och
får samma storlek. Komponenterna placeras
radvis i rutnätet från vänster till höger med
början i första raden
import javax.swing.*;
import java.awt.*;
class BorderLayoutDemo extends JFrame{
BorderLayoutDemo(){
Container con=getContentPane();
con.setLayout(new BorderLayout());
con.add(new JLabel("EAST"), BorderLayout.EAST);
• Konstruktorer:
con.add(new JButton("SOUTH"), BorderLayout.SOUTH);
con.add(new JTextField("WEST"), BorderLayout.WEST);
con.add(new JButton("NORTH"), BorderLayout.NORTH);
new GridLayout(r,k)
con.add(new JButton("CENTER"), BorderLayout.CENTER);
Placerar komponenterna i r rader och k kolumner.
Värdet 0 innebär godtyckligt antal rader respektive
kolumner
}
public static void main(String[]args){
BorderLayoutDemo frame = new BorderLayoutDemo();
frame.setTitle("BorderLayout Demo");
frame.setSize(300,200);
new GridLayout(r, k, dx, dy)
dx och dy anger avstånd mellan
komponenterna
• Antalet kolumner i rutnätet justeras om antalet
komponenter som placeras inte stämmer med
angivna konstruktorvärden
frame.setVisible(true);
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
}
}
8 - 32
8 - 33
BorderLayout
• Delar upp fönstret i fem områden. Fyra områden längs
fönstrets kanter (North, South, East eller West) och
ett område i fönstrets centrum (Center). Områdenas
storlek anpassas efter komponenterna.
• Vissa områden i fönstret kan vara tomma.
• Konstruktorer:
new BorderLayout()
Gruppera komponenter
med paneler
• Klassen Panel är en generell containerklass.
Paneler fungerar som mindre containrar och
används ofta för att gruppera
gränssnittskomponenter.
• Paneler placeras oftast inuti en annan container,
t.ex ett Frame-fönster eller en applet, men kan
även placeras inne i en annan panel.
• En Frame-fönster indelas ofta i flera paneler,
där varje panel har en egen layouthanterare.
new BorderLayout(dx, dy)
dx och dy anger avstånd mellan komponenterna
Frame
• Metoder:
add(c, ”plats”)
Placerar ut komponenten c. plats kan vara
BorderLayout NORTH, SOUTH, EAST, WEST eller
CENTER
• BorderLayout är default LayoutManager för klassen
Window med sina subklasser (JFrame och JDialog).
8 - 34
Panel med
Panel med
Gränssnittskomponenter
Gränssnittskomponenter
Panel med
Panel med
Gränssnittskomponenter
Gränssnittskomponenter
Ritytor – Graphics
Context
8 - 35
Exempel med paneler
import javax.swing.*;
import java.awt.*;
public class PanelerDemo extends JFrame
{
PanelerDemo()
{
Container con=getContentPane();
con.setLayout(new BorderLayout());
JPanel p1=new JPanel();
p1.setLayout(new FlowLayout());
p1.add(new JButton("Lägg Till"));
p1.add(new JTextField(10));
p1.add(new JButton("Avsluta"));
con.add(p1, BorderLayout.NORTH);
JTextArea ta=new JTextArea();
con.add(ta, BorderLayout.CENTER);
}
public static void main(String[]args)
{
PanelerDemo frame = new PanelerDemo();
frame.setTitle("Paneler Demo");
frame.setSize(300,200);
frame.setVisible(true);
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
}
}
•
•
•
•
8 - 36
Det går inte att rita direkt på en komponent. All ritning
kräver en grafisk omgivning, ett s.k. graphics context.
Javasystemet skapar automatiskt ett graphics context med
ett objekt av klassen Graphics. All ritning sker genom
anrop till metoder i Graphics-objektet
Klassen Graphics innehåller metoder för att bl.a :
– skriva text, samt rita linjer och figurer
• drawString, drawLine, drawRect, drawOval,.. .
– formatera text och ange färg
• setFont, setColor, .. .
– (visa bilder
• drawImage)
Klassen JPanel kan även användas för att rita grafik
(inklusive text)
Man skapar en ny klass som ärver JPanel och överskuggar
metoden paintComponent och Ex. för att skriva text i
grafisk mod:
class MinPanel extends JPanel {
public void paintComponent(Graphics g){
//super-klassens paintComponent
//SKA först anropas
super.paintComponent(g);
g.drawString(”Hej Världen!”, 50, 50);
}
}
•
Vid anropet av paintComponent överförs ett objekt av klassen
Graphics, ett graphics context. Med ett anrop till metoder i
Graphics-objektet ritar vi i panelen.
Koordinatsystem för
grafik
8 - 37
Klassen Color
• Positionerna i en rityta representeras med ett
koordinatsystem där varje punkt representerar en
bildpunkt (pixel).
• Koordinatsystemet har origo i övre vänstra hörnet,
med ökande X-koordinater åt höger och med
ökande Y-koordinater nedåt.
• Varje rityta har en bredd (width) och en höjd
(heigth). Det som ritas utanför ritytan kan inte
ses på skärmen.
X
<0,0>
8 - 38
• Klassen Color används för att ange färg
på grafiska komponenter.
• Ett färgobjekt skapas med:
Color c = new Color(r, g, b);
• Färgen defineras med tre rgb-värden (0..255)
som anger färgstyrkan för de grundfärgerna röd,
grön och blå.
– (255, 0, 0) ger röd
– (0, 0, 0) ger svart
– (255, 255 ,255) ger vit
• Ett ljusblått färgobjekt:
<55,30>
Color lightblue = new Color(175,175,255);
<width-1, height-1>
Y
Ritytan
• I klassen Color finns även 13 fördefinierade
färgobjekt med de vanligaste färgerna
Color.black, Color.red, .. .
8 - 39
8 - 40
Ange färger
•
•
Metoderna setForeground och setBackground i
klassen Component anger förgrunds- och bakgrundsfärg
på grafiska komponenter. Metoderna har ett objekt av
klassen Color som argument.
•
•
En objekt av klassen Font bestämmer textens typsnitt, stil och storlek.
Font f = new Font(typsnitt, stil, storlek);
•
Typsnitt:
– SansSerif, Serif, Monospaced, Dialog, eller
DialogInput
Exempel för att ange bakgrundsfärgen för en panel:
Color lightblue = new Color(175,175,255);
JPanel p1 = new JPanel();
p1.setBackground(lightblue);
Alt. med standardfärg:
JPanel p1 = new JPanel();
p1.setBackground(Color.white);
•
Klassen Font
–
Helvetica, TimesRoman, Courier
• OBS! Det finns olika typsnitt på olika datorsystem
•
Stil:
– Font.PLAIN, Font.BOLD, Font.ITALIC
•
Storlek:
– Anges i antal punkter, t ex 12
•
Fonten sätts med metoden setFont som är definierad i klasserna
Component och Graphics.
Ex:
public void paintComponent(Graphics g)
{
super.paintComponent(g);
Font myFont = new Font("Times", Font.BOLD, 16);
g.setFont(myFont);
g.drawString("Welcome to Java", 20, 40);
Klassen Graphics har metoden setColor för att
bestämma färg på geometriska figurer
//ange en ny font
g.setFont(new Font("Courier", Font.BOLD+Font.ITALIC, 12));
g.drawString("Welcome to Java", 20, 70);
}
•
Det finns också en FontMetrics-klass som kan
användas för att ta reda på längden på en textsträng med en viss font
Några exempel på
fonter
Några metoder för
ritning
8 - 41
import javax.swing.*;
import java.awt.*;
public class DemoFonter extends JFrame
{
public DemoFonter()
{
getContentPane().add(new RitPanel());
}
public static void main(String[]args)
{
DemoFonter frame = new DemoFonter();
frame.setTitle("Paneler Demo");
frame.setSize(200,150);
frame.setVisible(true);
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
}
• Klassen Graphics har bl.a följande ritmetoder
för geometriska figurer och text :
•
class RitPanel extends JPanel
{
public void paintComponent(Graphics g)
{
super.paintComponent(g);
g.setFont(new Font("SansSerif", Font.PLAIN, 15));
g.drawString("Hej Världen!", 20, 20);
g.setFont(new Font ("Serif", Font.BOLD, 15));
g.drawString("Hej Världen!", 20, 40);
g.setFont(new Font("Monospaced", Font.PLAIN, 15));
g.drawString("Hej Världen!", 20, 60);
g.setFont(new Font("Dialog", Font.ITALIC, 15));
g.drawString("Hej Världen!", 20, 80);
g.setFont(new Font("DialogInput",Font.PLAIN+Font.ITALIC,15));
g.drawString("Hej Världen!", 20, 100);
}
drawLine(x1, y1, x2, y2)
– Ritar en linje från punkten (x1, y1) till (x2,y2)
•
drawRect(x, y, b, h)
– Ritar en ofylld rektangel med övre vänster hörn i (x,y),
bredd b och höjd h. Kan även ritas i 3D
•
}
8 - 42
drawOval(x,y, b, h)
– Ritar en ofylld ellips som är inskriven i en rektangel med
övre vänster hörn i (x,y), bredd b och höjd h
•
drawPolygon(xp, yp, n)
– Ritar en ofylld månghörning. xp och yp är fält med
punkternas x- resp. y-koordinater. n är antalet punkter:
xp[] = {x1, x2, x3};
– (alt. drawPolygon(p), p är ett Polygon-objekt)
•
drawString(txt, x, y)
– Ritar textsträngen txt med början i punkten (x,y). ykoordinaten anger textens baslinje
•
De flesta figurer även kan ritas ifyllda (ex: fillRect). Övriga
ritmetoder: drawArc, drawPolyline
}
8 - 43
Ett grafikexempel
import javax.swing.*;
import java.awt.*;
public class DemoGrafik extends JFrame
{
public DemoGrafik()
{
getContentPane().add(new RitPanel());
}
public static void main(String[]args)
{
DemoGrafik frame = new DemoGrafik();
frame.setTitle(”Grafik Demo");
frame.setSize(400,300);
frame.setVisible(true);
frame.setDefaultCloseOperation(EXIT_ON_CLOSE);
}
}
class RitPanel extends JPanel
{
public void paintComponent(Graphics g)
{
super.paintComponent(g);
g.drawRect(25, 25, 100, 50);
g.setColor(Color.red);
g.fillOval(150, 100, 50, 50);
g.fillRect(50, 150, 50, 75);
g.drawLine(370, 20, 32, 250);
g.setColor(Color.yellow);
int[] xarr = {350, 350, 150, 225, 125};
int[] yarr = {100, 170, 250, 100, 50};
g.fillPolygon(xarr, yarr, 5);
}
}
