flex4控件联动显示与隐藏效果

    在flex的开发过程中，有一种类似这样的效果，比如，我想选择不同的日期查询效果（按年，月，日，范围），然后联动不同的控件查询条件。在这种情况下，使用如下代码，即可做到显示与隐藏：
隐藏：

 includeInLayout="false" visible="false"

显示：

 includeInLayout="true" visible="true"

例子，如下所示：

1.选择控件以及它的处理函数:

      <s:HGroup>  <mx:Label text="按时间:" height="29"/>  <s:DropDownList id="selectType"  horizontalCenter="31"  top="20" selectedIndex="1" change="day_change(event);" width="126">  <s:dataProvider>  <s:ArrayList source="[全部,按日,按月,按年,按时间范围]" />  </s:dataProvider>  </s:DropDownList>  </s:HGroup>

2.被选择和处理的控件列表：

         <!--按日--> <mx:Label id="selectTime" text="选择时间"/> <mx:DateField id="select_date" formatString="YYYY-MM-DD" selectedDate="{new Date()}" enabled="true" visible="true" /> <mx:Button id="manualSetBtn" label="手动计算当天节能率" click="manualSetBtn_clickHandler(event)"  height="24" width="132"/> <mx:Label id="toSelect" text="至"  visible="false" includeInLayout="false"/>         <mx:DateField id="selectTo_date" formatString="YYYY-MM-DD" selectedDate="{new Date()}"  visible="false"              includeInLayout="false"/>                 <!--按月--> <s:NumericStepper id="select_year"  minimum="2012" maximum="2112" horizontalCenter="60"  verticalCenter="0" visible="false" includeInLayout="false" width="62" change="numberValueChange(event)"/>        <mx:Label text="年" id="select_yearLabel" visible="false" includeInLayout="false"/>        <s:NumericStepper id="select_month"  minimum="1" maximum="12" horizontalCenter="86"  verticalCenter="0" visible="false" includeInLayout="false" width="53" change="numberValueChange(event)"/>        <mx:Label text="月" id="select_monthLabel" visible="false" includeInLayout="false"/>        </s:HGroup><s:Button label="查询"  click="button2_clickHandler(event)"/>        <mx:Button textAlign="center" label="导出"   click="button3_clickHandler(event)"/>

相应的处理函数

/** * 执行时间的改变相应事件 */private function day_change(evt:Event):void {var rb:DropDownList = evt.currentTarget as DropDownList;//根据选择的不同呈现的控件也不同if(rb.selectedIndex == 0){selectTime.visible = false;select_date.visible = false;select_date.includeInLayout = false;manualSetBtn.visible = false;manualSetBtn.includeInLayout = false;select_year.visible = false;select_year.includeInLayout = false;select_yearLabel.visible = false;select_yearLabel.includeInLayout = false;select_month.visible = false;select_month.includeInLayout = false;select_monthLabel.visible = false;select_monthLabel.includeInLayout = false;selectTo_date.visible = false;selectTo_date.includeInLayout = false;toSelect.visible = false;toSelect.includeInLayout = false;}if(rb.selectedIndex==1){selectTime.visible = true;select_date.visible = true;select_date.includeInLayout = true;manualSetBtn.visible = true;manualSetBtn.includeInLayout = true;select_year.visible = false;select_year.includeInLayout = false;select_yearLabel.visible = false;select_yearLabel.includeInLayout = false;select_month.visible = false;select_month.includeInLayout = false;select_monthLabel.visible = false;select_monthLabel.includeInLayout = false;selectTo_date.visible = false;selectTo_date.includeInLayout = false;toSelect.visible = false;toSelect.includeInLayout = false;}else if(rb.selectedIndex==2){selectTime.visible = true;select_date.visible = false;select_date.includeInLayout = false;manualSetBtn.visible = false;manualSetBtn.includeInLayout = false;select_year.visible = true;select_year.includeInLayout = true;select_yearLabel.visible = true;select_yearLabel.includeInLayout = true;select_month.visible = true;select_month.includeInLayout = true;select_monthLabel.visible = true;select_monthLabel.includeInLayout = true;selectTo_date.visible = false;selectTo_date.includeInLayout = false;toSelect.visible = false;toSelect.includeInLayout = false;}else if(rb.selectedIndex==3){selectTime.visible = true;select_date.visible = false;select_date.includeInLayout = false;manualSetBtn.visible = false;manualSetBtn.includeInLayout = false;select_year.visible = true;select_year.includeInLayout = true;select_yearLabel.visible = true;select_yearLabel.includeInLayout = true;select_month.visible = false;select_month.includeInLayout = false;select_monthLabel.visible = false;select_monthLabel.includeInLayout = false;selectTo_date.visible = false;selectTo_date.includeInLayout = false;toSelect.visible = false;toSelect.includeInLayout = false;}else if(rb.selectedIndex==4){selectTime.visible = true;select_date.visible = true;select_date.includeInLayout = true;manualSetBtn.visible = false;manualSetBtn.includeInLayout = false;select_year.visible = false;select_year.includeInLayout = false;select_yearLabel.visible = false;select_yearLabel.includeInLayout = false;select_month.visible = false;select_month.includeInLayout = false;select_monthLabel.visible = false;select_monthLabel.includeInLayout = false;selectTo_date.visible = true;selectTo_date.includeInLayout = true;toSelect.visible = true;toSelect.includeInLayout = true;}}

这样就可以实现不同的查询条件，联动不同控件的显示与隐藏效果。
（完，待续..........................)