MVC - Need a little help. :(

[tom_w2000]

Hi Guys,

I need some help with how to structure a major application in MVC, basically I have several applications (a gallery app, a coverflow app and a dataGrid application) that I want to display inside an main application.

The main application has a menu to select each application to load, and each loaded application is a Composite View containing other views like image display views, scrollbar views, sliders etc.

I am using the MVC pattern and the Composite pattern to create the applications themselves and simplify the update process, and I have a few questions about structure:

1. At present I am creating each view (i.e. galleryView, CoverflowView, dataGridView) and each Model for each view in the Main (document class), and to each model I am passing an different XML file for that application from the document class. Is this the right way to do it? or is there a better way? Also, should eventListeners to the model, do inside the document class, or the views themselves?

2. Also, is it normal to create views inside other views? In other words, say I have a galleryView that is a Composite Object. Should I be creating and adding new views (i.e. scrollBarView, imageView) to the galleryView - inside the galleryView class, or is it better to create other views outside the galleryView class and then add() them to it as part of its composite structure (as below), for updating?

var galleryView:Composite = new galleryView(model, controller);
var scrollview:Composite = new ScrollView(model, controller)
galleryView.add(scrollView).


3. One other thing I am having trouble with is how to change between views. In other words if I have a navigation that changes between the galleryView and the DataGridView, would I have to remove all the (component) views inside the galleryView first, and then create the DataGridView, or is it better to simply hide the galleryView and un-hide the DataGridView, and vice versa?

Any help on this would be greatly appreciated, as I have been on it for days...

Tom.

[marlopax]

I need some help with how to structure a major application in MVC, basically I have several applications (a gallery app, a coverflow app and a dataGrid application) that I want to display inside an main application.

What OOPs tells that you have only one apps with multiple utilities and their own different views. All are integrated in one Application.

1. At present I am creating each view (i.e. galleryView, CoverflowView, dataGridView) and each Model for each view in the Main (document class), and to each model I am passing an different XML file for that application from the document class. Is this the right way to do it? or is there a better way? Also, should eventListeners to the model, do inside the document class, or the views themselves?

Yes the way is right.

2. Also, is it normal to create views inside other views? In other words, say I have a galleryView that is a Composite Object. Should I be creating and adding new views (i.e. scrollBarView, imageView) to the galleryView - inside the galleryView class, or is it better to create other views outside the galleryView class and then add() them to it as part of its composite structure (as below), for updating?

It is best practice to make all component independent. Interact with each other.

3. One other thing I am having trouble with is how to change between views. In other words if I have a navigation that changes between the galleryView and the DataGridView, would I have to remove all the (component) views inside the galleryView first, and then create the DataGridView, or is it better to simply hide the galleryView and un-hide the DataGridView, and vice versa?

If it is needed create it if not remove all. Recreate when it need again, if need to keep history create an array or a history or bookmark class to hold the history of whatever data you want to hold there.
This will manage the memory issue. Hiding is not a good practice. All are in fly.

Best Wishes


marlopax

[tom_w2000]

Hi Again Marloplax,

I thought it best if I post some of the code I've abstracted for clarity reasons:

Below is an example of my Main class and a galleryView class I am using. galleryView itself extends a composite view that includes an array for storing components (other views in this case).

As you can see I am creating other views that relate the the galleryView, inside the galleryView itself, and then adding these views as components of galleryView. When update is called on galleryView in response to a change in the model, it loops through these other components and updates them as well (composite pattern).

Is this the right way to go about it? (sorry for any bad comments)


MAIN CLASS:

public class Main extends MovieClip
{
public function Main ()
{
// APPLICATION 1: 3D GALLERY:

var galleryXml:String = galleryXml.xml”;
var galleryModel:IGalleryModel = new GalleryModel(galleryXml):
var galleryView:Composite = new galleryView (galleryModel, null);
//
galleryView.x = 0;
galleryView.y = 0;
addChild(galleryView);
galleryModel.addEventListener(“navChange”, galleryView.update());


// APPLICATION 2: COVERFLOW

var cFlowXml:String = galleryXml.xml”;
var cFlowModel:IGalleryModel = new GalleryModel(cFlowXml):
var cFlowView:Composite = new galleryView (cFlowModel, null);
//
cFlowView.x = 0;
cFlowView.y = 0;
addChild(cFlowView);
cFlowModel.addEventListener(“change”, cFlowView.update());

}
}
}


GALLERY VIEW CLASS:

package
{
import flash.display.MovieClip;

public class galleryView extends Composite
{
public function galleryView (model:Imodel, controller:IController = null)
{
super(model, controller);

var navController:IMouseInputHandler = new NavController(model);
var navView:Component = new Component (model, navController);
// add controller to current composite view
this.add(navView);
//

var imgController:IMouseInputHandler = new imgController(model);
var imgView:Component = new Component (model, navController);
// add image viewer to current composite view
this.add(imgView);

// ScrollView contains and updates listview.
var scrollView:Composite = new Composite("Scroll View");
// List view contains and updates SliderView based of number of items
var listController:IMouseInputHandler = new listController(model);
var ListView:Composite = new Composite(model, listController);
scrollView.add(ListView);
//
var sldrController:IMouseInputHandler = new sliderController(model);
var SliderView:Component = new Component(model,sldrController)
ListView.add(SliderView);
// add scrollView to current composite view
this.add(scrollView);

// update added views, so they can get the latest data from the model.
this.update( );
// add EventListener to model and change gallery view
model.addEventListener(“navChange”, this.update( ));
}
}
}

[marlopax]

This topic has extends on the thread linked bellow:

http://board.flashkit.com/board/showthread.php?t=824626



marlopax