Show a custom component on button click in a view stack`

Question

Hello folks
I have a view stack in which i have some custom components.
Now there is one custom component in which there is one button. On the button click, i want to show another custom component but i dont know how to do it. Should i write the inline mxml click event in custom component?? If yes then how??
Currently i am doing it as
click="{customcomponent}"

Answer 1

As you know, ViewStack  has containers, lilke VBox for its views.
Assuming one of your views VBox has an id of myVBox, and that VBox has the Button that when clicked will display the component, just have the component in the view already, but you can make it invisible with visible=false and includeInLayout=false, and then upon button click set those two variables to true.
You will probably want a show handler for the view VBox to make those properties false each time that view is displayed.
Here is some simple sample code.
If this post answers your question or helps, please mark it as such.
---------- MySimpleComponent.mxml ----------
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
  width="100%" height="100%" horizontalAlign="center">
  <mx:Label text="My Custom Component"/>
</mx:VBox>
---------- MainApp.mxml  ----------
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  xmlns:comp="*" horizontalAlign="center" verticalAlign="middle">
  <mx:Script>
    <![CDATA[
    ]]>
  </mx:Script>
  <mx:LinkBar dataProvider="{vs}"/>
  <mx:ViewStack id="vs" width="100%" height="100%">
    <mx:VBox label="view1" width="100%" height="100%"
      horizontalAlign="center">
      <mx:Label text="View One"/>
    </mx:VBox>
    <mx:VBox label="view2"  width="100%" height="100%"
      show="myComp.visible=false;myComp.includeInLayout=true;"
      horizontalAlign="center">
      <mx:Label text="View Two"/>
      <mx:Button label="Make myComp Visible" click="myComp.visible=true;myComp.includeInLayout=true;"/>
      <comp:MySimpleComponent id="myComp" visible="false" includeInLayout="false"/>
    </mx:VBox>
  </mx:ViewStack>
</mx:Application>