• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    Flex中怎么给表格中的滚动条定位避免刷新回到原处

    1、问题背景

    如果表格中的字段过多,会出现滚动条,在将滚动条滚到一定的位置时,重新刷新表格,滚动条会回到原处,原来查看的字段还得继续滚动,才能查看到。

    2、实现实例

    ?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" 
    creationComplete="initHandler(event)" 
    width="100%" height="100%"> 
    s:layout> 
    s:BasicLayout/> 
    /s:layout> 
    fx:Script> 
    ![CDATA[ 
    import mx.collections.ArrayCollection; 
    import mx.controls.Alert; 
    import mx.events.FlexEvent; 
    
    [Bindable] 
    //表格数据绑定 
    private var gridArray:ArrayCollection = new ArrayCollection([ 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"}, 
    {Jan:"5678",Feb:"7890",Mar:"3454",Apr:"4565",May:"6756",Jun:"5656",Jul:"7867",Aug:"8990",Sep:"5676",Oct:"4655",Nov:"6778",Dec:"8909", 
    Jan1:"3344",Feb1:"5676",Mar1:"7898",Apr1:"9089",May1:"9009",Jun1:"5675",Jul1:"3433",Aug1:"4455",Sep1:"6676",Oct1:"7867",Nov1:"4556",Dec1:"8656"} 
    ]); 
    
    /** 
    * 初始化函数 
    */ 
    protected function initHandler(event:FlexEvent):void 
    { 
    
    } 
    
    /** 
    * 刷新按钮函数 
    */ 
    protected function refresh_clickHandler(event:MouseEvent):void 
    { 
    var hx:Object = hsb.left; 
    var hy:Number = hsb.y; 
    
    //var dx:Number = dataGrid.contentMouseX; 
    //var dy:Number = dataGrid.contentMouseY; 
    //Alert.show("hx:"+hx+"\n"+"hy: "+hy + "\n" + "dx: " + dx + "\n" + "dy: " + dy); 
    Alert.show("hx:"+hx+"\n"+"hy: "+hy); 
    } 
    
    ]]> 
    /fx:Script> 
    fx:Declarations> 
    !-- 将非可视元素(例如服务、值对象)放在此处 --> 
    /fx:Declarations> 
    
    mx:VBox width="100%" height="100%" paddingBottom="10" paddingLeft="10" paddingRight="20" 
    paddingTop="10" horizontalAlign="center"> 
    mx:HBox width="100%" height="30"> 
    s:Label width="100%"/> 
    s:Button id="refresh" label="刷新" click="refresh_clickHandler(event)"/> 
    /mx:HBox> 
    mx:DataGrid width="1350" height="90%" id="dataGrid" dataProvider="{gridArray}" horizontalScrollPolicy="on" textAlign="center"> 
    mx:columns> 
    mx:DataGridColumn headerText="2013年01月" dataField="Jan" width="200"/> 
    mx:DataGridColumn headerText="2013年02月" dataField="Feb" width="200"/> 
    mx:DataGridColumn headerText="2013年03月" dataField="Mar" width="200"/> 
    mx:DataGridColumn headerText="2013年04月" dataField="Apr" width="200"/> 
    mx:DataGridColumn headerText="2013年05月" dataField="May" width="200"/> 
    mx:DataGridColumn headerText="2013年06月" dataField="Jun" width="200"/> 
    mx:DataGridColumn headerText="2013年07月" dataField="Jul" width="200"/> 
    mx:DataGridColumn headerText="2013年08月" dataField="Aug" width="200"/> 
    mx:DataGridColumn headerText="2013年09月" dataField="Sep" width="200"/> 
    mx:DataGridColumn headerText="2013年10月" dataField="Oct" width="200"/> 
    mx:DataGridColumn headerText="2013年11月" dataField="Nov" width="200"/> 
    mx:DataGridColumn headerText="2013年12月" dataField="Dec" width="200"/> 
    mx:DataGridColumn headerText="2014年01月" dataField="Jan1" width="200"/> 
    mx:DataGridColumn headerText="2014年02月" dataField="Feb1" width="200"/> 
    mx:DataGridColumn headerText="2014年03月" dataField="Mar1" width="200"/> 
    mx:DataGridColumn headerText="2014年04月" dataField="Apr1" width="200"/> 
    mx:DataGridColumn headerText="2014年05月" dataField="May1" width="200"/> 
    mx:DataGridColumn headerText="2014年06月" dataField="Jun1" width="200"/> 
    mx:DataGridColumn headerText="2014年07月" dataField="Jul1" width="200"/> 
    mx:DataGridColumn headerText="2014年08月" dataField="Aug1" width="200"/> 
    mx:DataGridColumn headerText="2014年09月" dataField="Sep1" width="200"/> 
    mx:DataGridColumn headerText="2014年10月" dataField="Oct1" width="200"/> 
    mx:DataGridColumn headerText="2014年11月" dataField="Nov1" width="200"/> 
    mx:DataGridColumn headerText="2014年12月" dataField="Dec1" width="200"/> 
    /mx:columns> 
    /mx:DataGrid> 
    !-- 
    s:HScrollBar id="hsb" width="100%" viewport="{dataGrid}"/> 
    --> 
    
    s:HScrollBar id="hsb" width="100%"/> 
    
    /mx:VBox> 
    /s:Application>

    3、实现结果

    上一篇:Flex 输出文件到本地的两种方法
    下一篇:Flex中对表格中某列的值进行数字格式化保留两位小数
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    Flex中怎么给表格中的滚动条定位避免刷新回到原处 Flex,中,怎么,给,表格,中的,