如何隐藏flex数据网格的内容?

时间:2012-11-16 03:43:29

标签: actionscript-3 flex4

注意:我正在使用FLEX 4。

嗨,我想知道是否有办法隐藏数据网格的数据而不隐藏数据网格本身?我希望屏幕打开,数据网格显示为空。我只希望一旦用户从组合框中选择了一个选项,就可以看到数据网格的内容。有没有办法做到这一点? (原因很复杂,解释起来不太愉快,但这是我必须要做的事情。)

谢谢!

1 个答案:

答案 0 :(得分:4)

您可以将数据网格的dataProvider设置为null,也可以将空集合设置为准备显示数据。

默认情况下,将null或空集合初始化为数据网格。然后,当选择了所需的组合框选项时,将数据网格数据提供程序设置为有效数据:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;

            import spark.events.IndexChangeEvent;

            [Bindable]
            public var data:ArrayList = new ArrayList([ "one", "two", "three" ]);

            protected function combobox1_changeHandler(event:IndexChangeEvent):void
            {
                switch (comboBox.selectedItem)
                {
                    case "Show data":
                        dataGrid.dataProvider = data;
                        break;
                    default:
                        dataGrid.dataProvider = null;
                        break;
                }
            }
        ]]>
    </fx:Script>

    <s:layout>
        <s:VerticalLayout />
    </s:layout>

    <s:DataGrid id="dataGrid"
                dataProvider="{null}" />

    <s:ComboBox id="comboBox"
                change="combobox1_changeHandler(event)">
        <s:dataProvider>
            <s:ArrayList>
                <fx:String>Show data</fx:String>
                <fx:String>Hide data</fx:String>
            </s:ArrayList>
        </s:dataProvider>
    </s:ComboBox>

</s:Application>

另一种方法是使用Flex状态系统。

您可以定义两个状态来控制数据网格中数据的可见性。然后,根据当前状态设置数据提供者:

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

    <s:states>
        <s:State name="showData" />
        <s:State name="hideData" />
    </s:states>

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;

            import spark.events.IndexChangeEvent;

            [Bindable]
            public var data:ArrayList = new ArrayList([ "one", "two", "three" ]);

            protected function combobox1_changeHandler(event:IndexChangeEvent):void
            {
                switch (comboBox.selectedItem)
                {
                    case "Show data":
                        currentState = "showData";
                        break;
                    default:
                        currentState = "hideData";
                        break;
                }
            }
        ]]>
    </fx:Script>

    <s:layout>
        <s:VerticalLayout />
    </s:layout>

    <s:DataGrid id="dataGrid"
                dataProvider.hideData="{null}"
                dataProvider.showData="{data}" />

    <s:ComboBox id="comboBox"
                change="combobox1_changeHandler(event)">
        <s:dataProvider>
            <s:ArrayList>
                <fx:String>Show data</fx:String>
                <fx:String>Hide data</fx:String>
            </s:ArrayList>
        </s:dataProvider>
    </s:ComboBox>

</s:Application>