GWT: cómo distribuir componentes horizontalmente en un FlowPanel?

Question

La documentación de GWT recommends utilizando un FlowPanel (flotante: conjunto izquierdo en sus elementos secundarios) como reemplazo del HorizontalPanel para los componentes de diseño. pero como hacer esto?

Answer 1

lo dice la derecha en la documentación:

ya utilizar el float: left; Propiedad de CSS en sus hijos.

Cómo establecer un estilo de widget de GWT:

widget.getElement().getStyle().setProperty("float", "left"); 

Answer 2

evitar el uso de HorizontalPanel utilizo el siguiente código donde sea posible:

FlowPanel panel = new FlowPanel() { 
    @Override 
    public void add(Widget child) { 
     super.add(child); 
     child.getElement().getStyle().setDisplay(Display.INLINE_BLOCK); 
    } 
}; 

Y utilizando un UiBinder que hago algo así como:

<ui:UiBinder ...> 
    <ui:style> 
     .vertical > * { 
      display: inline-block; 
     } 
    </ui:style> 

    <g:FlowPanel styleName="{style.vertical}"> 
     ... 
    </g:FlowPanel> 
</ui:UiBinder> 

O puede sustituir todas las referencias HorizontalPanel por esta clase HorizontalFlowPanel:

public class HorizontalFlowPanel extends FlowPanel { 
    private static final String BASIC_CLASS_NAME = "___" + Math.abs(Random.nextInt()); 
    private static final String HORIZONTAL_CLASS_NAME = BASIC_CLASS_NAME + "_H_"; 
    private static final String VERTICAL_CLASS_NAME = BASIC_CLASS_NAME + "_V_"; 

    static { 
     newCssClass(HORIZONTAL_CLASS_NAME + " > *", "display: inline-block; vertical-align: top;"); 
     newCssClass(VERTICAL_CLASS_NAME + " > *", "display: block;"); 
    } 

    private static int count = 0; 

    private final String myClassName = BASIC_CLASS_NAME + count++; 

    public HorizontalFlowPanel() { 
     super(); 
     setStylePrimaryName(HORIZONTAL_CLASS_NAME + " " + myClassName); 
    } 

    public void setSpacing(int spacing) { 
     newCssClass(myClassName + " > *", "margin-bottom: " + spacing + "px; margin-right: " + spacing + "px;"); 
    } 

    public void setPadding(int padding) { 
     newCssClass(myClassName, "padding: " + padding + "px;"); 
    } 

    public static void newCssClass(String className, String content) { 
     StringBuilder builder = new StringBuilder(); 
     builder.append("." + className + " { " + content + " }\n"); 

     Element style = DOM.createElement("style"); 
     style.setAttribute("type", "text/css"); 
     style.setInnerHTML(builder.toString()); 

     Document.get().getHead().appendChild(style); 
    } 
}