Hide container of a viewstack container

I have a viewstack container w/ 3 views: red, black, and blue. How can I completely hide the black & not include it?

<?xml version="1.0" encoding="utf-8"?>
<s:Application  xmlns:fx="http://ns.adobe.com/mxml/2009"    
            xmlns:mx="library://ns.adobe.com/flex/mx"     
            xmlns:s="library://ns.adobe.com/flex/spark"
            horizontalCenter="0" verticalCenter="0"
            >

<mx:LinkBar dataProvider="{myVS}" borderVisible="false" color="blue" disabledColor="black"  />

<mx:ViewStack id="myVS" borderVisible="false" width="100%" height="100%"  >

    <mx:VBox id="red" label="click red" horizontalAl开发者_运维问答ign="center" verticalAlign="middle" >
        <s:Label id="r1" color="red" fontSize="25" text="This is the red label" />
    </mx:VBox>

    <mx:VBox id="black" label="click black" horizontalAlign="center" verticalAlign="middle" >
        <s:Label id="r2" color="black" fontSize="25" text="This is the black label" />
    </mx:VBox>

    <mx:VBox id="blue" label="click blue" horizontalAlign="center" verticalAlign="middle" >
        <s:Label id="r3" color="blue" fontSize="25" text="This is the blue label" />
    </mx:VBox>

</mx:ViewStack>

</s:Application>

I fear I may be missing the intent of your question. A ViewStack component is used to show multiple views "stacked" on top of each other, with only view being displayed at once. It includes no built in navigation like a TabNavigator might. If you want "completely hide" the black view, just comment it out before compiling the code and therefore it will never be shown.

I see in your code sample that you're using a link bar with the ViewStack as a dataProvider, so maybe you meant to ask how to keep the black view out o the linkBar. Just perform some ActionScript magic to create a custom dataProvider:

var dataProvider : ArrayCollection = new ArrayCollection([
{label:"click Red"},
{label:"click blue"}
]);

And specify that dataPRovider as the dataProvider source for your linkBar:

<mx:LinkBar dataProvider="{dataProvider}" borderVisible="false" color="blue" disabledColor="black"  />

I think the quick and dirtiest way is to just remove it:

myVS.removeElement(black);

But, I think I would use view states instead. This lets you get it back later without figuring out how/where to put it back. Define your states:

<s:states>
    <s:State name="all" />
    <s:State name="notBlack" />
</s:states>

And in your "black" VBox, exclude it from the "notBlack" state:

<mx:VBox id="black" excludeFrom="notBlack" ... />

Then, when you want to remove it, you can do so by setting currentState

<s:Button click="currentState='notBlack'" label="remove black" />