Hi Jens, Great, it works exactly as I want! Such a simple approach as well, it should be part of GWT though. David
On Thursday, February 2, 2012 1:23:57 AM UTC+1, espinosa_cz wrote: > Hi guys, > > I manage to put my context panel to the middle of the browser page in > Vaadin. Seem my screenshots. It is done purely in Java code, the only > CSS used is for setting colors and font sizes. > Now I wondering how to make something similar with vanilla GWT. > > In Vaadin it is one line command! > ((VerticalLayout)outerContentPanel).setComponentAlignment(contextPanel, > Alignment.MIDDLE_CENTER); > What is the GWT equivalent? > > How to centre a fixed size panel (LayoutPanel) inside resizable parent > container, let's say RootLayoutPanel as it is in this picture? > > http://espinosa.s3-website-eu-west-1.amazonaws.com/vvregform2/vvregform/vvregform_progress_2011-01-24_-_screenshot_1.png > > > The central panel (form) can grow, see here: > > http://espinosa.s3-website-eu-west-1.amazonaws.com/vvregform2/vvregform/vvregform_progress_2011-01-24_-_screenshot_3.png > > so the solution must be flexible, accommodate any change in the > central panel. > > Preferably programmatically (no UiBinding) and ideally without special > CSS tricks. > > I made some progress with encapsulated LayoutPanels and setting > WidgetLeftRight and WidgetTopBottom. But I cannot figure out what > values make it centered for any particular inner contextPanel sizes: > > // “parent”, outer content panel, make it fill whole screen (page) > LayoutPanel outerContentPanel = new LayoutPanel(); > outerContentPanel.setStyleName("outerContextPanel"); > outerContentPanel.setHeight("100%"); > outerContentPanel.setWidth("100%"); > > // inner content panel > LayoutPanel contentPanel = new LayoutPanel(); > outerContentPanel.add(contentPanel); > contentPanel.setStyleName("contextPanel"); > contentPanel.setSize("300px", "300px"); > > // make it centered (????) > outerContentPanel.setWidgetLeftRight(contentPanel, 50, Unit.PCT, 0, > Unit.PCT); > outerContentPanel.setWidgetTopBottom(contentPanel, 50, Unit.PCT, 0, > Unit.PCT); > > // put some fancy content iside > HTML html = new HTML("<h1>Hello world centered!</h1>"); > contentPanel.add(html); > > // set as > RootLayoutPanel.get().add(outerContentPanel) > > As values I tried 50% from all directions sides, it makes central > contextPanel nicely centred but also invisible, clipped completely. > When I use 50% from top and left only, 0% from bottom and right, the > left top corner of the inner panel is centered, nice, but i need to > get centered by its center. > > I am out of my wits now > Any hints welcome > Thank you > Espinosa > -- You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscr...@googlegroups.com. To post to this group, send email to google-web-toolkit@googlegroups.com. Visit this group at http://groups.google.com/group/google-web-toolkit?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
