10 Replies Latest reply on Oct 6, 2006 6:52 AM by nyfeman

    Flex and XML Variables

    ForsakenBlade
      Hi, I am new to Flex and I've been trying to figure this out but since I can't find many tutorials on the net thought I may aswell ask here.

      I currently have a Flex app that connects to a PHP which then connects to the MYSQL db and writes the XML then it displays it to the Datagrid.

      This is the problem now.

      My XML looks a like this
      <tiles>

      <tile>
      <x>1</x>
      <y>2</y>
      <timage> http://www.google.com/intl/en/nav_first.gif </timage>
      </tile>

      <tile>
      <x>2</x>
      <y>3</y>
      <timage> http://www.anotherimage.com/image/anotherimage </timage>
      </tile>

      </tiles>

      I'm trying to assign each timage to a variable with the url and then have an image using the source of the url to display it. I hope you can understand what I'm trying to say I'm not very good at explaining. Help is very much appreciated thank you.
        • 1. Re: Flex and XML Variables
          nated Level 1
          If you're wanting the datagrid to display an image rather than the URL to the image try using the labelFunction for the DataGridColumn (versus the labelField).
          • 2. Re: Flex and XML Variables
            ForsakenBlade Level 1
            Well thats not exactly what im trying to do. The datagrid was just a test to see if my XML was correct and if the info would display correct and it does.

            <mx:Tile borderStyle="none" horizontalGap="0" verticalGap="0" paddingTop="0" paddingBottom="0" paddingLeft="0" paddingRight="0" x="135" y="173" width="460" height="460">
            <mx:Image id="t1" width="64" height="64"/>
            <mx:Image id="t2" width="64" height="64"/>
            <mx:Image id="t3" width="64" height="64"/>
            <mx:Image id="t4" width="64" height="64"/>
            <mx:Image id="t5" width="64" height="64"/>
            <mx:Image id="t6" width="64" height="64"/>
            <mx:Image id="t7" width="64" height="64"/>
            <mx:Image id="t8" width="64" height="64"/>
            <mx:Image id="t9" width="64" height="64"/>
            <mx:Image id="t10" width="64" height="64"/>
            <mx:Image id="t11" width="64" height="64"/>
            <mx:Image id="t12" width="64" height="64"/>
            <mx:Image id="t13" width="64" height="64"/>
            <mx:Image id="t14" width="64" height="64"/>
            <mx:Image id="t15" width="64" height="64"/>
            <mx:Image id="t16" width="64" height="64"/>
            <mx:Image id="t17" width="64" height="64"/>
            <mx:Image id="t18" width="64" height="64"/>
            <mx:Image id="t19" width="64" height="64"/>
            <mx:Image id="t20" width="64" height="64"/>
            <mx:Image id="t21" width="64" height="64"/>
            <mx:Image id="t22" width="64" height="64"/>
            <mx:Image id="t23" width="64" height="64"/>
            <mx:Image id="t24" width="64" height="64"/>
            <mx:Image id="t25" width="64" height="64"/>
            <mx:Image id="t26" width="64" height="64"/>
            <mx:Image id="t27" width="64" height="64"/>
            <mx:Image id="t28" width="64" height="64"/>
            <mx:Image id="t29" width="64" height="64"/>
            <mx:Image id="t30" width="64" height="64"/>
            <mx:Image id="t31" width="64" height="64"/>
            <mx:Image id="t32" width="64" height="64"/>
            <mx:Image id="t33" width="64" height="64"/>
            <mx:Image id="t34" width="64" height="64"/>
            <mx:Image id="t35" width="64" height="64"/>
            <mx:Image id="t36" width="64" height="64"/>
            <mx:Image id="t37" width="64" height="64"/>
            <mx:Image id="t38" width="64" height="64"/>
            <mx:Image id="t39" width="64" height="64"/>
            <mx:Image id="t40" width="64" height="64"/>
            <mx:Image id="t41" width="64" height="64"/>
            <mx:Image id="t42" width="64" height="64"/>
            <mx:Image id="t43" width="64" height="64"/>
            <mx:Image id="t44" width="64" height="64"/>
            <mx:Image id="t45" width="64" height="64"/>
            <mx:Image id="t46" width="64" height="64"/>
            <mx:Image id="t47" width="64" height="64"/>
            <mx:Image id="t48" width="64" height="64"/>
            <mx:Image id="t49" width="64" height="64"/>
            </mx:Tile>

            Now I have that and thats going to be where the images are loaded except I don't know how to get the timage url from the xml as the source for the mx:image. The reason im using xml for the source is because it will change at times.
            • 3. Flex and XML Variables
              ForsakenBlade Level 1
              can anyone help please the problem still hasn't been solvedh
              • 5. Flex and XML Variables
                Freeseb Level 1
                Just assign the source property of the mx:image with the value of the URL
                • 6. Re: Flex and XML Variables
                  ForsakenBlade Level 1
                  i just finished explaining that isn't what i need though because the images change depending on the mysql db nad the php reads the mysql db then writes the xml wich flex reads so the flex images are always upto date.
                  • 7. Re: Flex and XML Variables
                    nyfeman Level 1
                    Maybe I'm not understanding, either, but here's my take:

                    1) I think you should be using TileList, not Tile
                    2) Set the TileList's dataProvider to the object you're receiving from your xml

                    Here's a super quick and dirty example that I basted together from the TileList example in the documentation:
                    <?xml version="1.0"?>
                    <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" initialize="initData();" >
                    <mx:Script>
                    <![CDATA[
                    import mx.controls.Button;
                    import mx.collections.*;
                    private var listArray:Array=[
                    " http://www.google.com/intl/en/nav_first.gif",
                    " http://www.google.com/intl/en/nav_current.gif",
                    " http://www.google.com/intl/en/nav_page.gif",
                    " http://www.google.com/intl/en/nav_next.gif"
                    [Bindable]
                    public var TileListdp:ArrayCollection;

                    private function initData():void {
                    TileListdp = new ArrayCollection(listArray);
                    }
                    ]]>
                    </mx:Script>
                    <mx:TileList dataProvider="{TileListdp}"
                    itemRenderer="mx.controls.Image"/>
                    </mx:Application>

                    Al
                    • 8. Re: Flex and XML Variables
                      nyfeman Level 1
                      (Obviously, you're going to replace the listArray creation in the mx:Script block with your webservice or remoteobject call.)
                      • 9. Re: Flex and XML Variables
                        ForsakenBlade Level 1
                        quote:

                        Originally posted by: nyfeman
                        Maybe I'm not understanding, either, but here's my take:

                        1) I think you should be using TileList, not Tile
                        2) Set the TileList's dataProvider to the object you're receiving from your xml

                        Here's a super quick and dirty example that I basted together from the TileList example in the documentation:
                        <?xml version="1.0"?>
                        <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" initialize="initData();" >
                        <mx:Script>
                        <![CDATA[
                        import mx.controls.Button;
                        import mx.collections.*;
                        private var listArray:Array=[
                        " http://www.google.com/intl/en/nav_first.gif",
                        " http://www.google.com/intl/en/nav_current.gif",
                        " http://www.google.com/intl/en/nav_page.gif",
                        " http://www.google.com/intl/en/nav_next.gif"
                        [Bindable]
                        public var TileListdp:ArrayCollection;

                        private function initData():void {
                        TileListdp = new ArrayCollection(listArray);
                        }
                        ]]>
                        </mx:Script>
                        <mx:TileList dataProvider="{TileListdp}"
                        itemRenderer="mx.controls.Image"/>
                        </mx:Application>

                        Al


                        I think you do understand what im trying to do but when i try using tilelist instead of tile it says that tilelist isnt a valid parent for image even with the code you gave me as a test.
                        • 10. Re: Flex and XML Variables
                          nyfeman Level 1
                          Did you use the code verbatim? Can you paste what you've got?