• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2240
  • Last Modified:

How do I make this Flex Layout

Hi, I am trying to make the following FLEX layout.

http://www.tyglobal.net/flexlayout.gif

How would I do this, note: I am not familiar with flex at all, I prefer the design layout to the code layout. Thanks.

0
tariqjamal
Asked:
tariqjamal
  • 3
  • 2
1 Solution
 
SavongCommented:
You'd probably be best to start with a Canvas and use the constraint values to keep the panel on the left and the tab navigator sized correctly.  Then it's a matter of playing with the interior items.  It might be easier of you attempted the layout and let us know if there were specific difficulties you were running into.  Give it a go, and I'd love to help out from there.
0
 
tariqjamalAuthor Commented:
Ok, here is my problem, I've uploaded a pic to show you.

I have changed the layout a little bit, but my question is this. These are the changes I'm having trouble with

I need to know how to:

make the buttons on the left are aligned to the bottom of the screen.

and the height of the right datagrid to be the full height of the panel minus 20 px on the top (space for buttons).

The link to my screen shot is
http://www.tyglobal.net/mylayout.gif

Thanks. Also, if you know anything about adding an image within a datagrid let me know. Thanks.
0
 
SavongCommented:
I think the key here is going to be percentages and spacers.  Put a spacer at the top on the right that's 20px tall, then set the datagrid height to 100% (assuming the panel is set to vertical).  If it's set to absolute, then just set the constraints to 0 on all sides except the top, set that to 20px.  For the buttons on the left I'd just put a spacer between the list at the top and the buttons.  Or make your list height 100%.
0
 
tariqjamalAuthor Commented:
Both worked like a charm.

Only 1 question left, how can I add a little image into a datagrid?

By the way, I really appreciate your help, I wish there was a way to give extra points.

0
 
SavongCommented:
Not a problem, take a look at itemRenderers.  Basically it allows you to create a little component (in this case an image) and specify you want to use that to render a column.  A perfect example is here:
http://livedocs.adobe.com/flex/201/html/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Book_Parts&file=cellrenderer_072_28.html
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Microsoft Office 2010

This course will introduce you to the interfaces and features of Microsoft Office 2010 Word, Excel, PowerPoint, Outlook, and Access. You will learn about the features that are shared between all products in the Office suite, as well as the new features that are product specific.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now