Relative Size/Layout of Components


This is listed as Obstacle #4 in my previous post.I can paint a really pretty absolutely positioned and sized GUI in the Design view; however, I would like a relatively positioned and sized GUI in the browser. In particular, I would like for my GUI to fill the browser space and keep nice proportions.

I have a solution, but it is not 100% satisfactory.

For each of the major components (Group Panel, Tree, and Common Tasks Section), I’ve set the height and width style properties to % instead of px. I left the Tree width at absolute width to keep up snug up against the Common Tasks Section

  • Group Panel – 100%, 100%
  • Tree- 100%, 250 px
  • Common Tasks Section – 100%, 80%

So now I get this nice resizable layout in my browser:

fig1_6.jpg

But now I’m left with this in the design tab:

fig1_7.jpg

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s