actionscript-3 - 如何隐藏弹性数据网格的内容？

Question

注意：我使用的是 FLEX 4。

嗨，我想知道是否有一种方法可以隐藏数据网格的数据而不隐藏数据网格本身？我希望屏幕打开时数据网格显示为空。一旦用户从组合框中选择了一个选项，我只希望数据网格的内容可见。有没有办法做到这一点？（其中的原因有点复杂，解释起来并不愉快，但这是我必须做的事情。）

谢谢！

Answer 1

您可以将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>