Display image in an array format

Question

I'm new to flex and I would really appreciate anyone who can help me. My  problem is I need to display an (1)image in columns and rows depending  on the user input. I have two text inputs one for length and width on  the other. Say the user inputs 5 for length and 6 for width so the  image will be displayed in a 5 x6 picture array(5 pictures in 6 rows).  Looking forward for your advise on how I can workon this. I hope I was able to explain my problem very well. Thank you in  advance.

Answer 1

You might find TileLayout to be useful.  It exposes a requestedColumnCount and requestedRowCount property.
Here is a simple example:
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark">
    <s:controlBarContent>
        <s:HSlider id="colSlider" minimum="2" value="3" maximum="6" />
    </s:controlBarContent>
    <s:List width="100%" height="100%">
        <s:layout>
            <s:TileLayout requestedColumnCount="{colSlider.value}" />
        </s:layout>
        <s:itemRenderer>
            <fx:Component>
                <s:ItemRenderer>
                    <s:Rect width="100" height="100">
                        <s:fill>
                            <s:SolidColor color="0xe3e3e3" />
                        </s:fill>
                    </s:Rect>
                    <s:Label text="{data}" verticalCenter="0" horizontalCenter="0" />
                </s:ItemRenderer>
            </fx:Component>
        </s:itemRenderer>
        <s:dataProvider>
            <s:ArrayCollection>
                <fx:String>1</fx:String>
                <fx:String>2</fx:String>
                <fx:String>3</fx:String>
                <fx:String>4</fx:String>
                <fx:String>5</fx:String>
                <fx:String>6</fx:String>
                <fx:String>7</fx:String>
                <fx:String>8</fx:String>
                <fx:String>9</fx:String>
                <fx:String>10</fx:String>
                <fx:String>11</fx:String>
                <fx:String>12</fx:String>
                <fx:String>13</fx:String>
                <fx:String>14</fx:String>
                <fx:String>15</fx:String>
            </s:ArrayCollection>
        </s:dataProvider>
    </s:List>
</s:Application>