6.10.在DataGrid中搜索并自动滚屏到匹配项
6.10.1. 问题
我想搜索DataGrid 中的数据项并滚屏到匹配项
6.10.2. 解决办法
在ArrayCollection 中使用IViewCursor 的findFirst 方法。使用DataGrid 的scrollToIndex 进行滚屏。
6.10.3. 讨论
这项技术的关键之处在于DataGrid 和一个简单的表达，提供用户在文本框中输入city 名称，然后点击按钮开始搜索。当用户点击按钮(search_btn)后，DataGrid 的dataProvider 被搜索，相应的行被选择，如果所在行没显示的话滚屏到所在视图。
该解决方案的两个主要方面是查找匹配项和定位DataGrid 的相应项。查找匹配项，可使用IViewCursor，它是一个接口，规定一些属性和方法用于遍历集合。所有的Flex 集合对象都支持createCursor 方法返回一个IViewCursor 类实例。这个例子中，下面的几行代码创建一个ArrayCollection 游标实例，作为DataGrid 的dataProvider：
注意你可以赋值Sort 对象给定义了ArrayCollection，dataProvider 数据项city 属性作为可排序字段。这是因为IViewCursor 的findFirst 和其他查找方法只可以被可排序视图所调用。
当游标被创建后，它可以导航和查询相关联的视图，当用户点击Search City 按钮时下面的searchCity 方法便被调用：
这个方法中，用户输入的city 名称作为IViewCursor 的findFirst 方法的搜索参数。当找到ArrayCollection 中的匹配项时该方法返回true 并更新游标对象的current 属性，指向匹配项。
当匹配项被找到后，ArrayCollection 的getItemIndex 方法指出匹配项的具体位置，最后DataGrid 使用scrollToIndex 方法滚屏到匹配位置，selectedItem 属性被设置为匹配项。
完整的代码如下：
我想搜索DataGrid 中的数据项并滚屏到匹配项
6.10.2. 解决办法
在ArrayCollection 中使用IViewCursor 的findFirst 方法。使用DataGrid 的scrollToIndex 进行滚屏。
6.10.3. 讨论
这项技术的关键之处在于DataGrid 和一个简单的表达，提供用户在文本框中输入city 名称，然后点击按钮开始搜索。当用户点击按钮(search_btn)后，DataGrid 的dataProvider 被搜索，相应的行被选择，如果所在行没显示的话滚屏到所在视图。
该解决方案的两个主要方面是查找匹配项和定位DataGrid 的相应项。查找匹配项，可使用IViewCursor，它是一个接口，规定一些属性和方法用于遍历集合。所有的Flex 集合对象都支持createCursor 方法返回一个IViewCursor 类实例。这个例子中，下面的几行代码创建一个ArrayCollection 游标实例，作为DataGrid 的dataProvider：
+展开
-ActionScript
private function onResult(evt:ResultEvent):void {
var sort:Sort = new Sort();
sort.fields = [ new SortField("city",true) ];
this.homesForSale = evt.result.data.region;
this.homesForSale.sort = sort;
this.homesForSale.refresh();
this.cursor = this.homesForSale.createCursor();
}
var sort:Sort = new Sort();
sort.fields = [ new SortField("city",true) ];
this.homesForSale = evt.result.data.region;
this.homesForSale.sort = sort;
this.homesForSale.refresh();
this.cursor = this.homesForSale.createCursor();
}
注意你可以赋值Sort 对象给定义了ArrayCollection，dataProvider 数据项city 属性作为可排序字段。这是因为IViewCursor 的findFirst 和其他查找方法只可以被可排序视图所调用。
当游标被创建后，它可以导航和查询相关联的视图，当用户点击Search City 按钮时下面的searchCity 方法便被调用：
+展开
-ActionScript
private function searchCity():void {
if(search_ti.text != "") {
if(this.cursor.findFirst({city:search_ti.text})){
var idx:int =
this.homesForSale.getItemIndex(this.cursor.current);
this.grid.scrollToIndex(idx);
this.grid.selectedItem = this.cursor.current;
}
}
}
if(search_ti.text != "") {
if(this.cursor.findFirst({city:search_ti.text})){
var idx:int =
this.homesForSale.getItemIndex(this.cursor.current);
this.grid.scrollToIndex(idx);
this.grid.selectedItem = this.cursor.current;
}
}
}
这个方法中，用户输入的city 名称作为IViewCursor 的findFirst 方法的搜索参数。当找到ArrayCollection 中的匹配项时该方法返回true 并更新游标对象的current 属性，指向匹配项。
当匹配项被找到后，ArrayCollection 的getItemIndex 方法指出匹配项的具体位置，最后DataGrid 使用scrollToIndex 方法滚屏到匹配位置，selectedItem 属性被设置为匹配项。
完整的代码如下：
+展开
-XML
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" creationComplete="initApp()">
<mx:HTTPService id="srv" url="assets/homesforsale.xml"
resultFormat="object" result="onResult(event)"/>
<mx:Form>
<mx:FormItem label="Search">
<mx:TextInput id="search_ti"/>
</mx:FormItem>
<mx:FormItem>
<mx:Button label="Search City" click="searchCity()"/>
</mx:FormItem>
</mx:Form>
<mx:DataGrid id="grid" width="300" height="150"
editable="true" dataProvider="{homesForSale}">
<mx:columns>
<mx:DataGridColumn headerText="Total No."
dataField="total"/>
<mx:DataGridColumn headerText="City"="false"
dataField="city"/>
<mx:DataGridColumn headerText="State"
dataField="state"/>
</mx:columns>
</mx:DataGrid>
<mx:Script>
<![CDATA[
import mx.collections.SortField;
import mx.collections.Sort;
import mx.collections.IViewCursor;
import mx.events.FlexEvent;
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
[Bindable]
private var homesForSale:ArrayCollection;
private var cursor:IViewCursor;
private function initApp():void {
this.srv.send();
}
private function onResult(evt:ResultEvent):void {
var sort:Sort = new Sort();
sort.fields = [ new SortField("city",true) ];
this.homesForSale = evt.result.data.region;
this.homesForSale.sort = sort;
this.homesForSale.refresh();
this.cursor = this.homesForSale.createCursor();
}
private function searchCity():void {
if(search_ti.text != "") {
if(this.cursor.findFirst({city:search_ti.text})){
var idx:int =
this.homesForSale.getItemIndex(this.cursor.current);
this.grid.scrollToIndex(idx);
this.grid.selectedItem = this.cursor.current;
}
}
}
]]>
</mx:Script>
</mx:Application>
layout="vertical" creationComplete="initApp()">
<mx:HTTPService id="srv" url="assets/homesforsale.xml"
resultFormat="object" result="onResult(event)"/>
<mx:Form>
<mx:FormItem label="Search">
<mx:TextInput id="search_ti"/>
</mx:FormItem>
<mx:FormItem>
<mx:Button label="Search City" click="searchCity()"/>
</mx:FormItem>
</mx:Form>
<mx:DataGrid id="grid" width="300" height="150"
editable="true" dataProvider="{homesForSale}">
<mx:columns>
<mx:DataGridColumn headerText="Total No."
dataField="total"/>
<mx:DataGridColumn headerText="City"="false"
dataField="city"/>
<mx:DataGridColumn headerText="State"
dataField="state"/>
</mx:columns>
</mx:DataGrid>
<mx:Script>
<![CDATA[
import mx.collections.SortField;
import mx.collections.Sort;
import mx.collections.IViewCursor;
import mx.events.FlexEvent;
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
[Bindable]
private var homesForSale:ArrayCollection;
private var cursor:IViewCursor;
private function initApp():void {
this.srv.send();
}
private function onResult(evt:ResultEvent):void {
var sort:Sort = new Sort();
sort.fields = [ new SortField("city",true) ];
this.homesForSale = evt.result.data.region;
this.homesForSale.sort = sort;
this.homesForSale.refresh();
this.cursor = this.homesForSale.createCursor();
}
private function searchCity():void {
if(search_ti.text != "") {
if(this.cursor.findFirst({city:search_ti.text})){
var idx:int =
this.homesForSale.getItemIndex(this.cursor.current);
this.grid.scrollToIndex(idx);
this.grid.selectedItem = this.cursor.current;
}
}
}
]]>
</mx:Script>
</mx:Application>
加支付宝好友偷能量挖...
