First, sorry for this late reply regarding this issue. Life brought me
off my computer and gwt for a while...
Your answer is simple but it says everything: "Setting the height in
pixels always seems to bite you later..."
Except that it requires more work, it is a pity.
I was hopping that gwt would be so perfect that such basic behaviors
would be handled already...
Ok, nothing is perfect.
Thanks!
Best regards,
Be happy!
jeanluc
On Aug 6, 5:10 pm, Johannes Lehmann <johannes.lehma...@googlemail.com>
wrote:
> Hi Jean-luc,
>
> two things of interest (hopefully) about height in percent:
>
> - It is ignored inside table cells, by the browser. This is precisely
> the reason that you will never AFAIK be able to set the height in
> percent inside a decorator panel. The obvious workaround is to try and
> produce the same effect by using the <div> based DockLayoutPanel.
> Setting the height in pixels always seems to bite you later...
>
> - It does not include any padding or margin. Hence if you want to set
> such I find it best to wrap your Widget into a SimplePadding and set
> padding on the SimplePanel. Not sure if this helps in your case.
>
> Hope that helps,
>
> Johannes
>
> On Aug 6, 4:18 pm, Jean-luc Chasseriau <jean...@kernub.net> wrote:
>
>
>
>
>
>
>
> > Hi!
>
> > It is the 3rd or 4th sites I'm doing with GWT, it is a very sexy solution
> > which is working nicely, but I'm still having some basic problems of setting
> > the height of some elements of my sites. This is really basic, but not so
> > easy to handle...
>
> > I really hope that some GWT guru can help us (I'm sure I'm not the only one
> > to get that issue) on what is the best practice to handle such cases.
>
> > *Problems:*
> > 1) How do I set the height of a widget when setHeight() does not work with %
> > or not as expected (either height=0, or not as expected)?
>
> > 2) Why in onLoad(), headerPanel.getOffsetHeight() and
> > footerPanel.getOffsetHeight() are == 0? (Please read code bellow)
>
> > 3) Same with ScrollerPanel, how can I set the height of it without need to
> > set it in pixels?
>
> > 4) Why height in % behavior does not work when included in a DecoratorPanel?
>
> > I could read on gwt group that the height is very browser dependent and
> > would require heavy calculs - BUT - do we need to do them in Applications?
>
> > *Code principles:*
> > - gwt 2.1.0.m2 (same issus with 2.04)
> > - NOT using declarative UI with UiBinder - good old style java code
> > - Using Standard Mode, and, LayoutPanels
>
> > *Site description:*
> > - 1 FlowPanel used as like VerticalPanel, filled with
>
> > - 1 headerPanel: FlowPanel containing 2 other FlowPanel: logoPanel, and
> > flagPanel
> > - 1 tabPanel: TabLayoutPanel containing few tabs
> > - 1 footerPanel: FlowPanel containing a Label
>
> > *Idea:*
> > - header is fixed height depending on logos (image) height, and possible
> > margin/padding in css.
> > - footer is fixed height depending on label height, and possible
> > margin/padding in css
> > - tabPanel's height depends on the document height => it should fill the
> > whole space between header and footer.
>
> > *Solutions in mind:*
> > - use tabPanel.setHeight( "100%" ), but it does take the 100% of the whole
> > page (!), not the 100% of the space between header/ footer.
> > - calculate tabPanel's height in px, BUT, I need to know the height of the
> > header and the footer, which isn't accessible through getOffsetHeight()...
>
> > *Code*:
> > Here is my Application.java file:
> > public class Application extends Composite implements ResizeHandler {
>
> > final FlowPanel logoPanel = new FlowPanel();
> > final FlowPanel flagPanel = new FlowPanel();
> > final FlowPanel headerPanel = new FlowPanel();
> > final SimplePanel headerWrapperPanel = new SimplePanel();
>
> > final CipherPanel cipherPanel = new CipherPanel();
> > final OptionPanel optionPanel = new OptionPanel();
> > final AboutPanel aboutPanel = new AboutPanel();
>
> > final TabLayoutPanel tabPanel = new TabLayoutPanel( 3, Unit.EM );
>
> > final FlowPanel footerPanel = new FlowPanel();
>
> > final FlowPanel panel = new FlowPanel();
>
> > public Application() {
>
> > final Image padlockImg = new Image( Resources.inst.padlock() );
> > final Image titleImg = new Image( Resources.inst.title() );
> > final Image flagUKImg = new Image( Resources.inst.flagUK() );
> > final Image flagFRImg = new Image( Resources.inst.flagFR() );
> > final Image flagESImg = new Image( Resources.inst.flagES() );
> > final Label emailLabel = new Label( Strings.inst.contactEmail() );
>
> > flagUKImg.addStyleName( "App_flagImg" );
> > flagFRImg.addStyleName( "App_flagImg" );
> > flagESImg.addStyleName( "App_flagImg" );
>
> > logoPanel.add( padlockImg );
> > logoPanel.add( titleImg );
> > logoPanel.addStyleName( "App_logoPanel" );
>
> > flagPanel.add( flagFRImg );
> > flagPanel.add( flagUKImg );
> > flagPanel.add( flagESImg );
> > flagPanel.addStyleName( "App_flagPanel" );
>
> > headerPanel.add( logoPanel );
> > headerPanel.add( flagPanel );
>
> > //headerWrapperPanel.setWidget( headerPanel );
>
> > tabPanel.add( cipherPanel, CipherPanel.Strings.inst.panelTitle() );
> > tabPanel.add( optionPanel, OptionPanel.Strings.inst.panelTitle() );
> > tabPanel.add( aboutPanel, AboutPanel.Strings.inst.panelTitle() );
> > tabPanel.addStyleName( "App_tabPanel" );
> > tabPanel.setSize( "80%", "100%" );
>
> > emailLabel.addStyleName( "App_emailLabel" );
>
> > footerPanel.add( emailLabel );
>
> > panel.add( headerPanel );
> > //panel.add( headerWrapperPanel );
> > panel.add( tabPanel );
> > panel.add( footerPanel );
> > panel.addStyleName( "App_panel" );
>
> > initWidget( panel );
> > }
>
> > protected void onLoad() {
> > super.onLoad();
> > String txt = "logo panel: " + logoPanel.getOffsetHeight() + " header
> > height: " + headerPanel.getOffsetHeight() + " header wrapper height: " +
> > headerWrapperPanel.getOffsetHeight() + " footer height: " +
> > footerPanel.getOffsetHeigh
> > t() + " panel.height: " + panel.getOffsetHeight();
> > Window.alert( txt );
> > }
>
> > }
>
> > Note: no size has been set in the .css.
>
> > *Description:*
> > - Here, I'm using tabPanel.setSize( "80%", "100%" ), which does set the
> > height but definitely too big, it seams that it use the 100% of the
> > ClientWidth!
> > - Also, in onLoad() I'm printing the height of the logoPanel (which is
> > correct), headerPanel (which is ==0), I've used a headerWrapperPanel (which
> > is ==0), footerPanel (==0 too) -
>
> > *Why these panels do not get the height of their inner panels?*
>
> > I also got the problem with ScrollerPanel, impossible to tell it
> > setHeight("100%")... It is a nightmare!
> > We need to set the size in pixel which is almost impossible in some case...
>
> > Why is it still so complicated to set widget's height in the second version
> > of GWT?
>
> > GWT is a sweet toolkit! I love the idea, and I love it, BUT, some times it
> > is a pain! With such basic stuffs, it is quite annoying...
>
> > Thanks to all, and be happy!
>
> > --
> > Jeanluc
--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to google-web-toolkit+unsubscribe@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
No comments:
Post a Comment