Over Forelæsning omponenter ogrammering sigt 14, 1999 freda containere 15. oktober 1999 Eksempel: out GUI til beregning fakultet.

Transkript

1 Programmering 1999 Forelæsning 14, fredag 15. oktober 1999 Oversigt Repetition: GUI komponenter og containere. Layout af grafiske brugergrænseflader i Java. Større layout-opgave. Programmering 1999 KVL Side 14-1 Komponenter og containere Den synlige del af en GUI er opbygget af komponenter, dvs. objekter af klassen Component. Komponenter skal puttes ind i containere for at kunne vises på skærmen. En del af Component hierarkiet: Component <- Button <- Checkbox <- Label <- Scrollbar <- TextComponent <- TextArea <- TextField <- Container <- Panel <- ScrollPane <- Window <- Frame ( <- CloseableFrame ) Programmering 1999 KVL Side 14-2 Eksempel: En GUI til beregning af fakultet. class FakultetGUI { int fak(int x) { if (x <= 1) return 1; else return x * fak(x-1); class BeregnLytter implements ActionListener { public void actionperformed(actionevent e) { int x = Integer.parseInt(argument.getText()); resultat.settext(string.valueof(fak(x))); public FakultetGUI() { b.addactionlistener(new BeregnLytter()); resultat.seteditable(false); f.add(new Label("x:")); f.add(argument); f.add(b); f.add(new Label("x!:")); f.add(resultat); Programmering 1999 KVL Side 14-3 Layout Placeringen af komponenter inden i en container bextemmes af containerens layout manager. Man kan ændre en containers layout manager ved at bruge dens setlayout metode, f.eks.: Man skal altid sætte layout manageren før man begynder at tilføje komponenter! Programmering 1999 KVL Side 14-4

2 Layout manager klasser Der er følgende predefinerede layout managere: Manager Standard for FlowLayout Panel, Applet BorderLayout Window, Frame CardLayout GridLayout GridBagLayout Programmering 1999 KVL Side 14-5 Brug af Panel under-containere Panel er en usynlig container der er egnet til at gruppere komponenter. I stedet for at tilføje komponenter direkte til den ydre container tilføjer man dem til et eller flere Panel containere. Panel containerne tilføjes så til den ydre container. Programmering 1999 KVL Side 14-6 Eksempel: Fakultets-beregner (2) class FakultetGUI2 { public FakultetGUI2() { Panel p1 = new Panel(), p2 = new Panel(); f.add(p1); f.add(b); f.add(p2); Programmering 1999 KVL Side 14-7 Border layout Et border layout kan håndtere op til fem komponenter: North West Center East South Man kan give et ekstra argument til add metoden for at fortælle hvor komponenten skal hen. Eksempel: For at putte komponenten p2 i South feltet: Programmering 1999 KVL Side 14-8

3 Eksempel: Fakultets-beregner (3) class FakultetGUI3 { public FakultetGUI3() { Panel p1 = new Panel(), p2 = new Panel(); f.add(p1, "North"); f.add(b, "Center"); Programmering 1999 KVL Side 14-9 Eksempel: Fakultets-beregner (4) class FakultetGUI4 { public FakultetGUI4() { Panel p1 = new Panel(), p2 = new Panel(), p3 = new Panel(); p3.add(b); f.add(p1, "North"); f.add(p3, "Center"); Programmering 1999 KVL Side Eksempel: Fakultets-beregner (5) class FakultetGUI5 { public FakultetGUI5() { Panel p1 = new Panel(), p2 = new Panel(), p3 = new Panel(); p1.setbackground(color.red); p2.setbackground(color.green); p3.add(b); p3.setbackground(color.yellow); Panel p = new Panel(); p.setlayout(new BorderLayout()); p.setbackground(color.blue); p.add(p1, "North"); p.add(p2, "South"); p.add(p3, "Center"); f.setlayout(new FlowLayout(FlowLayout.LEFT, 0, 0)); Programmering 1999 KVL Side Grid Layout Et GridLayout bruges når man vil ordne komponenter i et regelmæssigt net. Alle komponenter får samme størrelse. Man definerer fra start hvor stort nettet skal være. Komponenter fyldes i fra venstre mod højre, oppefra og ned. Der kan ikke være huller mellem komponenterne. Programmering 1999 KVL Side 14-12

4 Eksempel: Fakultets-beregner (6) class FakultetGUI6 { public FakultetGUI6() { f.setlayout(new GridLayout(3, 2)); f.add(new Label("x:")); f.add(argument); f.add(new Label("x!:")); f.add(resultat); f.add(b); Programmering 1999 KVL Side Gridbag layout GridBagLayout er den mest alsidige (og indviklede) layout manager. Hver komponent der tilføjes til et GridbagLayout skal forsynes med GridBagConstraints. Et GridBagConstraints objekt indeholder (bl.a.): gridx, gridy Position: øverste venstre celle gridwidth, gridheight Størrelse i celler (std. ) fill Hvordan komponenten udvides (std. NONE) anchor Placering inden i cellen/cellerne (std. CENTER) Man kan bruge det samme GridbagConstraints objekt flere gange, bare man ændrer på parametrene. Programmering 1999 KVL Side Eksempel: Fakultets-beregner (7) class FakultetGUI7 { public FakultetGUI7() { f.setlayout(new GridBagLayout()); GridBagConstraints c = new GridBagConstraints(); c.anchor = GridBagConstraints.WEST; c.gridx = 0; c.gridy = 0; f.add(new Label("x:"), c); c.gridx = 1; f.add(argument, c); c.gridx = 0; c.gridy = 2; f.add(new Label("x!:"), c); c.gridx = 1; f.add(resultat, c); c.anchor = GridBagConstraints.CENTER; c.gridx = 0; c.gridy = 1; c.gridwidth = 2; f.add(b, c); Programmering 1999 KVL Side Manuelt layout Man kan lave sit helt eget layout ved at sætte layout manageren til null. Man skal så specificere position og størrelse i skærm-koordinater for hver komponent. Programmering 1999 KVL Side 14-16

5 Eksempel: Fakultets-beregner (8) class FakultetGUI8 { public FakultetGUI8() { f.setlayout(null); Label l1 = new Label("x:"), l2 = new Label("x!:"); l1.setbounds(5,25,20,20); argument.setbounds(30,25,50,20); b.setbounds(5,50,40,20); l2.setbounds(5,75,20,20); resultat.setbounds(30,75,50,20); f.add(l1); f.add(argument); f.add(b); f.add(l2); f.add(resultat); Programmering 1999 KVL Side Opgave: Lav dette layout Programmering 1999 KVL Side Sammenfatning Layout bestemmes af containerens layout manager. Man giver eventuel information til layout-manageren i kaldet af add. Forskellige layout managere skal bruge forskellig information. Man kan gruppere komponenter i Panel containere for at få dem behandlet som én komponent. Læs: L&L afsnit Programmering 1999 KVL Side 14-19