ActionScript 3 – Model View Controller (MVC)

Wednesday, February 11th, 2009 | ActionScript 3, tutorials, videos

Click to view the video in a pop-up. Right-click and “save as” to download the video to your hard drive.

Watch Video Tutorial on Model View Controller

Tags:

  • KD
    Looks like the video is down :(
  • Josh
    Really good tutorial. I've been looking at different design practices to incorporate into the projects I do at work. MVC looks like the best way to go in separating game logic, data logic and the display.
  • Kerry
    Then you don't have to redo your video =)
  • Kerry
    @labcoat - I'm at the very beginning stages of understanding design patterns and so I've been looking up many resources. One I've come across is an excerpt from the AS3 Design Patterns book from O'Reilly (which can be viewed at http://www.adobe.com/devnet/actionscript/articl...). It lists each views "knowledge" of other views a bit differently and I think more inline with what John's video was saying.

    It says that:
    -the model needs a reference to the views
    -the view needs a reference to both the controller and the model and
    -the controller needs a reference to the model

    It describes the communication between the different parts after a simple button click like so:

    "The sequence of events is represented
    as follows:
    1. User interacts with a user interface element (e.g. clicks on a button in a view).
    2. The view sends the click event to the controller to decide how to handle it.
    3. The controller changes the model based on how it decides to handle the button
    click.
    4. The model informs the view that the state of the model has now changed.
    5. The view reads state information from the model and updates itself."

    @John - Thanks for the videos!
  • John Lindquist
    The great thing about design patterns is that they teach you best practices on how to keep your code clean and separated. In real-world situations, you use them as guidelines instead of rules.
  • Santosh(laaptu)
    Thanks a lot John.This video means a lot to me
  • labcoat
    Thanks John!

    As MVC is probably one of the most misunderstood patterns, I need to point out a flaw with your implementation.

    In classic MVC, the relationship between the model, the view and the controller is different. The model only "knows" about itself, and only dispatches an event when its' data changes to anyone who cares to listen (the views). Each view is only supposed to "know" about the model which is represents, and "know" nothing of the controller, and has the job of listening to the model for changes and updating/re-rendering itself when notified by the model of a change. The controller "knows" about the model and all of the views, and is responsible for handling user input and updating the model as necessary.

    The controller handles user input by binding event listeners to the view's elements, but to its' own handlers. For example, in your demo the controller should add an event listener to the view's button (click event) to its' own handler - in the handler the controller should get the value of the text field, modify the text as necessary, and set that value into the model. The model dispatches the change event, and all views that are listening (in the case of the demo, only one view) will just update/re-render by getting the modified data from the model and displaying it.

    This is the true power of the MVC - each view only knows about the data it represents, and does not worry about user interaction - which is the main purpose of the controller... get input from user, and update model as necessary.
  • John Lindquist
    @labcoat - Thanks for pointing that out. Definitely a slip-up on my part when putting together my example. If I find the time, I'll update the example and have the controller add the listeners to the view.
  • Laika
    Hi !
    Thanks a lot for this video, can't wait for the part 2 !!
  • HP
    Thanks, please do the second video on why do we used MVC
  • do you seriously code in MVC? As an architect of many years, including 7 in flash, I think I have QA'd just about every possible disaster scenario, many of which come about from applying traditional coding paradigms to areas where they just over complicate matters. In the case of flash, I have come into supposed OOP projects quite a few times with MVC or other design patterns, 6 thousand classes and not a whit of documentation to tie it together. The answer is of course good documentation on differing levels. Although I will admit that MVC is a good way to ensure the client never uses another coder.
  • dawe
    And what about dispatchEvent from model. What if i will give listener in controller and he will comunicate to View. It is bad thing? thanks
  • Marian
    this is a really good tutorial. Thanks
  • Jian Wu
    hi,I love as3 develop,can you teach me,tks
  • George
    Thank you that really helped explain the MVC comment, plus i picked up on some basic Flex tips.

    Thanks!
  • Thanks a lot John! This video is very insightful - even if its still kinda over my head at the moment! But I think after a few times watching it will be clearer. Its great just to watch a real coder in action as well!

    This site is a goldmine resource for learning :)
  • Karl Macklin
    Looking forward to another part explaining benefits and such.

    I don't know much about MVC but I thought the idea was to decouple the view and model, and have the controller act as a mediator between them.
    As it is right now, the view knows about the model, no?

    I am certain there a huge benefits with MVC as a design pattern, but at the end of this video I can't help but think "ok so now it's more tedious to set up a interactive function for example".

    I tried getting into MVC and Cairngorn a while back but got stumped by the difficulty of it.

    In any case, these kind of videos are always helpful. I plan to starting up some of my own. Gotta set up a blog first.
  • ookla
    dude, that is a shame that I don't have cash on paypal.. really really thanks!
  • Hendrik Lammers
    Thnx!!
  • Igor
    Hey. Great video! Is there any chance you can release the source code? The video is simple enough to follow but it would be quicker to check the source code instead of watching the video again to better understand the concepts.
    Cheers.
  • Matt Newell
    Great video can't wait for part 2.
  • Odrakir
    I can see it.

    I don't know why, but for me it feels more "safe" not to pass references from one class to another and use listeners created in the main class application (in this case).

    That way I could have several controllers or several views and make them all pass through a single function when updated, so they are easier to controll.

    But maybe I'm not talking about MVC... I'm not an expert in patterns.
  • Nice tutorial. Very well done.
  • John Lindquist
    Are you sure the video is down? Is anyone else experiencing this?
  • Looking forward to watching this but the video is down, why not upload it to YouTube?
  • Good idea to publish this here!! Thanks a lot
blog comments powered by Disqus

Search

Recommended Books

Speaking at FITC Toronto

Recent Comments

 

February 2009
M T W T F S S
« Jan   Mar »
 1
2345678
9101112131415
16171819202122
232425262728  

Preferred Video Tutorial Resolution

  • 1024x768 (53%, 85 Votes)
  • 1280x1024 (15%, 24 Votes)
  • 1920x1080 (15%, 24 Votes)
  • 800x600 (13%, 20 Votes)
  • 480x320 (4%, 6 Votes)
  • 640x480 (0%, 2 Votes)

Total Voters: 160

Loading ... Loading ...