Componentes Cerrables

Hola buenas

Quisiera saber si existe algun componente que se pueda cerrar por ejemplo algun internal frame o un Panel con la cruz en la esquina superior derecha algo asi. De momento solo he visto que el componente TabSheet tiene dicha opcion, pero lamentablemente no me sirve Adjunto una imagen de lo que necesito espero se entienda y que me puedan ayudar.

de antemano muchas gracias.
23331.jpg

Hola,

No conozco ningún componente específicamente para esto, pero podrías implementarlo tú mismo usando componentes como VerticalLayout, HorizontalLayout, Label, Button, e implementando la lógica para mostrar u ocular el contenido cuando con un click listener en el botón. Puedes encapsular todo esto en un CustomComponent.

Adjunto una captura de lo que podría ser el resultado (lo hice con Vaadin Designer, pero tú puedes hacerlo diréctamente en Java):
Este es sólo un diseño, no implementé la lógica para ocultar el contenido de los “panels”.

Espero te sirva. Saludos!
23332.png

Muchisimas gracias por la respuesta.

actualmente no puedo corroborar si me funciono o no ya que al tratar de agregar los componentes, me aparecen con un mensaje de error(adjunto la imagen)

por otro lado te dejo mi codigo donde agrego estos componentes

package com.ultragps.sentinel.ui.alertas;


import org.vaadin.teemu.VaadinIcons;

import com.vaadin.ui.Alignment;
import com.vaadin.ui.Button;
import com.vaadin.ui.ComboBox;
import com.vaadin.ui.CustomLayout;
import com.vaadin.ui.FormLayout;
import com.vaadin.ui.HorizontalLayout;
import com.vaadin.ui.Label;
import com.vaadin.ui.themes.ValoTheme;

public class AlertasDetencion extends CustomLayout
{
    private static final long serialVersionUID = 1962535920711206997L;
    
    private HorizontalLayout headerLay     = new HorizontalLayout();
    private FormLayout formulario        = new FormLayout();
    private Label tituloL                = new Label();
    private Button closeBT                = new Button();
    
    private ComboBox duracionCB            = new ComboBox();
    private ComboBox eventoCB            = new ComboBox();

    public AlertasDetencion()
    {
        init();        
    }

    private void init() 
    {        
        setHeader();            
        setContent();
        
        addComponents(headerLay,formulario);
        setSizeFull();
    }
    
    private void setHeader()
    {
        tituloL.setCaption("Detención");
        closeBT.setIcon(VaadinIcons.CLOSE);
        closeBT.setStyleName(ValoTheme.BUTTON_BORDERLESS);
        
        headerLay.addComponents(tituloL,closeBT);
        headerLay.setComponentAlignment(tituloL, Alignment.TOP_LEFT);
        headerLay.setComponentAlignment(closeBT, Alignment.TOP_RIGHT);
    }
    
    private void setContent()
    {        
        duracionCB.setCaption("Duracíon");
        eventoCB.setCaption("Evento");
        
        formulario.addComponents(duracionCB,eventoCB);        
    }        
}

invocacion de la clase

package com.ultragps.sentinel.ui.alertas;



import com.ultragps.sentinel.ui.SentinelUI;
import com.vaadin.ui.Button;
import com.vaadin.ui.MenuBar;
import com.vaadin.ui.UI;
import com.vaadin.ui.MenuBar.Command;
import com.vaadin.ui.MenuBar.MenuItem;
import com.vaadin.ui.VerticalLayout;
import com.vaadin.ui.Window;

public class AlertasCriteriosList extends VerticalLayout 
{
    private static final long serialVersionUID = 4929331798919925581L;
    
    private MenuBar criteriosMenu     = new MenuBar();
    private Command comando            = null;
    private MenuItem critList         = null;
    private MenuItem detOption        = null;
    

    public AlertasCriteriosList()
    {
        comandoListener();
        init();        
                                    
    }

    private void init() 
    {
        addComponent(criteriosMenu);
        
        critList = criteriosMenu.addItem("test", null,null);            
        detOption = critList.addItem("Detencion", comando);
        
    }
    
    private void comandoListener()
    {
        comando = new Command() 
        {    
            private static final long serialVersionUID = 5162606088176642988L;

            @Override
            public void menuSelected(MenuItem selectedItem) 
            {
                System.out.println("Name : " + selectedItem.getText());
                
                if(selectedItem.getText().equals("Detencion"))
                {
                    System.out.println("Test1");
                    addComponent(new VerticalLayout(new AlertasDetencion()));                    
                }                                
            }
        };    
    }
    
}

si tubieras alguna explicacion para esto, muy agradecido, de antemano muchisimas gracias.

¿Qué error obtienes?

segun lo que me mandaste tu la cabecera del customlayout no aparece(referente al label y al button)
y debajo de eso dice “Layout file not specified. Components will be drawn for debug purposes”

¿Ese error aparece en el designer o dónde?

te adjunto una imagen

es cuando agrego el custom a mis pagina
23405.jpg

Ok, ya entiendo.
CustomLayout
es usado para insertar
Component
s en una plantilla HTML. Creo que en tu caso no deseas esto, así que te recomendaría que usaras otro tipo de layout, por ejemplo
VerticalLayout
.

ok lo implementare y te cuento como me fue muchas gracias por tu tiempo y paciencia.

tengo una ultima pregunta, en base a tu primera respuesta, como consigo cerrar este componente creador por mi que vendria siendo como una suerte de ventana interna??

como puedo hacer un removecomponent si donde se ejecuta la accion es justamente el componente agregado???

En realidad depende de tu implementación. Todo lo que necesitas es una referencia al componente que continene las “ventanas”.

Te dejo una implementación de ejemplo, sin estilos ni ajustes de layout, pero no debería ser difícil adaptarlo para que luzca como requieres:

public class VerticalClosablePanels extends CustomComponent {

    private VerticalLayout layout = new VerticalLayout();

    public VerticalClosablePanels() {
        setCompositionRoot(layout);
    }

    public void addComponent(String caption, Component component) {
        ClosablePanel newPanel = new ClosablePanel(caption, component);
        newPanel.addCloseClickListener(e -> layout.removeComponent(newPanel));
        layout.addComponent(newPanel);
    }

    private class ClosablePanel extends CustomComponent {

        private Button closeButton;

        public ClosablePanel(String caption, Component content) {
            Label label = new Label(caption);

            closeButton = new Button(FontAwesome.TIMES);

            VerticalLayout contentLayout = new VerticalLayout(content);

            HorizontalLayout headerLayout = new HorizontalLayout(label, closeButton);
            headerLayout.setComponentAlignment(closeButton, Alignment.MIDDLE_RIGHT);

            VerticalLayout mainLayout = new VerticalLayout(headerLayout, contentLayout);
            setCompositionRoot(mainLayout);
        }

        public void addCloseClickListener(ClickListener listener) {
            closeButton.addClickListener(listener);
        }

    }

}

Con esta implementación, las clases cliente todo lo que requieren hacer es crear un nuevo
VerticalClosablePanels
y usar el método
addComponent
para agregar un nuevo panel cerrable.

Espero te sirva!

Me funciono, muchisimas gracias por todo, hasta pronto.