3 Replies Latest reply on Nov 12, 2010 11:37 AM by Shongrunden

    Hero MobileIconItemRenderer label and message functions

    dsmith@genitron

      While I have done a lot of Flash animations, I am relatively new to ActionScript, and Burrito is my very first experience with Flash Builder.

      I've gone through the available tutorials using this component, and have even built my own http/JSON data driven app. Now i'm experimenting a little with list formatting.

       

      I'm trying to use various components' function calls to format my list item outputs. For instance, I was able to create and use the "LabelFunction" in the <s:List> component to do some simple modifying of the list label field from there.

       

      There are similar functions in the MobileIconItemRenderer component called "labelFunction" and "messageFunction", but I have not been able to access any functions I create for them. Actually, I m not sure where to put them. They are not seen if I put them in the main <fx:script> section of the view, like i did with the <s:list> component.

       

      1120: Access of undefined property my_Function. view3.mxml /Test/src/views line 111 Flex Problem

       

      Has anyone used these function calls in MobileIconItem Renderer?

      Where do i put those functions?

        • 1. Re: Hero MobileIconItemRenderer label and message functions
          Jason San Jose Adobe Employee

          Move to Flex forum. Renamed to Hero (SDK) from Burrito (FB).

          • 2. Re: Hero MobileIconItemRenderer label and message functions
            SashaKeith Adobe Employee

            Here's a sample on how to do this:

                <s:List dataProvider="{items}" left="0" right="0" top="0" bottom="0">

                    <s:itemRenderer>

                        <fx:Component>

                            <s:MobileIconItemRenderer labelFunction="lblFunction" messageField="message">

                                <fx:Script>

                                    <![CDATA[

                                        private function lblFunction(item:Object):String

                                        {

                                            return item.label + "_2010";

                                        }

                                    ]]>

                                </fx:Script>

                            </s:MobileIconItemRenderer>

                        </fx:Component>

                    </s:itemRenderer>

                </s:List>

            • 3. Re: Hero MobileIconItemRenderer label and message functions
              Shongrunden Adobe Employee

              Good question, this can be a little tricky if you are new to MXML.  The fx:Component construct defines a new document scope so you could put another script tag in there or refer to methods in the main document via the outerDocument keyword:

               

              Here's an example:

               

              <s:View xmlns:fx="http://ns.adobe.com/mxml/2009"

                      xmlns:s="library://ns.adobe.com/flex/spark" title="Home">

               

                  <fx:Script>

                      <![CDATA[

                          public function messageFunction(item:Object):String {

                              return "outer message function";

                          }

                      ]]>

                  </fx:Script>

               

                  <s:HGroup>

                      <s:List>

                          <s:itemRenderer>

                              <fx:Component>

                                  <s:MobileIconItemRenderer messageFunction="innerMessageFunction">

                                      <fx:Script>

                                          <![CDATA[

                                              public function innerMessageFunction(item:Object):String {

                                                  return "inner message function"                                   

                                              }

                                          ]]>

                                      </fx:Script>

                                  </s:MobileIconItemRenderer>

                              </fx:Component>

                          </s:itemRenderer>

                          <s:dataProvider>

                              <s:ArrayList>

                                  <s:source>

                                      [1,2,3,4]

                                  </s:source>

                              </s:ArrayList>

                          </s:dataProvider>

                      </s:List>

               

                      <s:List>

                          <s:itemRenderer>

                              <fx:Component>

                                  <s:MobileIconItemRenderer messageFunction="{outerDocument.messageFunction}" />

                              </fx:Component>

                          </s:itemRenderer>

                          <s:dataProvider>

                              <s:ArrayList>

                                  <s:source>

                                      [1,2,3,4]

                                  </s:source>

                              </s:ArrayList>

                          </s:dataProvider>

                      </s:List>

                  </s:HGroup>

               

              </s:View>

              1 person found this helpful