Personalizar un Login

Other Languages Discusión en español (Discussion in Spanish)
1

Saludos a todos desde aca de Chile, empeze a usar vaadim hace dos dias aproximadamente… pero tengo la siguiente duda, como puedo ordenar los componentes en vaadim (botones,jtextfield,etc) ya que todo que da muy desordenado en la pagina darles propiedades altura,orden y todo eso
¿Me explico? , cualquier aporte es agradecido de ante mano.

2

hola, todo se debe manejar desde los layouts que posee vaadin, te dejo el aparte del book que presenta vaadin, le adelanto que posee varios tupos, como el VerticalLayout, HorizontalLAyout, GirdLayoud entre muchos mas, debera leer el book, hay encontrara las propiedades de cada uno.

https://vaadin.com/book/-/page/layout.html

saludos

3

Hola Nicolas, te dejo un ejemplo que te puede servir.

public class MainUI extends UI {

    @Override
    protected void init(VaadinRequest vaadinRequest) {
 
        Navigator navigator = new Navigator(this, this);
        navigator.addView("", LoginDiv.class);
    }

    @WebServlet(urlPatterns = "/*", name = "MainServlet", asyncSupported = true)
    @VaadinServletConfiguration(ui = MainUI.class, productionMode = false)
    public static class MainServlet extends VaadinServlet {
    }
}

Formulario de login simple.

public class LoginDiv extends VerticalLayout implements View {

    private FormLayout form;
    private TextField textLogin;
    private TextField textPass;
    private Button buttonLogin;

    public LoginDiv() {
        initComponents();
        initValues();
    }

    private void initComponents() {
        setWidth("100%");
        setHeight("500px");

        Panel panel = new Panel("Login");
        form = new FormLayout();
        textLogin = new TextField("Usuario");
        textPass = new TextField("Password");
        buttonLogin = new Button("Enviar");

        textLogin.setWidth("100%");
        textPass.setWidth("100%");
        
        form.setMargin(true);
        form.addComponent(textLogin);
        form.addComponent(textPass);
        form.addComponent(buttonLogin);
        
        panel.setWidth("350px");
        panel.setContent(form);
        
        addComponent(panel);
        setComponentAlignment(panel, Alignment.MIDDLE_CENTER);
    }

    private void initValues() {
        this.buttonLogin.addClickListener(new Button.ClickListener() {

            @Override
            public void buttonClick(Button.ClickEvent event) {
                // Autentificar y navegar a la vista principal
                // UI.getCurrent().getNavigator().navigateTo("home");
                Notification.show("Login", "usuario logeandose", Notification.Type.TRAY_NOTIFICATION);
            }
        });
    }

    @Override
    public void enter(ViewChangeListener.ViewChangeEvent event) {
    }
}

Saludos tambien desde Chile :smiley:

4

Gracias!!!
a todos por su ayuda ya pude lograr lo que es un login simple y conectarlo a base de datos via hibernate con eclipse… ahora me piden realizar sesiones posterior al logeo es primera vez que hago esto y soy algo inexperto en el tema.