下面介绍下flex中s标签和mx标签中的datagrid显示多余行的问题,我给大家写了个对比:如下
MX标签代码:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
?<mx:Model id="model">
??<datas>
???<book>
????<name1>实验</name1>
????<name2>1,800</name2>
????<name3>28</name3>
????<name4>2</name4>
????<name5>26</name5>
????<name6>0</name6>
????<name7>45123456789011</name7>
???</book>
???<book>
????<name1>实验</name1>
????<name2>1,800</name2>
????<name3>28</name3>
????<name4>2</name4>
????<name5>26</name5>
????<name6>0</name6>
????<name7>45123456789011</name7>
???</book>
??</datas>
?</mx:Model>
?<mx:Script>
??<![CDATA[??]]>
?</mx:Script>?
?<mx:DataGrid x="10" y="125"? dataProvider="{model.book}" id="mydg" baseline="none" rowCount="5">??
?//注释:代码关键在这个属性rowCount="5",这个在datagrid控制显示行数,是mx控制的属性
??<mx:columns>
???<mx:DataGridColumn headerText="Column 1" dataField="name1" id="name1" width="100" textAlign="left" headerStyleName=""/>
???<mx:DataGridColumn headerText="Column 2" dataField="name2" id="name2" width="100" textAlign="right"/>
???<mx:DataGridColumn headerText="Column 3" dataField="name3" id="name3" width="100" textAlign="center"/>
??</mx:columns>
?</mx:DataGrid>
</mx:Application>
?
S标签代码:
<?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" minWidth="955" minHeight="600">
?<fx:Declarations>
??<!-- 将非可视元素(例如服务、值对象)放在此处 -->
?</fx:Declarations>
??<fx:Script>
??<![CDATA[
???import mx.collections.ArrayCollection;
???//绑定表格用的数据?
???[Bindable]
???private var arr:ArrayCollection = new ArrayCollection([
????{neName:"教工路文一路路口相机_4",neType:"相机",neAlarmType:"设备告警",removeStatus:"未清除",confirmStatus:"未确认",neAlarmGrade:"2级"},
????{neName:"学院路文一路路口相机_3",neAlarmType:"环境告警",neAlarmGrade:"3级"},
????{neName:"文一路莫干山路路口相机_1",neAlarmType:"连接通信告警",neAlarmGrade:"1级"},
????{neName:"文一路莫干山路路口相机_3",? neAlarmType:"性能告警",neAlarmGrade:"4级"}
???]);?
???
???//删除告警信息
???public function deleteAlarmRecord():void{
????arr.removeItemAt(alarmGrid.selectedIndex);
???}
???//确认告警信息
???public function confirmAlarmInfo():void{
????arr.getItemAt(alarmGrid.selectedIndex).confirmStatus = "已确认";
????alarmGrid.dataProvider = arr;
???}
??]]>
?</fx:Script>
?<s:DataGrid id="alarmGrid" width="600" height="285" requestedRowCount="4" dataProvider="{arr}" skinClass="view.datagrid">
//注释:代码关键在这个属性rowCount="5",这个在datagrid控制显示行数,这个是S标签的属性
? ?<s:columns>
???<s:ArrayList>
????<s:GridColumn dataField="neName" headerText="名称"></s:GridColumn>
????<s:GridColumn dataField="neType" headerText="类型"></s:GridColumn>
????<s:GridColumn dataField="removeStatus" headerText="清除状态"></s:GridColumn>
????<s:GridColumn dataField="confirmStatus" headerText="确认状态"></s:GridColumn>
????<s:GridColumn headerText="操作">
?????<s:itemRenderer>
??????<fx:Component>
???????<s:GridItemRenderer>
????????<s:HGroup>
?????????<mx:LinkButton toolTip="清除" label="清除" click="outerDocument.deleteAlarmRecord();" textDecoration="underline" color="#2066CF" fontWeight="normal"/>
?????????<mx:LinkButton toolTip="确认" label="确认" click="outerDocument.confirmAlarmInfo()" textDecoration="underline" color="#2066CF" fontWeight="normal"/>
????????</s:HGroup>
???????</s:GridItemRenderer>
??????</fx:Component>
?????</s:itemRenderer>
????</s:GridColumn>
???</s:ArrayList>
??</s:columns>
?</s:DataGrid>
</s:Application>
皮肤学习简单:网址:http://wenku.baidu.com/view/dfafe5ef551810a6f52486a2.html###