滚动时,itemRenderer在MX数据网格的行中发生了变化

时间:2016-09-12 23:36:28

标签: actionscript-3 flash flex datagrid itemrenderer

我正在使用这个itemRenderer度过一段美好时光。 我有一个MX DataGrid,用于显示我使用HTTP服务收集的一些数据。我想将一些数据显示为"预览"在第一列中,我添加了一个带有DataGridColum.itemRenderer属性的itemRenderer。这里的一切都很好。

<mx:DataGrid id="labelsGrid" width="100%" height="100%" visible="false" 
 variableRowHeight="true" sortableColumns="false">
    <mx:columns>
        <mx:DataGridColumn headerText="Preview" dataField="recordid"
         width="{ preview_column_width }" itemRenderer="us.lbs.itemRenderers.preview"/>

        <mx:DataGridColumn headerText="Design id" dataField="label_id" />

        <mx:DataGridColumn headerText="Font size" dataField="label_minheight"/>

        <mx:DataGridColumn headerText="Width" dataField="label_width"/>

        <mx:DataGridColumn headerText="Height" dataField="label_height"/>

        <mx:DataGridColumn headerText="Label P/N" dataField="label_pn"/> 

        <mx:DataGridColumn headerText="Font type" dataField="label_fonttype"/>

        <mx:DataGridColumn headerText="Qty" dataField="label_qty"/>
    </mx:columns>
</mx:DataGrid>

这是我的itemRenderer的代码

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx"
     width="100%" height="100%"
     horizontalAlign="center" verticalAlign="middle" creationComplete="init( )">
<fx:Style> 
    @namespace mx "library://ns.adobe.com/flex/mx";
    @namespace s "library://ns.adobe.com/flex/spark";
</fx:Style>
<fx:Script>
    <![CDATA[
        import aw.utils.StringUtils;

        import flashx.textLayout.edit.SelectionFormat;
        import flashx.textLayout.formats.TextLayoutFormat;

        import mx.binding.utils.BindingUtils;
        import mx.binding.utils.ChangeWatcher;
        import mx.controls.Alert;
        import mx.events.CloseEvent;
        import mx.events.FlexEvent;
        import mx.events.ModuleEvent;
        import mx.geom.RoundedRectangle;
        import mx.managers.PopUpManager;
        import mx.messaging.messages.IMessage;
        import mx.rpc.events.FaultEvent;
        import mx.rpc.events.ResultEvent;
        import mx.utils.ColorUtil;
        import mx.utils.ObjectUtil;
        import mx.utils.StringUtil;

        import spark.components.Application;

        import us.lbs.viewer;

                  public var dad:viewer = null;
                  public var zoom:int = 2;

                  public var px_in:Number = 96;
                  public var pt_px:Number = 1.333333333333333;

        [Bindable]public var var_width:Number = 0;
        [Bindable]public var var_height:Number = 0;
        [Bindable]public var var_font_size:Number = 12;
        [Bindable]public var tmp_lines:String = "";

        public function init( ):void {
            settingDad( ); setSize( ); setFontSize( ); fixLines( );
        }

        protected function settingDad():void {
            dad = this.parentDocument as viewer;
            if ( typeof( dad.previewers[ data.label_id ] ) != 'object' ) {
                dad.previewers[ data.label_id ] = {};
                dad.previewers[ data.label_id ].preview = this;

                /*Alert.show( 
                    this.data.label_id + "\n" + 
                    "Type: " + typeof( dad.previewers[ data.label_id ].preview ), 
                    this.data.rm_pn
                );*/
            }
        }

        protected function setFontSize( ):void {
            var_font_size = data.label_minheight * pt_px * zoom;
            var_font_size = Math.round( var_font_size );
        }

        protected function setSize( ):void {
            var_width  = Number( data.label_width ) * px_in * zoom;
            var_height = Number( data.label_height ) * px_in * zoom;

            dad.labelsGrid.visible = true;
            dad.preview_column_width = ( var_width > dad.preview_column_width ) ? var_width:dad.preview_column_width;
        }

        protected function fixLines( ):void {
            tmp_lines = ""; var lines:Array = String( data.lines ).split( "//" );
            for each ( var line:String in lines ) {
                tmp_lines += StringUtils.trim( line ) + "\n";
            } tmp_lines = StringUtils.trim( tmp_lines );
        }

    ]]>
</fx:Script>
<s:HGroup >
    <s:RichEditableText
        id="previewTxt" 
        backgroundColor="white"
        text="{ tmp_lines }" 
        selectionHighlighting="always" editable="false" selectable="true"
        width="{ var_width }" height="{ var_height }" 
        kerning="on"
        fontSize="{ var_font_size }" fontFamily="{ data.label_fonttype }"
        paddingTop="0" paddingBottom="0" paddingLeft="0" paddingRight="0"
        textAlign="center" verticalAlign="middle" focusedTextSelectionColor="0xA8C6EE"
        selectionChange="dad.previewTxtSelectionChange(event)" />   
</s:HGroup>

我上面与你分享的代码是生成这个(这很好):

this is what I am expecting

所以,我的问题是,当我向下滚动数据网格时,我正在改变预览,如下所示:

the second preview gets changed

唯一改变的值是第一列,一切都像滚动前一样。

为什么会这样? 对不起,如果我没有写好足够的细节,我认为这已经足够......但是问我是否需要更多细节。

提前致谢!

1 个答案:

答案 0 :(得分:2)

Renderization使用缓冲区,因此您必须直接链接您的属性及其更改。

试试这个:

将text属性链接到fixLines方法,如下所示

<s:RichEditableText>中放入属性text

text = "{fixLines(data)}"

按以下方式更改方法:

protected function fixLines(obj:Object):String {
    if (obj == null) return "";
    var currText = "";
    var lines:Array = String( obj.lines).split( "//" );
    for each ( var line:String in lines ) {
        currText += StringUtils.trim( line ) + "\n";
    }
    currText = StringUtils.trim( tmp_lines );
    return currText;
}

在您调用fixLines的init方法中,更改如下:

public function init( ):void {
    settingDad( ); setSize( ); setFontSize( ); fixLines(data);
}

告诉我它是否正常