0

カスタム アイテム レンダラー内の RichEditableText 要素のデータを取得し、関数を介してそのデータを実行し、その関数の結果をアイテム レンダラー内のすべてのアイテムの RichEditableText コンポーネントに表示できることを理解しようとしています。 .

私のアイテムレンダラーは次のようになります： 

<!--    *********************************************** -->     
<s:DataGroup id="myDataGroup" width="100%">
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>

    <s:itemRenderer>
        <fx:Component>
            <s:ItemRenderer width="100%">
                <s:HGroup width="100%">
                    <s:BitmapImage id="labelIMG" source="{data.user.profileimage}"/>
                    <s:VGroup width="100%">
                        <s:RichEditableText id="labelText" 
                                            width="100%"
                                            editable="false"
                                            fontSize="16"
                                            multiline="true"
                                            paddingRight="20"
                                            selectable="false"
                                            text="{data.text}"
                                            textJustify="distribute"
                                            verticalAlign="middle"
                                            lineHeight="14"
                                            letterSpacing="-5"/>
                        <s:Label id="labelDate" fontSize="9" 
                                 width="100%"                                                                                                                    
                                 textAlign="right"
                                 text="{data.date_created}" 
                                 paddingBottom="20" 
                                 paddingRight="20" />
                    </s:VGroup>
                </s:HGroup>
            </s:ItemRenderer>
        </fx:Component>
    </s:itemRenderer>
</s:DataGroup>
<!--    *********************************************** -->

そのため、アイテムレンダラーに表示されている日付アイテム (バインドされたデータ data.date_created を持つ labelDate) については、日付を目的の形式に変換する関数を使用してこれを実行したいと思います...関数は、ここにある回答にあります。

これは可能ですか？注：JSONからdataProviderデータも生成しているため、最初にデータをArrayCollectionにする必要があります。

myJSONdata = JSON.parse(jsonContent.data);   //PARSE THE INCOMING JSON DATA
arrColl = new ArrayCollection(myJSONdata as Array);   // CONVERT IT TO AN ARRAYCOLLECTION
myDataGroup.dataProvider = arrColl;   // NOW ASSIGN IT AS THE DATAPROVIDER FOR DATAGROUP/ITEMRENDERER

アイテムレンダラーで使用されるデータで既にこの日付関数が実行され、日付要素が置き換えられているように、Im が ArrayCollection に変換する時点で着信データを変更することは可能ですか?

両方が可能な場合、パフォーマンスに優れているか、一般的にベストプラクティスと見なされているものはありますか?

4

1 に答える 1

1

Yes, it is possible and not too hard. In short, add the function to your itemRenderer and call it in a dataChange() event listener or in the set data method. 

        <!-- add the data change listener here -->
        <s:ItemRenderer width="100%" dataChange="onDataChange()">

            <fx:Script><[[

              // add in your date format function
private function toRelativeDate(d:Date):String {
        var now:Date=new Date();
        var millisecs:int=now.valueOf()-d.valueOf(); //gives you the num. of milliseconds between d and now
        var secs:int=int(millisecs / 1000);
        if(secs < 60) {
            return secs + " seconds ago";
        }else if(secs < 60*60) {
            return Math.round(secs / 60) + " minutes ago";
        } else if(secs < 60*60*24) {
            return Math.round(secs / (60*60)) + " hours ago";
        } else {
            return Math.round(secs / (60*60*24)) + " days ago";
        }
    }

              // implement the data change listener here
              protected function onDataChange():void{
                  // make sure that the data exists; as sometimes this method will run during intiial component setup
                  if(data){ 
                   // if data does exist; cast it as a date pass it to your parsing function and set the result of that to the text field of your RichText control
                   labelText.text = toRelativeDate((new date(data.text)));
                  } else {
                     // if data doesn't exist; set the text of the RichText control to empty.
                    labelText.text = '';
                   }
              }

            ]]></fx:Script>

            <s:HGroup width="100%">
                <s:BitmapImage id="labelIMG" source="{data.user.profileimage}"/>
                <s:VGroup width="100%">
                    <s:RichEditableText id="labelText" 
                                        width="100%"
                                        editable="false"
                                        fontSize="16"
                                        multiline="true"
                                        paddingRight="20"
                                        selectable="false"
                                        <!-- do not set the text value using Binding -->
                                        textJustify="distribute"
                                        verticalAlign="middle"
                                        lineHeight="14"
                                        letterSpacing="-5"/>
                    <s:Label id="labelDate" fontSize="9" 
                             width="100%"                                                                                                                    
                             textAlign="right"
                             text="{data.date_created}" 
                             paddingBottom="20" 
                             paddingRight="20" />
                </s:VGroup>
            </s:HGroup>
        </s:ItemRenderer>

I wrote all this code in the browser; so it may need tweaking. As a general rule; I recommend using the dataChange() event instead of binding to set values of inside an itemRenderer. Binding can have some performance/memory leakage side effects.

于 2013-04-06T18:34:49.310 に答える