Download - Kursusgang 13

Design af brugerflader 13.1

Kursusgang 13Oversigt:

• Sidste kursusgang

• Beskrivelser af komponenter

• Typiske komponenter

• Arkitektur for en GUI


Beskrivelser af komponenter

• Gå ind på www.java.sun.com

• Vælg APIs under Documentation

• Vælge den relevante package (vindue 1)

• Vælg den relevante klasse (vindue 2)

• Beskrivelsen af klassen findes i vindue 3


Sidste kursusgang• Layout-managere

BorderLayout FlowLayout GridLayout Boxlayout

• Eksempel på opbygning af et vindue til et administrativt system

• Event-håndtering Swings model Events Listener Binding til objekt

ActionEvent ActionListener // kode til håndtering // en event

Button


Knapper (1)• Der findes en række forskellige

knapper

• Menupunkter defineres også som knapper

• Alle knapper er specialiseringer af AbstractButton, som er en generel mekanisme til selektering

• BasicArrowButton er fra javax.swing.plaf.basic


Knapper (2)• De typiske knapper

genereres enten navngivet eller anonymt

• Pile-knapperne sættes ind i et separat panel jp, som så sættes ind i containeren cp


Knap-Gruppe (1)• Individuelle knapper kan

kombineres i en button group

• Hvert knap-objekt knyttes til et gruppe-objekt

• Til en given button group kan der tilføjes objekter af enhver klasse, der er en specialisering af AbstractButton


Knap-Gruppe (2)• Knapperne i en button

group virker med exclusive-or – dvs. at kun en af dem kan være aktiv ad gangen

• Alle undtagen JButton viser dette


Tekstfelt

• Der kan skrives i det

• Det kan aflæses

• Det kan gøres til et dokument, hvori ændringer kan aflæses løbende (eksempel i bogen)

• Flere forskellige specialiseringer


Check-bokse (1)• Markere en on/off

tilstand

• Kan bruges enkeltvist (den normale funktion) eller i en gruppe


Checkbokse (2)


Andre komponenter (1)• Borders

• ScrollPanes


Andre komponenter (2)

• Radioknapper

• Combo-boksDrop-down liste

• List-bokse


Andre komponenter (3)

• Simple menuer

• Sliders ogprogress bars


Arkitektur for en GUI

• Egenskaber ved klasser: Høj samhørighed Lav kobling Eksempel: kunde og konto er én klasse

• Hvorfor er det vigtigt?

• Hvordan opnås det?

• Opdeling (separation of concerns)


Generel løsning:Model-View-Controller• Generel løsning, som blev udviklet i

tilknytning til Smalltalk

• Eksempel: diagram i Excel

• Separerer tre forskellige aspekter af en GUI for en given komponent

• Model (og funktion): holder styr på komponentens tilstand (indirekte kommunikation: kan kun broadcaste til view og controller - stiplet)

• View: den visuelle præsentation af en komponent (kan give besked til controlleren, f.eks. om musens position, da der blev klikket)

• Controller: finder ud af, om komponenten skal reagere på en event, for eksempel et klik på musen


Java’s løsning• View og controller er slået

sammen til en UI delegate

• Vil gerne muliggøre mange-til-mange relation mellem model og UI delegate

• Hvorfor kan MVC ikke dette?

• Løses ved kun at bruge indirekte kommunikation begge veje


Eksempel (1)• Eksempel

• Separering af forretningslogik og brugergrænseflade

• Calc 1 ganger med modifier, mens Calc 2 lægger den til


Eksempel (2)


Eksempel (3)


Application Framework

• Et application framework er en klasse eller en samling af klasser, som løser et bestemt problem

• Man bruger framework’et ved at nedarve fra en af klasserne og så overskrive nogle af metoderne

• En bestemt type application frameworks er designede til at reagere på events. De kaldes også control frameworks

• Java Swing er et application framework (control framework)


Status

• Gennemgang af typiske komponenter

• Oversigt over GUI-struktur: Model-View-Controller UI delegate Application framework

Næste gang:

• En større opgave Ingen forelæsning Hjælpelærere til rådighed 4 timer Prøv at anvende beskrivelser og teknikker fra kurset To demoer sidste kursusgang?