Alignement

Necesito que el titulo y el boton esten a cada extremo de la pantalla. Pero no logro hacerlo.
El boton me queda muy proximo al titulo. Como en la foto.
El panel tiene setSizeUndefinied()

public void agregarTitulo(){
Label titulo;
titulo=null;

    HorizontalLayout headerLayout = new HorizontalLayout();
    headerLayout.setWidth("100%");        
    //headerLayout.setSizeUndefined();

    titulo = new Label("<h1>" + "Consola"+ "</h1>", Label.CONTENT_XHTML);
    //titulo.setWidth("85%");
    titulo.setValue("<em></em>" + titulo.getValue());
    titulo.setStyleName("root-section");
    headerLayout.addComponent(titulo);
        
    Button help = createHelpButton();
    //help.setWidth("15%");
    headerLayout.addComponent(help);
    
    headerLayout.setComponentAlignment(help, Alignment.MIDDLE_RIGHT);
    headerLayout.setComponentAlignment(titulo, Alignment.MIDDLE_LEFT);
    p.addComponent(headerLayout);
}

41005.png

quien es “p”? Tanto “p” como headerLayout tienen que tener width = 100%

que contiene

  titulo.setStyleName("root-section");

pero el detalle tambien esta en que estás agregando componentes con ancho %, o tamaño relativo, a un contenedor de tamaño indefinido como ese panel.

si das la medida en px al titulo, se separan los componentes?

titulo.setWidth("300px");