建FLEX4自定义MXAdvancedDataGridItemR

建FLEX4自定义MXAdvancedDataGridItemR

关注
发信
关注(28)粉丝(399)

我怎样才能创建FLEX4自定义MXAdvancedDataGridItemRenderer？

本文介绍了我怎样才能创建FLEX4自定义MXAdvancedDataGridItemRenderer？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

嗯，我创建了一个，但它有一堆问题：

  • 如果我点击渲染的专栏中，我得到一个错误：
  • 文本被粘贴到细胞的左上角;
  • 在单元格的背景不会改变到所选择的。

我是新来的Flex和我可能这样做完全错误的，但这里有没有自定义MXAdvancedDataGridItemRenderer在网上的例子很多。你能在正确的方向指向我？

Test.mxml 

 ＆LT; XML版本=1.0编码=UTF-8＆GT？;
＆LT; S：应用的xmlns：FX =htt​​p://ns.adobe.com/mxml/2009
               XMLNS：S =库：//ns.adobe.com/flex/spark
               的xmlns：MX =库：//ns.adobe.com/flex/mx=了minWidth955了minHeight =600
               的xmlns：测试=*
               初始化=的init（）＆GT;
    ＆LT; FX：脚本＆GT;
        ＆LT;！[CDATA [
            进口mx.collections.ArrayCollection;
            进口mx.controls.Alert;

            [可绑定]
            私人VAR数据：ArrayCollection的=新ArrayCollection的（）;

            私有函数的init（）：无效{
                VAR的DataItem：DataItem的=新的DataItem（1000，1000）;
                this.data.addItem（DataItem的）;
                DataItem的=新的DataItem（1001，1001）;
                this.data.addItem（DataItem的）;
            }

            私有函数clickHandler事件（五：事件）：无效{
                VAR的DataItem：DataItem的= e.currentTarget.selectedItem为DataItem的;
                Alert.show（dataItem.col1 +''+ dataItem.col2）;
            }
        ]]≥
    ＆LT; / FX：脚本＆GT;
    ＆LT; MX：的AdvancedDataGrid的dataProvider ={}数据点击=clickHandler事件（事件）; X =0Y =0designViewDataType =扁平化和GT;
        ＆LT; MX：列＆GT;
            ＆LT; MX：的AdvancedDataGridColumn的dataField =COL1HEADERTEXT =列1/＆GT;
            ＆LT; MX：的AdvancedDataGridColumn的dataField =COL2HEADERTEXT =2列ID =列2/＆GT;
        ＆LT; / MX：列＆GT;
        ＆LT; MX：rendererProviders＆GT;
            ＆LT; MX：AdvancedDataGridRendererProvider列={}列2渲染器=MyRenderer/＆GT;
        ＆LT; / MX：rendererProviders＆GT;
    ＆LT; / MX：的AdvancedDataGrid＆GT;
＆LT; / S：用途＆gt;

MyRenderer.mxml 

 ＆LT; XML版本=1.0编码=UTF-8＆GT？;
＆LT; S：MXAdvancedDataGridItemRenderer的xmlns：FX =htt​​p://ns.adobe.com/mxml/2009
                                  XMLNS：S =库：//ns.adobe.com/flex/spark
                                  的xmlns：MX =库：//ns.adobe.com/flex/mx
                                  focusEnabled =真正的＆GT;
    ＆LT; S：标签ID =lblData/＆GT;
    ＆LT; FX：声明＆GT;
        ＆LT; MX：的NumberFormatter ID =的NumberFormatteruseThousandsSeparator =真/＆GT;
    ＆LT; / FX：声明＆GT;
    ＆LT; FX：脚本＆GT;
        ＆LT;！[CDATA [
            重写公共职能组数据（值：对象）：无效{
                如果（value.col1＆GT; 1000）{
                    lblData.text = numberformatter.format（value.col2）;
                } 其他 {
                    lblData.text = value.col2;
                }
            }
        ]]≥
    ＆LT; / FX：脚本＆GT;
＆所述; /秒：MXAdvancedDataGridItemRenderer＆GT;

解决方案

我找到了解决自己：

 ＆LT; S：MXAdvancedDataGridItemRenderer的xmlns：FX =htt​​p://ns.adobe.com/mxml/2009
                                  XMLNS：S =库：//ns.adobe.com/flex/spark
                                  的xmlns：MX =库：//ns.adobe.com/flex/mx
                                  focusEnabled =真正的＆GT;
    ＆LT; S：标签文本={格式（this.row）}WIDTH =100％高度=100％verticalAlign =中以下属性来=5/＆GT;
    ＆LT; FX：声明＆GT;
        ＆LT; MX：的NumberFormatter ID =的NumberFormatteruseThousandsSeparator =真/＆GT;
    ＆LT; / FX：声明＆GT;
    ＆LT; FX：脚本＆GT;
        ＆LT;！[CDATA [
            [可绑定]
            私人VAR行：DataItem的;

            重写公共职能组数据（值：对象）：无效{
                this.row =价值DataItem的;
            }

            重写公共职能得到的数据（）：对象{
                返回this.row
            }

            私有函数格式（行：DataItem的）：对象{
                如果（row.col1＆GT; 1000）{
                    返回numberformatter.format（row.col2）;
                } 其他 {
                    返回row.col2;
                }
            }
        ]]≥
    ＆LT; / FX：脚本＆GT;
＆所述; /秒：MXAdvancedDataGridItemRenderer＆GT;

Well, I created one but it has a bunch of issues:

  • if I click in the rendered column I get an error:

  • the text is stuck to the top left corner of the cell;
  • the cell's background doesn't change to the selected one.

I'm new to Flex and I'm probably doing it completely wrong but here aren't many examples of custom MXAdvancedDataGridItemRenderer on the Net. Can you point me in the right direction?

Test.mxml

<?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"
               xmlns:test="*"
               initialize="init()">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.controls.Alert;

            [Bindable]
            private var data:ArrayCollection = new ArrayCollection();

            private function init():void {
                var dataItem:DataItem = new DataItem(1000, 1000);
                this.data.addItem(dataItem);
                dataItem = new DataItem(1001, 1001);
                this.data.addItem(dataItem);
            }

            private function clickHandler(e:Event):void {
                var dataItem:DataItem = e.currentTarget.selectedItem as DataItem;
                Alert.show(dataItem.col1 + ' ' + dataItem.col2);
            }
        ]]>
    </fx:Script>
    <mx:AdvancedDataGrid dataProvider="{data}" click="clickHandler(event);" x="0" y="0" designViewDataType="flat">
        <mx:columns>
            <mx:AdvancedDataGridColumn dataField="col1" headerText="Column 1"/>
            <mx:AdvancedDataGridColumn dataField="col2" headerText="Column 2" id="column2"/>
        </mx:columns>
        <mx:rendererProviders>
            <mx:AdvancedDataGridRendererProvider column="{column2}" renderer="MyRenderer" />
        </mx:rendererProviders>
    </mx:AdvancedDataGrid>
</s:Application>

MyRenderer.mxml 

<?xml version="1.0" encoding="utf-8"?>
<s:MXAdvancedDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                                  xmlns:s="library://ns.adobe.com/flex/spark"
                                  xmlns:mx="library://ns.adobe.com/flex/mx"
                                  focusEnabled="true">
    <s:Label id="lblData" />
    <fx:Declarations>
        <mx:NumberFormatter id="numberformatter" useThousandsSeparator="true" />
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            override public function set data(value:Object):void {
                if (value.col1 > 1000) {
                    lblData.text = numberformatter.format(value.col2);
                } else {
                    lblData.text = value.col2;
                }
            }
        ]]>
    </fx:Script>
</s:MXAdvancedDataGridItemRenderer>
解决方案

I found a solution myself:

<s:MXAdvancedDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
                                  xmlns:s="library://ns.adobe.com/flex/spark"
                                  xmlns:mx="library://ns.adobe.com/flex/mx"
                                  focusEnabled="true">
    <s:Label text="{format(this.row)}" width="100%" height="100%" verticalAlign="middle" paddingLeft="5"/>
    <fx:Declarations>
        <mx:NumberFormatter id="numberformatter" useThousandsSeparator="true" />
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            [Bindable]
            private var row:DataItem;

            override public function set data(value:Object):void {
                this.row = value as DataItem;
            }

            override public function get data():Object {
                return this.row
            }

            private function format(row:DataItem):Object {
                if (row.col1 > 1000) {
                    return numberformatter.format(row.col2);
                } else {
                    return row.col2;
                }
            }
        ]]>
    </fx:Script>
</s:MXAdvancedDataGridItemRenderer>

这篇关于我怎样才能创建FLEX4自定义MXAdvancedDataGridItemRenderer？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

08-22 23:36
Powered by LMLPHP ©2024 建FLEX4自定义MXAdvancedDataGridItemR 0.053846