Clever Geek Handbook

Flex - binding ViewStack selectedChild Property using string value

The attached sample code (pseudo code) compiles but throws this error at runtime:

TypeError: Error #2007: Parameter child must be non-null.
    at flash.display::DisplayObjectContainer/getChildIndex()
    at mx.core::Container/getChildIndex()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\core\Container.as:2409]
    at mx.containers::ViewStack/set selectedChild()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\containers\ViewStack.as:557]


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            [Bindable]
            private var targetViewName:String = "content";
        ]]>
    </mx:Script>

    <mx:ViewStack id="viewStack" width="100%" height="100%" 
        selectedChild="{Container(viewStack.getChildByName(targetViewName))}">
        <mx:Panel id="welcome" width="100%" height="100%" />

        <mx:Panel id="content" width="100%" height="100%" />
    </mx:ViewStack>
</mx:Application>

Is there a way to get this to work without calling a function to set selectedChild?

Thank.

+1


source to share


6 answers


when selectedChild is run, there are no children in viewStack, so it throws a NullPointerException:

The following will work:



<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            import mx.core.Container;
            [Bindable]
            private var targetViewName:String = "content";

            private function onClick() : void
            {
                viewStack.selectedChild = Container(viewStack.getChildByName(targetViewName)) ;
            }
        ]]>
    </mx:Script>

    <mx:ViewStack id="viewStack" width="100%" height="100%" >
        <mx:Panel id="welcome" width="100%" height="100%"  title="welcome"/>

        <mx:Panel id="content" width="100%" height="100%" title="content" />
    </mx:ViewStack>

    <mx:Button click="onClick()" label="click" />

</mx:Application>
+3


source


tried this:

selectedChild="{this[targetViewName]}">


/ Niels

0


source


Sorry / Niels, this doesn't work. Try to compile this code and you will see that selectedChild is unchanged (also you get a compile warning):

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            [Bindable]
            private var targetViewName:String = "content";
        ]]>
    </mx:Script>

    <mx:TabNavigator id="viewStack" width="100%" height="100%" creationPolicy="all" 
        selectedChild="{this[targetViewName]}">
        <mx:Panel id="welcome" width="100%" height="100%" label="welcome" />

        <mx:Panel id="content" width="100%" height="100%" label="content" />
    </mx:TabNavigator>
</mx:Application>
0


source


My guess is it won't work because the anchor will be evaluated on initialization when the view-style children have not yet been created at that time. Even when setting creationPolicy to "all", the problem still occurs.

You will need to set a binding to targetViewName when creating the view (and possibly its children as well).

0


source


You want to set the selectedChild property after the target is in the display list. Try the following:

<mx:TabNavigator id="viewStack" width="100%" height="100%" creationPolicy="all" >
    <mx:Panel id="welcome" width="100%" height="100%" label="welcome" />

    <mx:Panel id="content" width="100%" height="100%" label="content" addedToStage="viewStack.selectedChild = this" />
</mx:TabNavigator>

If you really want to bind selectedChild, then create a binding function that returns the panel you selected, but only if it is a child of the viewStack.

0


source 


<mx:Script>
    <![CDATA[
        import models.ModelLocator;

        [Bindable]
        private var model:ModelLocator = ModelLocator.getInstance();
    ]]>
</mx:Script>

<mx:ViewStack id="videoViewStack" width="100%" height="100%" selectedChild="{this[model._videoViewStack]}" >
    <viewsVideos:AllVideos id="AllVideos" label="Videos"/>
    <viewsVideos:MainVideo id="MainVideo" label="Video"/>
</mx:ViewStack>

this concatenates the var string, i get a warning but it works

0


source






More articles: