I think it is reallay interesting:
I've been able to realize flexible and fluid layout before passing to
use GWT, by using CSS and a combination of properties "position:
absolute;" "top:xxx", "bottom;xxx", "width:xxx" etc.
and I liked this approach because it does not use tables!
In gwt, I've tried to do the same by using AbsolutePanel but it was
not posible mainly because AbsolutePanel ony let you to set top and
left value, (and, if I remember correctly, only as integer value).
I don't know if it could be of any help, but here I want to give you a
sample (in html) which I wrote while studing how to apply this kind of
CSS layouts in GWT (for sure it works on IE7, I don't know if it works
on IE6 but it was not important for me):
{{{
<div id="Main" class="panel">
<div id="Left" class="panel"
style="position:absolute;top:0;bottom:0;left:0;right:50%;">
<div id="LeftLeft" class="panel"
style="position:absolute;top:0;bottom:0;left:0;width:200px;">
<div id="LeftLeftTop" class="widget"
style="position:absolute;top:0;height:300px;left:0;right:0;"><h2>Left
Left Top</h2></div>
<div id="LeftLeftBottom" class="widget"
style="position:absolute;top:300px;bottom:0;left:0;right:0;"><h2>Left
Left Bottom</h2></div>
</div>
<div id="LeftRight" class="panel"
style="position:absolute;top:0;bottom:0;left:200px;right:0;">
<div id="LeftRightTop" class="widget"
style="position:absolute;top:0;height:200px;left:0;right:0;"><h2>Left
Right Top</h2></div>
<div id="LeftRightBottom" class="panel"
style="position:absolute;top:200px;bottom:0;left:0;right:0;">
<div id="LeftRightBottomTop" class="panel"
style="position:absolute;top:0;height:200px;left:0;right:0;">
<div id="LeftRightBottomTopLeft" class="widget"
style="position:absolute;top:0;bottom:0;left:0;right:50%;"><h2>Left
Right Bottom Top Left</h2></div>
<div id="LeftRightBottomTopRight" class="widget"
style="position:absolute;top:0;bottom:0;left:50%;right:0;"><h2>Left
Right Bottom Top Right</h2></div>
</div>
<div id="LeftRightBottomSplit" class="panel"
style="position:absolute;top:200px;height:5px;left:0;right:0; cursor:s-
resize;"><hr/></div>
<div id="LeftRightBottomBottom" class="widget"
style="position:absolute;top:205px;bottom:0;left:0;right:0;"><h2>Left
Right Bottom Bottom</h2></div>
</div>
</div>
</div>
<div id="Right" class="panel"
style="position:absolute;top:0;bottom:0;left:50%;right:0;">
<div id="RightLeft" class="widget"
style="position:absolute;top:0;bottom:0;width:300px;right:
0;"><h2>Right Left</h2></div>
<div id="RightRight" class="widget"
style="position:absolute;top:0;bottom:0;left:0;right:300px;"><h2>Right
Right</h2></div>
</div>
</div>
}}}
I would like to be able to reproduce such a layout in GWT.
NB. Any news on UiBinder?
--~--~---------~--~----~------------~-------~--~----~
http://groups.google.com/group/Google-Web-Toolkit-Contributors
-~----------~----~----~----~------~----~------~--~---
