display data in multiple rows

hi guys

I am using <mx:HorizontalList> to display id's  from a list. this is my code


<mx:HorizontalList width="848" height="54" dataProvider="{myData.myList}"  columnWidth="150" borderStyle="none" cornerRadius="15" >
<mx:itemRenderer >					
<mx:Component>	
					 
<mx:HBox height="100%" verticalAlign="middle" horizontalScrollPolicy="off" verticalScrollPolicy="off">
<mx:HBox verticalAlign="middle" horizontalAlign="right" >  
<mx:LinkButton id="projectName" label="{data.id}" /> -- The problem is here when displaying the id
</mx:HBox>											
</mx:HBox>

</mx:Component>					 
</mx:itemRenderer>
</mx:HorizontalList>

Open in new window


Whenever myData.myList contains a large number of items,  <mx:LinkButton id="projectName" label="{data.id}" />  overflows and i see a horizontal scroll bar.

I do not want a scrollbar , instead i want to move over to the second row.

for example if myData.myList has 10 items, i want to show the first 6 ids in the first row and the next 4 ids in second row instead of showing all 10 ids in one row with a scrollbar.

any idea how i can acchieve this?

thanks.
royjaydAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

dgofmanCommented:
I think you are using wrong components.
You have to use Tile and Repeater

<mx:Tile width="848" height="54" borderStyle="none" >
            <mx:Repeater id="rp" dataProvider="{myList}">
                  <mx:HBox height="100%" verticalAlign="middle" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                        <mx:HBox verticalAlign="middle" horizontalAlign="right" > 
                              <mx:LinkButton id="projectName" label="{rp.currentItem.id}" width="200"/>
                        </mx:HBox>                                                                  
                  </mx:HBox>
            </mx:Repeater>
      </mx:Tile>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
royjaydAuthor Commented:
repeater puts a vertical scroll bar but i was thinking there is no way to avoid a scroll bar, it either has to be vertical or horizontal,  so dont think there is a solution to this problem.
 thanks for the answer.
can you please help with this question

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/Flex/Q_26919455.html

thanks
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Apache Flex

From novice to tech pro — start learning today.