views:

2572

answers:

4

I have a page made of custom components. In that page I have a button. If I click the button I have to call another page (page.mxml consisting of custom components). Then click event handler is written in Action-script, in a separate file.

How to make a object of an MXML class, in ActionScript? How to display the object (i.e. the page)?

My code:

page1.mxml

<comp:BackgroundButton x="947" y="12" width="61" height="22" 
      paddingLeft="2" paddingRight="2" label="logout" id="logout"
      click="controllers.AdminSession.logout()"
 />

This page1.mxml has to call page2.mxml using ActionScript code in another class:

static public function logout():void {
   var startPage:StartSplashPage = new StartSplashPage();
}
A: 

I think you may use state to do you work.

You may take a look at http://blog.flexexamples.com/2007/10/05/creating-view-states-in-a-flex-application/#more-221

Edit: I am not sure I fully understand your case.

As I know, you may make a new state in page1.mxml, and name it, eg. secondPageState, and then put the custom component page2.mxml in the secondPageState.

In the controller, you need an import statement to import the page1 component and make a public var for the page1 component, eg. firstPage.

Then, the code will similar to: public function logout():voild { firstPage.currentState = "secondPageState"; }

Another solution: If you don't like the change state solution, you may try to use the addchild, to add the custom component to your application.

michael
I have a controller class in ActionScript that must be calling the StartSplashPage.mxml.The code needs to be implemented in ActionScript , in orderto implement the MVC pattern.
Thank you
But you can still use the ActionScript to change the current state. Since the StartSplashPage.mxml is just another view, it will not break the MVC pattern.
michael
sorry i can get you can you plz explain, with code like how to add tostatic public function logout():void { var startPage:StartSplashPage = new StartSplashPage(); }
In addition, StartSplashPage.mxml should be a custom component, not a function, I think you cannot use new StartSplashPage().
michael
michael, you are incorrect. An MXML component is simply an Actionscript class created declaratively with MXML markup. They can be instantiated like any other class with the new MyComponent() syntax.
Joel Hooks
+2  A: 

Your Actionscript class needs a reference to the display list in order to add your component to the stage. MXML is simply declarative actionscript, so there is no difference between creating your instance in Actionscript or using the MXML notation.

your function:

static public function logout():void {
   var startPage:StartSplashPage = new StartSplashPage();
}

could be changed to:

static public function logout():StartSplashPage {
   return new StartSplashPage();
}

or:

static public function logout():void {
   var startPage:StartSplashPage = new StartSplashPage();
   myReferenceToDisplayListObject.addChild( startPage );
}

If your actionscript does not have a reference to the display list, than you cannot add the custom component to the display list. Adding an MXML based custom component is no different than adding ANY other DisplayObject to the display list:

var mySprite:Sprite = new Sprite();
addChild(mySprite)

is the same as:

var startPage:StartSplashPage = new StartSplashPage();
myReferenceToDisplayListObject.addChild( startPage );

Both the Sprite and the StartSplashPage are extensions of DisplayObject at their core.

You reference MVC in the comments to another answer. Without knowing the specific framework you've implemented, or providing us with more code in terms of the context you are trying to perform this action in, it is difficult to give a more specific answer.

Joel Hooks
+1 for MXML-is-a-class
Richard Szalay
A: 

I assume that you are on a page with a set of components and want to replace this set of components on the page with a different set of components. My apologies in advance if this is not what you are trying to do.

You can do this using ViewStacks and switching the selected index on selection -- this can be done either by databinding or by firing an event in controllers.AdminSession.logout() and listening for that event in the Main Page and switching the selectedIndex of the view stack in the handler function.

MainPage.mxml

<mx:ViewStack>
<views:Page1...>
 ...
 <comp:BackgroundButton x="947" y="12" width="61" height="22" 
       paddingLeft="2" paddingRight="2" label="logout" id="logout"
           click="controllers.AdminSession.logout()"/>
</views:Page1...>
<views:Page2 ...>
 ...
 <comp:Comp1 .../>
 <comp:Comp2 .../>
</views:Page2>

A: 

I have a blog post that talks about something similar to what you want to do. It might help you.

http://blog.152.org/2009/08/using-mxml-files-as-classes.html

metric152