flex中datagrid列滚动锁定

熟悉excel的人应该都知道表格中可以将比如标题行/列锁定，使其不滚动，从而便于浏览。flex的datagrid控件也可以实现这样的效果。接下来的例子演示了flex中如何锁定横向滚动datagrid控件的列。demo中name列被锁定

 

 

<?xml version="1.0" encoding="utf-8"?> 
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml" 
        layout="vertical" 
        verticalalign="middle" 
        backgroundcolor="white"> 
  
    <mx:datagrid id="datagrid" 
            lockedcolumncount="1" 
            horizontalscrollpolicy="on" 
            width="300"> 
        <mx:columns> 
            <mx:datagridcolumn datafield="@name" headertext="name:"/> 
            <mx:datagridcolumn datafield="@cola" headertext="column a:"/> 
            <mx:datagridcolumn datafield="@colb" headertext="column b:"/> 
            <mx:datagridcolumn datafield="@colc" headertext="column c:"/> 
        </mx:columns> 
        <mx:dataprovider> 
            <mx:xmllist> 
                <item name="user 1" cola="1.a" colb="1.b" colc="1.c"/> 
                <item name="user 2" cola="2.a" colb="2.b" colc="2.c"/> 
                <item name="user 3" cola="3.a" colb="3.b" colc="3.c"/> 
                <item name="user 4" cola="4.a" colb="4.b" colc="4.c"/> 
                <item name="user 5" cola="5.a" colb="5.b" colc="5.c"/> 
                <item name="user 6" cola="6.a" colb="6.b" colc="6.c"/> 
                <item name="user 7" cola="7.a" colb="7.b" colc="7.c"/> 
                <item name="user 8" cola="8.a" colb="8.b" colc="8.c"/> 
            </mx:xmllist> 
        </mx:dataprovider> 
    </mx:datagrid> 
  
</mx:application>

其中最重要的属性就是 lockedcolumncount ，控制锁定列的数