Model View Controller. Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Relevanta dokument
Observer Pattern och MVC. Objekt-orienterad programmering och design (DIT953) Niklas Broberg, 2018

Observer Pattern och MVC. Objekt-orienterad programmering och design Alex Gerdes, 2016

Observer Pattern och MVC. Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2017

Separation of Concern. Objekt-orienterad programmering och design (DIT953) Niklas Broberg / Johannes Åman Pohjola, 2018

Separation of Concern. Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016 Johannes Åman Pohjola, 2017

Observer Pa*ern och MVC. Objekt-orienterad programmering och design Alex Gerdes, 2018

Objektorienterad Programkonstruktion. Föreläsning 6 23 nov 2015

Lambdas. (och fler design patterns) Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2017

Design och konstruktion av grafiska gränssnitt

Objekt-orienterad programmering och design. DIT953 Niklas Broberg, 2018

UML. Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Modulär design. Objekt-orienterad programmering och design (DIT953) Niklas Broberg / Johannes Åman Pohjola, 2018

Design och konstruktion av grafiska gränssnitt

TDDC30. Objektorienterad programmering i Java, datastrukturer och algoritmer. Föreläsning 11 Jonas Lindgren, Institutionen för Datavetenskap, LiU

ITK:P1 Föreläsning 4. Grafiska gränssnitt i Java. AWT-komponenter

Objekt-orienterad Programmering och Design. TDA551 Alex Gerdes, HT-2016

Föreläsnings 11 - GUI, Händelsestyrda program, MVC

TDDD78 projekt: Tower Defence

Objekt-orienterad Programmering och Design. TDA552 Alex Gerdes, HT-2018

Laboration 3 GUI-programmering

Design Patterns. Objekt-orienterad programmering och design Alex Gerdes, 2016

Programutvecklingsprojekt Projektgrupp Elvin. Detailed Design Document

DVGB05 Grafiska användargränssnitt. Mjukvarudesign med Model-View-Controller

Snake App Rapport - Snake App Rapport Utskriven/PDF Export: Copyright Version 1.2 Sidan 1 av 9.

Principer, Pa+erns och Tekniker. Objekt-orienterad programmering och design Alex Gerdes, 2018

Objektorienterad programmering med Java Swing: Händelser, lyssnare och applets

TDDC30 Programmering i Java, Datastrukturer och Algoritmer Lektion 5. Laboration 4 Lådplanering Exempel på grafik, ett avancerat program Frågor

Modulär design Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Spelet i sig är inte avancerat men projektet ställer en del krav på implementationen bland annat:

Principer, Patterns och Tekniker. Objekt-orienterad programmering och design (DIT953) Niklas Broberg / Johannes Åman Pohjola, 2018

Principer, Patterns och Tekniker. Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Översikt Föreläsning 1. Trivicalc. Vad är trivicalc? En cell. Områden på skärmen. SMD168/SMD135 Fredrik Bengtsson

TDDC30 Programmering i Java, Datastrukturer och Algoritmer Lektion 3

CliMate följer Tre-lager-arkitektur. Domänobjekt - domänlogiklagret. Viktiga domänklasser i CliMate. De tre lagren. Paketen i CliMate:

Det här dokumentet är till för att ge en översikt över ASP.NET MVC samt hur WCF Services används från.net applikationer.

Praktikum i programvaruproduktion

Mutability och State. Objekt-orienterad programmering och design (DIT953) Niklas Broberg / Johannes Åman Pohjola, 2018

Objektorienterad Programkonstruktion

Objektorienterad Programkonstruktion. Föreläsning 3 9 nov 2015

Vad utmärker ett bra användargränssnitt?

Objektorienterad Programkonstruktion. Föreläsning jan 2016

NYHETER I INVENTOR 2012

TDDC30 Programmering i Java, Datastrukturer och Algoritmer Lektion 3

Objektorienterad programmering Föreläsning 2

Objektorienterad Programkonstruktion. Föreläsning 9 30 nov 2016

Kravspecifikation. Sammanfattning. Fyra i rad Javaprojekt inom TDDC32. Version 2.0. Datum Dokumentnummer

Objektorienterad Programkonstruktion. Föreläsning 7 24 nov 2015

Objektorienterad Programkonstruktion. Föreläsning 3 7 nov 2016

KOM IGÅNG, UPPDRAG OCH KOMPONENTER

Appar med ryggrad. Introduktion till JavaScriptramverket Backbone

Föreläsning 8 - del 2: Objektorienterad programmering - avancerat

Gränssnitt för FakeGranska. Lars Mattsson

Design Patterns Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2017

Classes och Interfaces, Objects och References Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Universe Engine Rapport

Generic type declarations. Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Vilken version av Dreamweaver använder du?

2I1049 Föreläsning 8. Grafiska gränssnitt i Java. AWT-komponenter. Grafiska gränssnitt, Java interface och händelsehantering

Objektorienterad Programmering DAT043. Föreläsning 5 29/1-18 Moa Johansson (delvis baserat på Fredrik Lindblads material)

Klient/server. Översikt. Lektion 1: Webbtekniker från Microsoft. Webbteknik från Microsoft. Klient/server. Designmönster. Utrullning.

Static vs Dynamic binding Override vs Overload. Objekt-orienterad programmering och design Alex Gerdes och Sólrún Halla Einarsdóttir, 2018

Next -> Next -> Finish

Subtyping och variance. Objekt-orienterad programmering och design Alex Gerdes, 2018

Objektorienterad programmering E. Telefonboken, än en gång. Gränssnitt. Telefonboken med gränssnitt specificerat, del 1.

1 Grafiska komponenter

DIGITALA RESURSER MANUAL FÖR. Föreläsning via Acrobat Connect

Föreläsning 5. När skall man använda implementationsarv? När skall man använda implementationsarv?

Föreläsning 1: Introduktion till kursen

Styra olika typer av objekt som animering, video, ljud och Flashfilm

Inlämningsarbete Case. Innehåll Bakgrund bedömning inlämningsarbete... 2 Inlämnade arbeten... 4

2I1049 Föreläsning 9. Iterativ programutveckling. Iterativ programutveckling. Modularisering, återanvändning och JavaBeans

TUTORIAL: SAMLING & KONSOLL

Designmönster - EMW. Kent Petersson epost1: kentp@cs.chalmers.se epost2: kent.petersson@emw.ericsson.se URL:

Grundläggande programmering, STS 1, VT Sven Sandberg. Föreläsning 18

Arkitektur. Den Röda Tråden

Objektorienterad Systemutveckling Period 3

Projektrapport EDA095

Arkitektur Michael Åhs

Att använda svenska 1

DI-institutionen Sid 1 av 6 Hans-Edy Mårtensson Sten Sundin

public class Main extends MovieClip { var hillpage:hillpage; var ifpage:ifpage;

Vis it. jquery jquery används lite överallt i appen på olika sätt. Det främsta användningsområdet är vid selektering och manipulering av HTML element.

Grafiska användargränssnitt i Java

Webservice & ERP-Integration Rapport

Java: Utvecklingsverktyg, datatyper, kontrollstrukturer

Classes och Interfaces, Objects och References, Initialization

Grafiska användargränssnitt i Java

TILLÄMPNINGAR INOM DATORTEKNIK

TDDE10 m.fl. Objektorienterad programmering i Java Föreläsning 7 Erik Nilsson, Institutionen för Datavetenskap, LiU

Föreläsning 17 UTBLICK: FORTSÄTTNINGSKURSER I DATAVETENSKAP + ANDROID

MVC-mönstret. model-view-control i Swing

2. Windows 10. Behandlade Ord. Windows Anniversary. Göran Johansson

Design. Vad lärde jag mig förra lekfonen? Hur bidrog jag Fll lärandet? Kravhantering sammanfa0ning 13/04/14

Properties. Användbara metoder som kan anropas i propertychanged:

TDDD78 Att välja och planera ett projekt

Principles of subclasses. Objekt-orienterad programmering och design Alex Gerdes, 2018

Föreläsning 3: Händelsestyrda program och användargränssnitt

ARX på Windows Vista, Windows 7 eller Windows 2008 server

725G61 - Laboration 7 Implementation av ett API. Johan Falkenjack

Transkript:

Model View Controller Objekt-orienterad programmering och design (DIT952) Niklas Broberg, 2016

Model View Controller Model View Controller (MVC) är ett design pattern (architectural pattern) som är väldigt vanligt förekommande för alla typer av program som innehåller någon form av grafisk representation. Grunden i MVC är att vi separerar: Koden för data-modellen (M) från användargränssnitt (V och C). Detta är den viktigaste uppdelningen. Inom användargränssnitt skiljer vi koden som visar upp (delar av) modellen för användaren (V) från koden som hanterar input från användaren (C). (Finns väldigt många varianter med diverse olika namn (AM-MVC, MVP, HMVC, MVVM, ) som skiljer sig åt i detaljer. Grundprincipen är densamma. Lite mer om detta på föreläsningen.)

Model Modellen (Model) är en representation av den domän som programmet arbetar över helt oberoende av användargränssnitt. Data, tillstånd, domänlogik. Modellen i singular vi har inte flera modeller för samma domän. Modellen kan dock internt bestå av flera olika delar som representerar olika aspekter av domänen (dvs ingen duplicering). Tumregel för avgränsning från V och C: Tänk The whole model and nothing but the model. Ska kunna presenteras för och kontrolleras av användaren på olika sett e.g. med 2D-grafik eller text utan att valet i sig påverkar e.g. modellens tillstånd. Nothing but the model Ska innehålla allt det som vore detsamma oavsett hur modellen presenteras eller kontrolleras. Ingenting ska behöva dupliceras mellan olika vy- eller kontroll-komponenter. The whole model

View En vy (View) beskriver (delar av) modellen för användaren. Olika tänkbara format: Text, grafik (2D, 3D, ), ljud, haptik, Vi pratar om vy, oavsett vilket format presentationen görs på. Vi kan ha många olika vyer (ofta samtidigt) för en och samma modell. Olika vyer kan visa upp olika aspekter av modellen. E.g. karta, inventory, synfält för ett dataspel. Olika vyer kan visa upp samma aspekt på olika format E.g. musik spelas upp, och visas samtidigt grafiskt som frekvens-amplitud-diagram. Vi vill (oftast) att vyn uppdateras när modellen den presenterar uppdateras. Finns olika sätt att se till detta (mer på föreläsningen imorgon).

Controller En Controller styr modell och vy(er) utifrån input från användaren. Vi kan ha många controllers som styr olika aspekter av både modell och vy. Olika varianter av MVC använder controllers lite olika: alltifrån en enskild controller som styr alla aspekter av modell och vyer, till många separata controllers för varje del-vy. De flesta moderna grafik-gränssnitt (som Java Swing) innehåller stöd för att förenkla för controllers att hantera användar-inputs genom events och event listeners.

Övning -preamble Börja från koden som finns att ladda ner från hemsidan. Vår gamla kod från förra veckan är uppdaterad enligt vad vi gjorde på föreläsningen i onsdags (färdigställt): Vårt subpaket DIT952.polygons.polygon har nu en fasad (Facade Pattern) som består av PolygonFactory (Factory Method Pattern) och interfacet IPolygon. DrawPolygons beror endast på denna fasad, och inga paketinterna detaljer (det kan den inte eftersom dessa inte längre exponeras utanför paketet). Paketet DIT952.shapes är oförändrat sen förra veckan. Detta paket följer inte våra principer, och exponerar fortfarande paket-interna detaljer. Eftersom vi låtsas att detta är ett paket vi laddat ner från nätet och inte vill ändra i, eftersom vi vill kunna ta del av framtida uppdateringar och bug-fixar, så låter vi det vara så för nu. För extra övning kan ni dock omvandla även detta paket så att det exponerar ett väldefinierat och genomtänkt gränssnitt (men inte just nu, det är inte fokus för dagens övning). Vi har introducerat klasser och gränssnitt för att få det något annorlunda gränssnitt som DIT952.shapes exponerar att fungera ihop med DrawPolygons (Adapter Pattern). Dessa ligger i ett separat paket DIT952.adapter. Som uppföljning från förra veckan, läs och förstå hur vår adapter fungerar, och varför vi behöver använda oss av denna. Byt sen import i DrawPolygons, från det gamla till det nya enligt instruktion i filen, och se att det bara funkar.

Övning Betrakta nu vår kod utifrån ett MVC-perspektiv. Vad är vår Model? Vad är vår View? Vad är vår Controller? Är dessa väl åtskiljda från varandra? (Ledande fråga svaret är såklart nej.) Den stora boven är klassen DrawPolygons, som har aspekter av alla tre benen av MVC i sig. Låt DrawPolygons vara den klass som definierar vårt toppnivå-program, som innehåller metoden main, och initierar de ingående komponenterna. Skapa tre olika klasser: PolygonModel (vår Model, hanterar alla polygoner och deras tillstånd); PolygonViewer (vår View, visar polygoner på skärmen); PolygonController (vår Controller, styr animation och user input). Flytta relevanta delar av den gamla DrawPolygons till var och en av dessa. Fundera över hur de behöver kommunicera med varandra. Vem behöver bero på vem? Med de ändringar ni nu gjort har vi nu en väl avgränsad uppdelning i enlighet med MVC? Svaret är inte helt självklart, på mer en ett sätt, oavsett hur ni löst det. Fundera över argument för och emot. Istället för att starta med en fix lista av polygoner, låt användaren klicka ut nya rektanglar. Titta på gränssnittet java.awt.event.mouselistener. För mer utmaning (kräver eget grävande i APIerna för Java Swing), lägg till fler komponenter till vår View, t ex: Utöka fönstret med en panel som skriver ut en lista av de polygoner som finns i visningspanelen. Det räcker med att skriva ut center point för dem. Informationen ska uppdateras i samband med animationen. Lägg till en knapp som startar och stoppar animationen. Lägg till en väljare där användaren kan ställa in vilken sorts polygon som ritas ut när nya polygoner klickas fram.