7 Replies Latest reply on Aug 22, 2007 10:50 AM by Newsgroup_User

    Custom components that accept multiple data types

    Level 7
      The components that come with Flex, such as Datagrid, can accept
      multiple data types as a data source. For instance, you can bind a
      Datagrid to XML return from an HTTPService request or you can build an
      array and bind to that. I'd like to build my own component that does
      something similar, but I can't find any examples of this. I don't
      really even know what terms I'd search under to find it.

      Can anyone out there give me any idea of how this is done? Also, I'm a
      bit hazy on how the column definitions you set up in the MXML tag get
      received inside the class. I'd appreciate any insight on how this
      works.

      Thanks;

      Amy


        • 1. Re: Custom components that accept multiple data types
          rvollmar Level 1
          For the first part, it looks like you can make a control that accepts a dataProvider which implements IList or ICollectionView and go from there. As for other types, the DataGrid ASDoc says:

          "If you set the dataProvider property to an Array, it will be converted to an ArrayCollection. If you set the property to an XML object, it will be converted into an XMLListCollection with only one item. If you set the property to an XMLList, it will be converted to an XMLListCollection. If you set the property to an object that implements the IList or ICollectionView interface, the object will be used directly."

          For an example, you can also look in the file frameworks/projects/framework/src/mx/controls/listClasses/ListBase.as to see how it implements its dataProvider.

          Is this the kind of answer you were looking for for the first part of your post?
          • 2. Custom components that accept multiple data types
            rvollmar Level 1
            In DataGrid.as, this:

            <mx:columns>
            <mx:DataGridColumn>
            ...
            </mx:columns>

            is done by this:

            override public function set columns(value:Array):void{...}

            The <mx:columns> indicates the columns property, and the <mx:DataGridColumn> lines make up the "value" array.
            • 3. Re: Custom components that accept multiple data types
              Level 7

              "rvollmar" <webforumsuser@macromedia.com> wrote in message
              news:fafqof$49d$1@forums.macromedia.com...
              > For the first part, it looks like you can make a control that accepts a
              > dataProvider which implements IList or ICollectionView and go from there.
              > As
              > for other types, the DataGrid ASDoc says:
              >
              > "If you set the dataProvider property to an Array, it will be converted to
              > an
              > ArrayCollection. If you set the property to an XML object, it will be
              > converted
              > into an XMLListCollection with only one item. If you set the property to
              > an
              > XMLList, it will be converted to an XMLListCollection. If you set the
              > property
              > to an object that implements the IList or ICollectionView interface, the
              > object
              > will be used directly."
              >
              > For an example, you can also look in the file
              > frameworks/projects/framework/src/mx/controls/listClasses/ListBase.as to
              > see
              > how it implements its dataProvider.
              >
              > Is this the kind of answer you were looking for for the first part of your
              > post?

              Yes, thanks. Just knowing where to find the source of the components is a
              big help!


              • 4. Re: Custom components that accept multiple data types
                Level 7

                "rvollmar" <webforumsuser@macromedia.com> wrote in message
                news:faftc3$6va$1@forums.macromedia.com...
                > For the second part of your post, are you asking how to set up columns in
                > ActionScript? e.g.
                >
                > private function setColumnConfig1(dg:DataGrid):void{
                > colArray = new Array();
                > var col1:DataGridColumn = new DataGridColumn();
                > var col2:DataGridColumn = new DataGridColumn();
                > var col3:DataGridColumn = new DataGridColumn();
                > var col4:DataGridColumn = new DataGridColumn();
                > var col5:DataGridColumn = new DataGridColumn();
                > var col6:DataGridColumn = new DataGridColumn();
                >
                > col1.dataField = "recordName";
                > col2.dataField = "image";
                > col3.dataField = "recordAmount";
                > col4.dataField = "who";
                > col5.dataField = "where";
                > col6.dataField = "when";
                >
                > col2.itemRenderer = application.ImageRenderer;
                >
                > colArray.push(col1);
                > colArray.push(col2);
                > colArray.push(col3);
                > colArray.push(col4);
                > colArray.push(col5);
                > colArray.push(col6);
                >
                > dg.columns = colArray;
                > }
                >
                > Or were you wondering, when one writes this in mxml:
                >
                > <mx:columns>
                > <mx:DataGridColumn ...>
                > ...
                > </mx:columns>
                >
                > how do you then have the control use that information?

                The latter. But the fact is that I was misreading the example I was looking
                at.

                <?xml version="1.0"?>
                <!-- dpcontrols/DataGridSimpleAttributes.mxml -->
                <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">
                <mx:DataGrid>
                <mx:ArrayCollection>
                <mx:Object Artist="Pavement"
                Album="Slanted and Enchanted" Price="11.99" />
                <mx:Object Artist="Pavement"
                Album="Brighten the Corners" Price="11.99" />
                </mx:ArrayCollection>
                </mx:DataGrid>
                </mx:Application>
                I was thinking the ArrayCollection was going to the columns, but of course
                it is the dataProvider. Am I right in thinking that internally the control
                has a defaultProperty metatag that enables the contents of the parent
                DataGrid tag to just come in and populate the dataProvider through
                PFM?Thanks;Amy


                • 5. Re: Custom components that accept multiple data types
                  Level 7

                  "rvollmar" <webforumsuser@macromedia.com> wrote in message
                  news:fafqof$49d$1@forums.macromedia.com...
                  > For the first part, it looks like you can make a control that accepts a
                  > dataProvider which implements IList or ICollectionView and go from there.
                  > As
                  > for other types, the DataGrid ASDoc says:
                  >
                  > "If you set the dataProvider property to an Array, it will be converted to
                  > an
                  > ArrayCollection. If you set the property to an XML object, it will be
                  > converted
                  > into an XMLListCollection with only one item. If you set the property to
                  > an
                  > XMLList, it will be converted to an XMLListCollection. If you set the
                  > property
                  > to an object that implements the IList or ICollectionView interface, the
                  > object
                  > will be used directly."
                  >
                  > For an example, you can also look in the file
                  > frameworks/projects/framework/src/mx/controls/listClasses/ListBase.as to
                  > see
                  > how it implements its dataProvider.
                  >
                  > Is this the kind of answer you were looking for for the first part of your
                  > post?

                  I looked in my Program Files\Adobe\Flex Builder 3 for this path, and I did
                  not find it. Where is the beginning of this path?

                  Thanks;

                  Amy


                  • 6. Re: Custom components that accept multiple data types
                    Peter deHaan Level 4
                    Amy,

                    It should be something similar to the following:

                    C:\Program Files\Adobe\Flex Builder 3\sdks\3.0.0\frameworks\projects\framework\src\...

                    Peter
                    • 7. Re: Custom components that accept multiple data types
                      Level 7

                      "Amy Blankenship *AdobeCommunityExpert*" <Amy_nospam@magnoliamultimedia.com>
                      wrote in message news:fahkav$76e$1@forums.macromedia.com...
                      >
                      > "rvollmar" <webforumsuser@macromedia.com> wrote in message
                      > news:faftc3$6va$1@forums.macromedia.com...
                      >> For the second part of your post, are you asking how to set up columns in
                      >> ActionScript? e.g.
                      >>
                      >> private function setColumnConfig1(dg:DataGrid):void{
                      >> colArray = new Array();
                      >> var col1:DataGridColumn = new DataGridColumn();
                      >> var col2:DataGridColumn = new DataGridColumn();
                      >> var col3:DataGridColumn = new DataGridColumn();
                      >> var col4:DataGridColumn = new DataGridColumn();
                      >> var col5:DataGridColumn = new DataGridColumn();
                      >> var col6:DataGridColumn = new DataGridColumn();
                      >>
                      >> col1.dataField = "recordName";
                      >> col2.dataField = "image";
                      >> col3.dataField = "recordAmount";
                      >> col4.dataField = "who";
                      >> col5.dataField = "where";
                      >> col6.dataField = "when";
                      >>
                      >> col2.itemRenderer = application.ImageRenderer;
                      >>
                      >> colArray.push(col1);
                      >> colArray.push(col2);
                      >> colArray.push(col3);
                      >> colArray.push(col4);
                      >> colArray.push(col5);
                      >> colArray.push(col6);
                      >>
                      >> dg.columns = colArray;
                      >> }
                      >>
                      >> Or were you wondering, when one writes this in mxml:
                      >>
                      >> <mx:columns>
                      >> <mx:DataGridColumn ...>
                      >> ...
                      >> </mx:columns>
                      >>
                      >> how do you then have the control use that information?
                      >
                      > The latter. But the fact is that I was misreading the example I was
                      > looking at.
                      >
                      > <?xml version="1.0"?>
                      > <!-- dpcontrols/DataGridSimpleAttributes.mxml -->
                      > <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">
                      > <mx:DataGrid>
                      > <mx:ArrayCollection>
                      > <mx:Object Artist="Pavement"
                      > Album="Slanted and Enchanted" Price="11.99" />
                      > <mx:Object Artist="Pavement"
                      > Album="Brighten the Corners" Price="11.99" />
                      > </mx:ArrayCollection>
                      > </mx:DataGrid>
                      > </mx:Application>
                      > I was thinking the ArrayCollection was going to the columns, but of course
                      > it is the dataProvider. Am I right in thinking that internally the
                      > control has a defaultProperty metatag that enables the contents of the
                      > parent DataGrid tag to just come in and populate the dataProvider through
                      > PFM?Thanks;Amy

                      OK, I have looked at the source file, and it looks like the
                      [DefaultProperty] metatdata tag is at least not used in the ListBase.as
                      class. So I am guessing it is either higher or lower in the heirarchy...?

                      -Amy