Model View Controller Architektur

[compuboy1010]

Hallo Board,

kennt sich jemand sehr gut mit der Model View Controller Architektur aus?
Ich bräuchte Hilfe beim Architekturdesign.

[mojave]

ich beschäftige mich ebenfalls grade damit und wäre froh wenn jemand ein minimalbeispiel zeigen könnte. am besten mit hilfe der EventDispatcher-klasse von MM

[compuboy1010]

Also ein Minimalbeispiel hast du hier:

http://www.macromedia.com/devnet/fla...ontroller.html

Ich suche nach einer MVC Beispielarchitektur für eine Webseite mit mehreren Sektionen und einem Haupmenu. Kann mir solche eine Architektur einfach nicht vorstellen.

In dem Beispiel oben ist ja alles auf einem einzigen Stage. Wie ist es aber wenn der Benutzer auf einen Menüpunkt klickt und zu einer anderen Sektion der Seite springt? Braucht man dann für jede Sektion einen View und für alle sichtbaren Objekte dieser Sektion wieder einen View?

[atothek]

Fang doch erstmal klein an dazu reichen ja erstmal 4 klassen

Flapp

Model
View
Controller

Flapp ist die Applikations klasse, in den anderen klassen erstellen wir zunächst einmal eine ganz simple implementierung. Dann gehen wir einen schritt weiter
hier zunächst einmal die einfache basis

mehr folgt später

mfg
alex

[mojave]

vielen dank für so ein beispiel.

jedoch mal abgesehen davon, dass ich nix sehe wenn ich's kompilliere verstehe ich nicht warum du dem model eine referenz auf den controller übergibtst. ich dachte das es ein wesentlicher bestandteil von mvc ist, dass das model weder v noch c kennt, und events sendet wenn was passiert, die der controller verarbeitet.

[atothek]

@mojave du mußt beim kompilieren vorher noch deinen classpath in flash erweitern

Menü->Bearbeiten->Voreinstellungen->ActionScript
und dann unten unter "ActionScript 2.0 Einstellung" einen neuen eintrag mit "./src" eintragen( ohne anführzeichen )

in sachen Model <-> Controller wäre es mir neu das das model nix vom controller wissen darf, wenn man mit EventDispatching arbeitet ist das nicht zwingend notwendig das stimmt, ich finde es aber zu verwirrend in einem einfachen Beispiel eine komplexe Event Struktur zu integrieren, und deshalb weise ich dem model eine referenz auf den controller zu

mfg
alex

[mojave]

ich habe mal eine frage zu einem echt simplen beispiel:

ein button der den status on/off bewirkt.


View: zeichnet den Button + Textfeld

Model: speichert den status.

Controller: ändert den status.

--------------------------------------------

Model: sendet über EventDispatcher einen event "onStatusChange"

PHP-Code:

public function changeStatus(){
    dispatchEvent({type:"onChangeState",target:this});
}

public function getStatus():Boolean{
     return status;
}
public function setStatus(value):Boolean{
     status = value;
} 


Controller: ist bei Model registriert und verarbeitet event:

PHP-Code:

function onChangeStatus(){
    model.setStatus(!model.getStatus()); 
    // hier view.update() ????  
} 


View : bekommt update befehl

PHP-Code:

function update(){
     textfeld.text = model.getStatus();
} 


1. frage: ist das soweit richtig verstanden?

2. frage: wie allerdings ist das mit der View-Klasse, die den Button und ein Textfeld zum anzeigen des status bereitstellt.
wie behandel ich hier ereignisse? gehts es den weg:

PHP-Code:

button.onPress = function(){
    model.changeStatus();
}
//Model dispatcht "onChangeStatus"
//Controller fängt Event auf und behandelt.
//Controller sendet update ans View 


[subHero]

@atothek: auweia, da ist doch einiges verquer in deiner interpretation von mvc
z.bsp. 'In MVC, The controller is NOT a Mediator between the view and the model.'.

@mojave:
1. frage: ist das soweit richtig verstanden?

fast:
- das model verwaltet den status
- ein view kennt das model, seinen controller und registriert sich als listener beim model
- ein zum view gehöriger controller kennt seinen view und das model.

2. frage: wie allerdings ist das mit der View-Klasse, die den Button und ein Textfeld zum anzeigen des status bereitstellt.
wie behandel ich hier ereignisse?

der button im view wird geklickt.
der controller fängt dieses ab und ändert den status im model.
das model dispatched, das sich der status geändert hat.
die textanzeige des views verändert sich dementsprechend.
und wieder von vorne ...

hoffe'shilft
-sh

[atothek]

also zum einen würde ich das MVC nicht bei "Componenten" ähnlichen gebilden anwenden, das wäre wie mit kanonen auf spatzen schießen. Und dann ist deine logik nicht sinnvoll. du feuerst das onChange event ohne das was geändert wird ??? das muß genau anderes sein also das model ändert sich und danch feuert es das onChange event, der controller selber bekommt dann nur darüber bescheid und kann die view dann anpassen

mfg
alex

EDIT

@subHero Das sehe ich zb. ganz anders, der name sagt es doch schon aus, er kontrolliert also ist er der entscheidungsträger. und kontrolliert die view und das model. Sicherlich ist das eher das MVP prinzip

und wenn du dir deinen beitrag durchliest beschreibst du ja genau das verhlaten aus meinen beispiel

der button im view wird geklickt.
der controller fängt dieses ab und ändert den status im model.
das model dispatched, das sich der status geändert hat.
die textanzeige des views verändert sich dementsprechend.
und wieder von vorne ...

[subHero]

Zitat von atothek

@subHero Das sehe ich zb. ganz anders, der name sagt es doch schon aus, er kontrolliert also ist er der entscheidungsträger. und kontrolliert die view und das model. Sicherlich ist das eher das MVP prinzip

umgeschrieben für GUI-MVC wäre das:
Das sehe ich zb. ganz anders, der name sagt es doch schon aus, er kontrolliert den userinput eines views, also ist er der entscheidungsträger was darauf zu erfolgen hat. er kontrolliert den input des views und abhängig von diesem ändert er das model oder den view direkt. Sicherlich ist das eher das MVC prinzip

und wenn du dir deinen beitrag durchliest beschreibst du ja genau das verhlaten aus meinen beispiel

eben, genau nicht (obwohl natürlich jedem die freiheit zur eigeninterpretation zugestanden ist). ist doch eigentlich schon zu genüge durchgekaut worden und mr. moock hat doch der welt sehr schöne, relevante schaubilder hinterlassen:





natürlich sind standalone-controller gängig (v.a. in tier-übergreifendem MVC, a la DB (Model), Browser (View) und DB-Access/Abstraction (Controller) ).
aber im GUI-MVC sollte man meiner meinung nach nicht die flexibilität, welches einem die model-unabhängigen view-controller-paare liefern (v.a. in puncto wiederverwendbarkeit), aufgeben.

mal ne gegenfrage:
wie würdest du denn weitere views, bzw. controller in deinem schema unter einem model integrieren (z.bsp. navigation *und* sektion)?
kann ja auch sein das ich aufm schlauch stehe...

cheers
-sh

[atothek]

also ich finde nicht das MVC ein derartiges Dogma ist, mir gefällt es zb. gar nicht das das model irgendwas von der view weiß, das model braucht die view gar nicht kennen, ich laß mal event basierte implemntierung dabei außen vor. Für mich ist halt der controller der dreh und angelpunkt oder ich sag mal lieber Presenter

Ich persönlich finde das Beispiel von Moock ehrlich gesagt auch nicht toll.
Ich finde es viel zu rückständig im vergleich zu dem MVP Pattern von Martin Fowler, der Ansatz ist wesentlicher interesanter und unabhängiger.

ich glaube das ist dabei die wesentlichste aussage

ist doch eigentlich schon zu genüge durchgekaut worden

richtige Projectimplemetierung sehen ehe ganz anders aus, da kommt man um EventBasierte umsetzungen sowie Managed Screens gar nicht drum rum.

hier ist nochmal nen version mit 2 views, in 20 min umgesetzt, wobei das nun kein ernst zu nehmendes Beispiel ist.

mfg
alex

[the binary]

sehr schickes beispiel.

[hazy fantazy]

Hier ist noch ein anderes Beispiel, das eher der klassischen Auffassung von MVC entspricht. Zwei Textfelder, die voneinander abhängen. Im oberen steht eine Zahl von 0 bis 200 und im unteren die entsprechende Prozentzahl.

class MVCDemo {
    
    private static var instance:MVCDemo;
    
    public static function main( canvas:MovieClip){
        instance = new MVCDemo( canvas);
    }
    
    
    private var canvas:MovieClip;
    private var controller:Controller;
    private var model:Model;
    private var view:View;
    
    private function MVCDemo( canvas:MovieClip){
        this.canvas = canvas;
        setup();
    }
    
    private function setup(){
        controller = new Controller();
        model = new Model();
        view = new View(canvas);
        //
        controller.view = view;
        controller.model = model;
        view.controller = controller;
        model.addEventListener( 'update', view);
        //
        run();
    }
    
    private function run(){
        controller.run();
    }
    
}
 
 
import mx.events.EventDispatcher;
 
class Model {
    
    public function Model(){
        EventDispatcher.initialize( this);
    }
    
    public function addEventListener( type:String, listener:Object):Void{}
    private function dispatchEvent( evt:Object){}
    
    public var minValue:Number = 0;
    public var maxValue:Number = 200;
    public var value:Number = 0;
    public var percent:Number = 0;
    
    public function update(){
        dispatchEvent({type:"update"});
    }
    
    public function setValue( v:Number):Void{
        if( isNaN( v)) return;
        if( v < minValue) v = minValue;
        if( v > maxValue) v = maxValue;
        value = v;
        percent = (v - minValue) / (maxValue - minValue) * 100;
        update();
    }
    
    public function setPercent( v:Number):Void{
        if( isNaN( v)) return;
        if( v < 0) v = 0;
        if( v > 100) v = 100;
        percent = v;
        value = percent / 100 * (maxValue - minValue) + minValue;
        update();
    }
}
 
class View {
    
    public var controller:Controller;
    
    
    private var tfValue:TextField;
    private var tfPercent:TextField;
    
    public function View( canvas:MovieClip){
        createUI( canvas);
    }
    
    private function createUI( canvas:MovieClip){
        canvas.createTextField("tfValue", 1, 0, 0, 100, 20);
        tfValue = canvas["tfValue"];
        tfValue.border = true;
        tfValue.type = "input";
        //
        canvas.createTextField("tfPercent", 2, 0, 25, 100, 20);
        tfPercent = canvas["tfPercent"];
        tfPercent.border = true;
        tfPercent.type = "input";
        //
        initKeyListener();
    }
    
    private function update( evt:Object):Void{
        tfValue.text = evt.target.value;
        tfPercent.text = evt.target.percent + "%";
    }
    
    private function initKeyListener(){
        Key.addListener( this);
    }
    
    private var enterPressed:Boolean = false;
    
    private function onKeyDown():Void{
        if( enterPressed) return;
        if( Key.getCode() != Key.ENTER) return;
        enterPressed = true;
        if( Selection.getFocus() == targetPath( tfValue)){
            controller.setValue( tfValue.text);
        } else if( Selection.getFocus() == targetPath( tfPercent)){
            controller.setPercent( tfPercent.text);
        }
    }
    
    private function onKeyUp():Void{
        enterPressed = false;
    }
    
    private function onUnload(){
        Key.removeListener( this);
    }
}
 
 
class Controller {
    
    public var view:View;
    public var model:Model;
    
    public function run(){
        model.setValue( 150);
    }
    
    public function setValue( v:String){
        model.setValue( parseFloat(v));
    }
    
    public function setPercent( v:String){
        model.setPercent( parseFloat(v));
    }
    
} 

Was ich dabei ein bißchen störend finde, ist das sich setValue und setPercent durch alle drei Klassen zieht. Jedes weitere Eingabefeld führt also immer zu drei weiteren Routinen. Wenn ich ein Formular mit 30 Feldern habe, kann das schnell unübersichtlich werden.

mfg. h

[bokel]

Aber diese Beispiele sind ja alle vergleichsweise primitiv. Was compuboy1010 wollte ist schon ein bißchen komplexer. MVC ist ja nur ein Aspekt bei so einer kompletten Seite, damit werden halt die Views an das Model angebunden.

In dem Beispiel oben ist ja alles auf einem einzigen Stage. Wie ist es aber wenn der Benutzer auf einen Menüpunkt klickt und zu einer anderen Sektion der Seite springt? Braucht man dann für jede Sektion einen View und für alle sichtbaren Objekte dieser Sektion wieder einen View?

Genau, Views brauchst du jede Menge. Du könntest dir auch mal ARP und Caingorm anschauen. Das sind Frameworks für komplette Sites.
mfg. r.

[compuboy1010]

Wo bekommt man das?

Caingorm?