Flex中如何通过sortArrowSkin样式改变DataGrid排序图标的例子

By Minidxer | April 15, 2009

接下来的例子演示了Flex中如何通过sortArrowSkin样式,改变DataGrid排序图标。

让我们先来看一下Demo可以右键View Source或点击这里察看源代码):


下面是完整代码(或点击这里察看):

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Array id="arr">
  8.         <mx:Object c1="Item 1A" c2="Item 1B" />
  9.         <mx:Object c1="Item 2A" c2="Item 2B" />
  10.         <mx:Object c1="Item 3A" c2="Item 3B" />
  11.         <mx:Object c1="Item 4A" c2="Item 4B" />
  12.         <mx:Object c1="Item 5A" c2="Item 5B" />
  13.         <mx:Object c1="Item 6A" c2="Item 6B" />
  14.         <mx:Object c1="Item 7A" c2="Item 7B" />
  15.         <mx:Object c1="Item 8A" c2="Item 8B" />
  16.         <mx:Object c1="Item 9A" c2="Item 9B" />
  17.     </mx:Array>
  18.  
  19.     <mx:DataGrid id="dataGrid"
  20.             dataProvider="{arr}"
  21.             sortArrowSkin="@Embed('assets/thumb_down.png')"
  22.             width="300"
  23.             rowCount="8">
  24.         <mx:columns>
  25.             <mx:DataGridColumn dataField="c1"
  26.                     headerText="Column 1:" />
  27.             <mx:DataGridColumn dataField="c2"
  28.                     headerText="Column 2:" />
  29.         </mx:columns>
  30.     </mx:DataGrid>
  31.  
  32. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: DataGrid | No Comments » | 1,357 views Tags: ,

Search Posts