Java Swing Uten Arv

Læringsmål for forelesningen • Objektorientering – Objektorientering og GUI

• Java­programmering – GUI­komponenter i Java/Swing

1

 

 

GUI i Java • Grafiske brukergrensesnitt (GUI) i  Java lages vha. tre hovedtyper  objekter: – et hierarki av GUI­elementer:

• JFrame ytterst • hierarki av JPanel­instanser inni • basiselementer inni JPanel­instansene

– hendelser (events)

• hver type GUI­element sier fra om hva brukeren gjør  med den vha. av hendelser

– lyttere (listeners)

• reaksjonen på hendelsene implementeres av lyttere

2

 

 

Et hierarki av GUI­elementer

• JFrame øverst/ytterst

– applikasjonsvindu med tittel og lukke, minimerings og  maksimeringsknapper

• hierarki av JPanel­instanser inni

– en trenger egentlig kun én JPanel­instans, men ofte er  det greit med flere for å få layout’en en ønsker – den ytterste settes som JFrame’n sin contentPane

• basiselementer inni JPanel­instansene

3

 

– – – – –

JLabel (statisk tekst) JButton (trykknapper, avkrysningsbokser, ...) JTextField, JTextArea (tekstfelt) JComboBox, JList (lister) ...

 

Hendelser og lyttere • Det er tett kobling mellom GUI­komponenter,  lyttergrensesnitt og hendelsesklasser • Alle komponenter som brukeren kan gjøre noe med, for  eksempel knapper, genererer en hendelser når de  manipuleres av brukeren • Lytter­objekter kobler seg til komponenter og “venter” på  at hendelser skal inntreffe og komponenten sier fra ved å  kalle tilsvarende lyttermetode • Vi kan reagere på at noe (hendelsen) har skjedd, men som  oftest er vi også interesserte i hva, f.eks. hvor muspekeren  er, ikke bare at den er flyttet 4

 

 

Lytting på flere hendelseskilder • Et og samme lytterobjekt, f.eks.  hovedklassen til en applikasjon, kan  lytte til og få hendelser fra flere  komponenter • Vi kan finne ut hvilket objekt som er  opphav til en hendelse ved å benytte  eventobjektets getSource-metode 5

 

 

Hovedklasse for applikasjon • For små applikasjoner er det greit å samle logikken  i en egen App­klasse • App­klassen har en standard struktur: – Konstruktøren instansierer hierarkiet av GUI­elementer • JFrame applikasjonsvindu = new JFrame(); JPanel applikasjonsinnmat = new JPanel(); applikasjonsvindu.setContentPane(applikasjonsinnmat);

– Det er ofte lurt å ha ett felt for hvert (vesentlige) GUI­element • øverst i klassen: JButton knapp1; • i konstruktøren: knapp1 = new JButton(”Trykk meg!”);

6

 

 

Hovedklasse for applikasjon • App­klassen har en standard struktur (forts.) – App­klassen implementerer nødvendig lyttergrensesnitt, iht. hvilke GUI­ elementer som GUI’et inneholder • i klassedefinisjonen: class App implements ActionListener • i konstruktøren: knapp1.addActionListener(this);

– hver lyttermetode (metode definert i et lyttergrensesnitt) må sjekke hvilken  komponent som sier fra om en hendelse  • public void actionPerformed(ActionEvent ae) { if (ae.getSource() == knapp1) { // knapp1-logikk her } }

7

 

 

SwingSet2 Demo av GUI­komponenter i  Java sitt Swing­API

8

 

 

Sun sin Swing­tutorial er en god  kilde til kodeeksempler

9

 

 

Container’e • En container er et GUI­element som inneholder og  organiserer andre GUI­elementer • En frame er en container for hovedvinduet til applikasjonen. En frame er et frittstående vindu, som brukeren kan flytte og endre størrelsen på etter behov. • Et panel er en container som kun ikke har eget utseende  eller oppførsel, men som kun brukes til å organisere andre  komponenter. Slike brukes typisk for å organisere  innmaten i et applikasjonsvindu. 10

 

 

Nøstede paneler • Containere som inneholder andre GUI­ elementer danner et hierarkiet – GUI­elementer legges inn med add­metoden – basis­elementer legges inn i de innerste panelene

• Hierarkiet styres av to hensyn – ryddig oppdeling av koden etter sammenhørende funksjoner – ønsket om spesifikk visuell effekt vha. layout­objekter 11

 

 

Basis­elementer • JLabel – viser frem tekst og/eller ikon (ImageIcon) – intern layout opp og til siden og ift. hverandre – kan inneholde HTML! 

• JButton, JCheckBox, JToggleButton, JRadioButton – knapper med to hovedtilstander: av/på – sier fra vha. ActionListener, actionPerformed og ActionEvent

12

 

 

Hvordan bli kjent med en ny GUI­ element­type? • Prøv den med SwingSet2­demo! • Hvilke data håndterer den?

– sannhetsverdier (boolean), leses/settes med isSelected/setSelected

• Hvilke vesentlige egenskaper har den?

– har ikon og tekst for angi mening (get/setIcon, get/setText)

• Hvilket lyttergrensesnitt og –metoder og  hendelsesklasser inngår i håndtering av  hendelsen? – ActionListener, actionPerformed og ActionEvent – addActionListener og removeActionListener

• Prøv den i en enkel Swing­applikasjon! 13

 

 

JCheckBox • Prøv den med SwingSet2­demo • Hvilke data håndterer den? – sannhetsverdi (boolean) – isSelected/setSelected

• Hvilke vesentlige egenskaper har den? – ikon og tekst – get/setIcon og get/setText

• Hvilket lyttergrensesnitt og –metoder og  hendelsesklasser inngår i håndtering av  hendelsen? – ActionListener, actionPerformed og ActionEvent – addActionListener og removeActionListener

• Prøv den i en enkel Swing­applikasjon! 14

 

 

JSlider • Prøv den med SwingSet2­demo • Hvilke data håndterer? – heltallsverdi innen intervall – get/setValue, setMinimum, setMaximum

• Hvilke vesentlige egenskaper har den?

– såkalte ticks m/tekst – hvilke ticks som finnes og om og hvordan de skal tegnes

• Hvilket lyttergrensesnitt og –metoder og  hendelsesklasser inngår i håndtering av  hendelsen? – ChangeListener, stateChanged og ChangeEvent – addChangeListener og removeChangeListener

• Prøv den i en enkel Swing­applikasjon! 15

 

 

JTextField • Prøv den med SwingSet2­demo • Hvilke data håndterer? – tekst (String) – get/setText

• Hvilke vesentlige egenskaper har den? – skriftstype (Font) og antall kolonner (columns) – get/setFont, get/setColumns

• Hvilket lyttergrensesnitt og –metoder og  hendelsesklasser inngår i håndtering av  hendelsen? – ActionListener, actionPerformed og ActionEvent – addActionListener og removeActionListener

• Prøv den i en enkel Swing­applikasjon! 16

 

 

JComboBox • Prøv den med SwingSet2­demo • Hvilke data håndterer den?

– lister (model) og valg av ett element (selection) – get/setModel, get/setSelectedItem, get/setSelectedIndex

• Hvilke vesentlige egenskaper har den? – om tekstfeltet er editerbart: get/setEditable

• Hvilket lyttergrensesnitt og –metoder og  hendelsesklasser inngår i håndtering av  hendelsen?

– action­hendelsen og item­hendelsen for selectedItem/selectedIndex­ egenskapen

• Prøv den i en enkel Swing­applikasjon! 17

 

 

Eksempel: J • Prøv den med SwingSet2­demo • Hvilke data håndterer den og hvordan leses/settes de(t)? – – get/set

• Hvilke vesentlige egenskaper har den? – ?

• Hvilket lyttergrensesnitt og –metoder og hendelsesklasser  inngår i håndtering av hendelsen? – Listener, Performed og Event – addListener og removeListener

• Prøv den i en enkel Swing­applikasjon!

18

 

 

Oppsummering • Alle basis­elementer har samme ”struktur” – dataverdi(er) – essensielle egenskaper – hendelser og tilhørende grensesnitt, metoder og klasser

• Å bli kjent med en komponent innebærer å  oppsøke informasjon om hver del • Hendelser – De fleste GUI­elementer har egne typer hendelser – Noen GUI­elementer genererer PropertyChangeEvent’er 19

 

 

LayoutManagers • En LayoutManager er et objekt som hjelper til  med å organisere innholdet i en container • Flere predefinerte layout managers i standard Java  klassebiliotek: FlowLayout BorderLayout GridLayout CardLayout GridBagLayou t BoxLayout OverlayLayout 20

 

Defined in the AWT

Defined in Swing  

LayoutManager­logikk • Hver container har en standard LayoutManager,  men vi kan også eksplisitt sette denne etter behov • Hver layout manager har egne regler for hvordan  komponentene skal arrangeres innbyrdes • Noen layout managers tar hensyn til foretrukket  størrelse eller innretning, andre gjør det ikke

21

• En layout manager prøver å justere layout etter  hvert som nye komponenter legges til og hvis  containeren endrer størrelse

 

 

FlowLayout • FlowLayout plasserer så mange komponenter som  mulig i en rad, før neste rad fylles. Nye rader lages  automatisk etter behov for å få plass til alle  komponentene • Komponentene sentreres hvis ingenting annet er  angitt, men kan også justeres til høyre eller venstre • Horisontalt og vertikalt mellomrom kan også  angis.  22

 

 

GridLayout • GridLayout legger ut en containers komponenter i  et rektangulært rutenett • En komponent legges i hver celle og alle celler har  samme størrelse • Fylles fortløpende fra venstre til høyre og fra topp  til bunn

23

• Størrelsen på cellen avgjøres av størrelsen på  containeren  

 

BoxLayout • En BoxLayout organiserer komponentene enten  horisontalt (i en rad) eller vertikalt (i en kolonne) • Rekkefølge for plassering er top­til­bunn eller  venstre­til­høyre • Ved å kombinere flere containere som bruker  BoxLayout i ulike retninger kan mange  konfigurasjoner lages

24

• Usynlige komponenter kan legges til for å lage  åpenrom mellom komponenter  

 

Border Layout • En BorderLayout definerer fem  områder som komponenter kan  plasseres i North West

Center

East

South

25

 

 

BorderLayout forts. • Hvert område viser én komponent (som typisk er  en container)  • Størrelsen til hver av de fire ytre områdene  justeres for å få plass til komponenten der • Hvis ett eller flere av de ytre områder ikke fylles  vil de andre områdene bruke plassen

26

• Senterområdet vil øke i plass og fylle tomme  områder ved behov  

 

Rammer • En Border kan knyttes til en hvilken som helst  Swing­komponent for å bestemme hvordan kantene  skal tegnes opp • Effektivt hjelpemiddel for å gruppere komponenter  visuelt • Klassen BorderFactory inneholder mange  statiske metoder for å lage rammer • Ramme til en komponent settes vha. setBorder 27

 

 

Dialoger • En dialog er et vindu som vises foran det aktive  vinduet (og som kan sperre for det) • Kan benyttes til å: – – – –

vise viktig informasjon gi brukeren mulighet til å bekrefte en handling la brukeren komme med nødvendig input velge standardobjekter, f.eks. farge eller fil

• En dialog boks har vanligvis et spesifikt formål og  brukerinteraksjonen er kortvarig • Klassen JOptionPane har metoder som  forenkler opprettelsen av noen typer dialogbokser 28

 

 

JOptionPane­klassen

(http://java.sun.com/docs/books/tutorial/ uiswing/components/dialog.html) • showMessageDialog – viser frem en melding • showOptionDialog – lar brukeren velge et av flere alternativ • showInputDialog – gi mulighet til å fylle inn en tekst 29

 

 

Spesialiserte dialogbokser ­ filvelger • Valg av fil er en svært vanlig operasjon  som Java støtter vha. klassen  JFileChooser  • Brukeren kan bla rundt i filsystemet og   filtrere hvilke filer som vises • Brukes typisk for å støtte åpning og  lagring av filer 30

 

 

Læringsmål for forelesningen • Objektorientering – Objektorientering og GUI

• Java­programmering – GUI­komponenter i Java/Swing

31