Saturday, April 21, 2018

Re: DeckLayoutPanel not displaying below banner

See http://www.gwtproject.org/doc/latest/DevGuideUiPanels.html#Resize
Layout panels are sized from the outside-in; your DeckLayoutPanel needs to be given explicit dimensions.
Alternatively, replace your HTMLPanel and FlowPanel with layout panels (e.g. a HeaderPanel) and add it to the RootLayoutPanel (rather than the LayoutPanel). If your UiBinder is used in a composite widget, make sure it extends ResizeComposite rather than Composite.

On Thursday, April 19, 2018 at 9:27:56 PM UTC+2, Patrick May wrote:
I have a simple GWT app with a top level UI configured in UiBinder like this:

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> <ui:UiBinder xmlns:ui = 'urn:ui:com.google.gwt.uibinder' xmlns:g = 'urn:import:com.google.gwt.user.client.ui'> <g:HTMLPanel> <g:FlowPanel ui:field="mainApplicationWidget" styleName="main-panel"> <g:HTMLPanel> <div class="banner"> <div class="banner-text-left"> <h3>Some H3 Text</h3> <h2>Some H2 Text</h2> </div> </div> </g:HTMLPanel> <g:DeckLayoutPanel ui:field="deckLayoutPanel" styleName="main-deck"> </g:DeckLayoutPanel> </g:FlowPanel> </g:HTMLPanel> </ui:UiBinder>
 

The CSS is:


.banner { float: left; width: 100%; background-image: url("images/blue-banner.jpg"); background-size: 100%; } .banner h2 { font-size: 60px; font-family: "Helvetica Neue", "Arial", "Helvetica"; font-weight: 700; color: #fff; text-shadow: 3px 3px 3px #000; margin-top: 3px; text-align: right; } .banner h3 { font-family: "Helvetica Neue", "Arial", "Helvetica"; margin: 20px 0px 0px 0px; color: #fff; font-size: 30px; text-align: right; } .banner-text-left { float: left; text-align: left; margin-left: 20px; } .main-deck { width: 100%; }
 

The code inserts this simple panel into the DeckLayoutView:


<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> <ui:UiBinder xmlns:ui = 'urn:ui:com.google.gwt.uibinder' xmlns:g = 'urn:import:com.google.gwt.user.client.ui'> <g:HTMLPanel> <center> <h1>Test Placeholder</h1> <g:Label ui:field="testLabel" text="Test"/> </center> </g:HTMLPanel> </ui:UiBinder>
 

When I run the app in devmode, I see the banner and the two text strings, but no DeckLayoutView. How do I get that to appear?


--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at https://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

No comments:

Post a Comment