 Jens Bennedsen, 2003Introducerende objektorienteret programmering MVC Et mønster for grænseflader

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Model-View-Controller arkitektur Swing architecture is rooted in the model-view-controller (MVC) design that dates back to SmallTalk. MVC architecture calls for a visual application to be broken up into three separate parts: A model that represents the data for the application. The view that is the visual representation of that data. A controller that takes user input on the view and translates that to changes in the model. (se

 Jens Bennedsen, 2003Introducerende objektorienteret programmering MVC MVC opdeler en appilkation i tre dele: Modellen der er funktionalitet og data. Views fremviser information til brugeren. Controlers håndterer input. Views og controlers tilsammen udgør grænsefladen. En ”change-propagation mechanism” sikrer konststensen mellem grænsefladen og modellen

 Jens Bennedsen, 2003Introducerende objektorienteret programmering MVC - et eksempel SF pct: 9,8 V pct: 24,5... Parlament

 Jens Bennedsen, 2003Introducerende objektorienteret programmering MVC in action Tidligere så vi hvordan et tekstfelt kunne opdateres af en knap Tekstfeltet indeholdt værdien... Hmmm... Det burde være et objekt

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Ændring af model Når modellen (=tælleren) ændres skal tekstfeltet opdateres –Afhængigheden skal være så lille som muligt fra modellen til grænsefladen –update! Når modellen ændres kalder den update på alle gr.flade komponenter der lytter import java.util.*; public class Counter extends Observable { public void addOne() { count = count +1; setChanged(); notifyObservers(); }... } import java.util.*; public class CounterView extends JFrame implements Observer { public void update (Observable model, Object args) { Counter m = (Counter)model; String t = Integer.toString(m.getCount()); tal.setText(t); }... }

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Driver Counter c = new Counter(); CounterView cv1 = new CounterView(); cv1.setSize(200,200); cv1.setVisible(true); CounterView cv2 = new CounterView(); cv2.setSize(200,200); cv2.setVisible(true); c.addObserver(cv1); c.addObserver(cv2); c.addOne(); wait1(); c.addOne(); wait1(); c.deleteObserver(cv2); c.addOne(); wait1(); c.addOne();

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Hvad med bruger input? Controllerens ansvar er at oversætte brugerinput til handlinger i modellen Hvad kan brugerinput være? –Skrivning i tekstfelt –Tryk på knap –... Nyt eksempel: En konto Observable Konto -saldo:double +Konto() +getSaldo():double -notifyObs():void JFrame Observer KontoGUI model:Konto saldoLabel:JLabel saldoText:JTextField +KontoGUI(model:Konto) +update(o:Observable,arg:Object):void +indsæt(b:double) +hæv(b:double)

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Controller Tryk på hæv/indsæt skal fanges af en eventhandler, der skal opdatere modellen private class KontoGUIIndsætController implements ActionListener { public KontoGUIIndsætController(Konto model) { this.model = model; KontoGUI.this.indsætButton.addActionListener(this); } public void actionPerformed(ActionEvent e) { String indsættesString = KontoGUI.this.indsætText.getText(); try { double indsættes = Double.parseDouble(indsættesString); model.indsæt(indsættes); } catch (NumberFormatException ex) { KontoGUI.this.update(model,null); } private Konto model; }

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Eksempel Lad os se på koden:

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Flere views Lad os lave et view der kan alarmere når en konto bliver negativ

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Problem Fleksibel brugergrænseflade –den samme information præsenteres i forskellige vinduer –manipulationer af data skal afspejles med det samme –ændringer i grænsefladen skal være lette og mulige på runtime –Koden for grænsefladen skal være afkoblet fra resten af applikationen

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Løsning MVC –Model’en indkapsler data og funktionalitet –View fremviser informationer til brugeren, som det modtager fra model’en. Der kan være flere view’s på model’en –Et View har en tilknyttet controler, der håndterer bruger-input hændelser. Den oversætter dem til forespøgsler til model’en eller view’et

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Struktur Class Model Resposibility core delen af applikationen registrerer afhængige views og controlers informerer afhængige kompo- nenter om tilstandsændringer Collaborators View Controler change-propagation er den eneste kobling mellem modellen og dens views/controlers

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Struktur (View) View’s tilbyder ofte funktionalitet for controleren til at manipulere displayet (brugbart når der ikke sker ændringer i model’en) Class View Resposibility opretter og initialiserer dens til- knyttede controler fremviser information til brugeren Implementerer en update op. (som kaldes når der notificeres) Modtager data fra model’en Collaborators Model Controler

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Struktur (Controler) Hvis controlerens opførsel afhænger af modellens tilstand kobler den sig på ”change- propagation” (og realiserer update metoden) Class Controler Resposibility modtager brugerinput (hændelser) oversætter hændelser til opdater/ aflæs kald af model’en eller fremvis kald af view’et Implementerer en update op. (hvis det er nødvendigt) Collaborators Model View

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Struktur Model coreData attach(o : Observer) : void detach(o : Observer) : void notify() getData() : coreData Observer update() 0..* * View View(m : Model) makeControler() display() update() Controler Controler(m : Model, v: View) handleEvent() update() 1111

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Dynamik - hændelse aView : ViewaControler : Controler aModel : Model : bruger handleEvent( ) setData( ) notify( ) update( ) display( ) getData( ) update( ) getData( )

 Jens Bennedsen, 2003Introducerende objektorienteret programmering Dynamik - opstart

 Jens Bennedsen, 2003Introducerende objektorienteret programmering konsekvenser Flere views på den samme model Synkrniserede views udskiftbare views og controlers –adskildelsen af view og controler betyder af de kan varieres individuelt Framework mulighed

 Jens Bennedsen, 2003Introducerende objektorienteret programmering  konsekvenser Forøget kompleksitet mulighed for mange (unødige) updates tæt kobling mellem view og controler tæt kobling fra view/controler til model ineffektiv dataaccess svært at flytte view/controler til anden platform