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"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:wg="com.webgriffe.components.*"
creationComplete="onInit()"
minWidth="955" minHeight="600">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.XMLListCollection;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
import mx.rpc.http.HTTPService;
[Bindable]
public var xmlResult:XML;
[Bindable]
public var xmlList:XMLList;
private var selectedNode:XML;
[Bindable]
public var xmlTeams:XMLListCollection;
public var xmlService:HTTPService = new HTTPService();
[Bindable]
private var today:Date = new Date(new Date().setHours(0,0,0,0));
[Bindable]
private var start:Date = today;
[Bindable]
private var end:Date = start;
private function onInit():void{
xmlService.url = "regtree.xml"
xmlService.resultFormat = "e4x";
xmlService.addEventListener(ResultEvent.RESULT, resultHandler);
xmlService.send();
}
public function resultHandler(event:ResultEvent):void
{
xmlResult = XML(event.result);
xmlList = xmlResult.league;
xmlTeams = new XMLListCollection(xmlList);
}
private function treeChange(e:Event):void{
Alert.show("选择");
selectedNode = TreeComboBox(e.target).selectedItem as XML;
}
private function onDateChangeHandler(event:Event):void
{
if(startDate.text == "")
{
startDate.selectedDate = start;
}
else
{
start = startDate.selectedDate;
}
if(endDate.text == "")
{
endDate.selectedDate = this.end;
}
else
{
this.end = endDate.selectedDate;
}
}
private function clear():void
{
txtSearch.text = "";
residentialNumber.text= "";
txtSearch.text= "";
residentialtType.text= "";
residentialtType.selectedItem=null;
cmbStyle.selectedItem=null;
cmbStyle.text= "";
startDate.text= "";
startDate.selectedDate=null;
endDate.selectedDate=null;
endDate.text= "";
treecombox.selectedItem=null;
treecombox.text= "";
}
]]>
</fx:Script>
<s:Group id="textInput"
width="100%" height="100%"
visible="true"
>
<s:layout>
<s:VerticalLayout gap="10" horizontalAlign="center"/>
</s:layout>
<s:RichEditableText id="txtLabelText"
width="100%"
editable="false"
text=""
textAlign="center"/>
<s:HGroup width="100%" horizontalAlign="center">
<s:Label text="小区编号" /><s:TextInput id="residentialNumber" width="130"/>
<s:Label text="小区名称" />
<s:TextInput id="txtSearch" width="130"/>
</s:HGroup>
<s:HGroup width="100%" horizontalAlign="center">
<s:Label text="小区类型" /><mx:ComboBox id="residentialtType" width="130" >
<fx:Object label="公共机构" value="公共机构"/>
<fx:Object label="住宅" value="住宅"/>
<fx:Object label="商业" value="商业"/>
<fx:Object label="商住两用" value="商住两用"/>
<fx:Object label="工业厂房" value="工业厂房"/>
<fx:Object label="公共设施" value="公共设施"/>
<fx:Object label="非独立" value="非独立"/>
<fx:Object label="其它" value="其它"/>
</mx:ComboBox>
<s:Label text="达标情况" /><mx:ComboBox id="cmbStyle" width="130" >
<fx:Object label="达标小区" value="1"/>
<fx:Object label="未达标小区" value="2"/>
<fx:Object label="城中村" value="3"/>
<fx:Object label="其它" value="4"/>
</mx:ComboBox></s:HGroup>
<s:HGroup width="100%" horizontalAlign="center">
<s:Label text="开始时间" />
<mx:DateField id="startDate" selectableRange="{{rangeEnd:end}}" change="onDateChangeHandler(event)" width="130" dayNames="[日,一,二,三,四,五,六]" monthNames="[一,二,三,四,五,六,七,八,九,十,十一,十二]" formatString="YYYY-MM-DD" showToday="true"/>
<s:Label text="结束时间" />
<!-- selectedDate="{new Date()} -->
<mx:DateField id="endDate" selectableRange="{{rangeStart:start,rangeEnd:today}}" change="onDateChangeHandler(event)" width="130" dayNames="[日,一,二,三,四,五,六]" monthNames="[一,二,三,四,五,六,七,八,九,十,十一,十二]" formatString="YYYY-MM-DD" showToday="true" />
</s:HGroup>
<s:HGroup width="50%" horizontalAlign="center">
<s:Label text="行政区划" />
<wg:TreeComboBox id="treecombox"
name="treecomboxname"
prompt="请选择..."
change="treeChange"
width="100%" treeHeight="250"
dataProvider="{xmlTeams}"
labelField="@label" />
</s:HGroup>
<s:HGroup width="100%" horizontalAlign="center">
<s:Button label="确定"/>
<s:Button click="clear()" label="清除"/>
</s:HGroup>
</s:Group>
</s:Application>
------combox tree渲染
package com.webgriffe.components
{
import mx.controls.Alert;
import mx.controls.ComboBox;
import mx.controls.Tree;
import mx.core.ClassFactory;
import mx.events.DropdownEvent;
import mx.events.ListEvent;
import mx.events.TreeEvent;
[Event(name="rendererItemClick", type="com.esri.viewer.AppEvent")]
public class TreeComboBox extends ComboBox
{
// -------------------------------------
//
// Properties
//
// -------------------------------------
// ----------------------------
// ddFactory
// ----------------------------
private var _ddFactory:ClassFactory;
private function get ddFactory():ClassFactory
{
if (_ddFactory == null)
{
_ddFactory = new ClassFactory();
_ddFactory.generator = TreeComboBoxRenderer;
_ddFactory.properties = {
id:"treerenderId",
width:this.width,
height:this._treeHeight,
outerDocument:this
};
}
return _ddFactory;
}
// ----------------------------
// treeHeight
// ----------------------------
private var _treeHeight:Number;
public function get treeHeight():Number
{
return _treeHeight;
}
public function set treeHeight(value:Number):void
{
this._treeHeight = value;
ddFactory.properties["height"] = this._treeHeight;
}
// ----------------------------
// treeSelectedItem
// ----------------------------
public var treeSelectedItem:Object;
// -------------------------------------
//
// Constructor
//
// -------------------------------------
public function TreeComboBox()
{
super();
this.dropdownFactory = ddFactory;
this.addEventListener(DropdownEvent.OPEN, onComboOpen);
}
private function treeOpenHandler(e:TreeEvent):void
{
Alert.show("提示");
}
// -------------------------------------
//
// Handlers
//
// -------------------------------------
private function onComboOpen(event:DropdownEvent):void
{
var tree:TreeComboBoxRenderer = dropdown as TreeComboBoxRenderer;
if (treeSelectedItem)
{
tree.expandParents(treeSelectedItem);
tree.selectNode(treeSelectedItem);
}
else
{
//tree.expandItem(dataProvider.getItemAt(0), true);
}
}
// -------------------------------------
//
// Overridden methods
//
// -------------------------------------
/**
* Ovverride to avoid root node label being displayed as combo text when
* closing the combo box.
*/
override protected function updateDisplayList(unscaledWidth:Number,
unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
if(dropdown && treeSelectedItem && treeSelectedItem[labelField] != null)
{
text = treeSelectedItem[labelField];
}
}
// -------------------------------------
//
// Other functions
//
// -------------------------------------
public function updateLabel(selectedItem:Object):void
{
if (selectedItem)
{
treeSelectedItem = selectedItem;
text = treeSelectedItem[labelField];
}
}
}
}
------combox tree渲染
package com.webgriffe.components
{
import flash.events.DataEvent;
import mx.collections.XMLListCollection;
import mx.controls.Alert;
import mx.controls.Tree;
import mx.events.ListEvent;
import mx.events.TreeEvent;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.rpc.remoting.Operation;
import mx.rpc.remoting.RemoteObject;
public class TreeComboBoxRenderer extends Tree
{
// -------------------------------------
//
// Properties
//
// -------------------------------------
[Bindable]
public var outerDocument:TreeComboBox;
// 渲染器点击事件处理标示
public const RENDERER_ITEM_CLICK : String = "rendererItemClick" ;
private var mobile:RemoteObject;
// -------------------------------------
//
// Constructor
//
// -------------------------------------
public function TreeComboBoxRenderer()
{
super();
this.addEventListener(ListEvent.CHANGE, onSelectionChanged);
//点击展开+ 事件。暂时不用
//this.addEventListener(TreeEvent.ITEM_OPEN, treeOpenHandler);
}
private function treeOpenHandler(event:TreeEvent):void
{
//if(outerDocument)
//outerDocument.dispatchEvent(new AppEvent(RENDERER_ITEM_CLICK,event)); // 派发事件 bubbles
//dispatchEvent(new Event(RENDERER_ITEM_CLICK, true)); // 派发事件 bubbles
}
// -------------------------------------
//
// Handlers
//
// -------------------------------------
private function onSelectionChanged(event:ListEvent):void
{
outerDocument.updateLabel(event.currentTarget.selectedItem);
}
// -------------------------------------
//
// Other methods
//
// -------------------------------------
public function expandParents(node:Object):void
{
if (node && !isItemOpen(node))
{
expandItem(node, true);
expandParents(node.parent());
}
}
public function selectNode(node:Object):void
{
selectedItem = node;
var idx:int = getItemIndex(selectedItem);
scrollToIndex(idx);
}
}
}
