Extended Login Add-on
Vaadin Login component extension providing additional features
This add-on extends the Vaadin Login component adding new features.
Features
- Adds a LoginLayout that allows to create views with the same layout as the LoginOverlay
- Adds an extended LoginOverlay that allows to customize the appearance with more features than the base version
Sample code
@Route("value = "extended-login/login-layout-demo", layout = ExtendedLoginDemoView.class) public class TestLoginLayoutView extends Div { public TestLoginLayoutView() { add(createChangePasswordForm()); } private FormLayout createChangePasswordForm() { TextField username = new TextField("Username"); username.setEnabled(false); PasswordField password = new PasswordField("Password"); PasswordField confirmPassword = new PasswordField("Confirm password"); Button accept = new Button("Accept", ev -> Notification.show("Password changed.")); FormLayout formLayout = new FormLayout(); formLayout.add(username, password, confirmPassword, accept); formLayout.setResponsiveSteps( // Use one column by default new ResponsiveStep("0", 1), // Use two columns, if layout's width exceeds 500px new ResponsiveStep("500px", 2)); // Stretch the username field over 2 columns formLayout.setColspan(username, 2); formLayout.setColspan(accept, 2); return formLayout; } }
ExtendedLoginOverlay elo = new ExtendedLoginOverlay(); elo.replaceFormComponents( new TextField("Email", "someone@company.com"), new ComboBox<String>("Branch", Arrays.asList("Santa Fe", "Rosario")), new PasswordField("Password"), new Button("Sign In", ev -> Notification.show("Login successfull"))); Image image = new Image("/img/LogoChicoGlow.png", "Login image"); image.setClassName("logo-image"); image.setWidth("fit-content"); image.setHeight("fit-content"); elo.replaceHeaderComponent(image); elo.replaceForgotPassword(new Anchor("https://www.flowingcode.com", "Flowing Code Site")); elo.setOpened(true);
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Version available from maven central repository.
- Released
- 2023-09-11
- Maturity
- TESTED
- License
- Apache License 2.0
Compatibility
- Framework
- Vaadin 24
- Vaadin 24+ in 1.0.0
- Browser
- Firefox
- Safari
- Google Chrome
- Android Browser
- Microsoft Edge
Extended Login Add-on - Vaadin Add-on Directory
Vaadin Login component extension providing additional featuresThis add-on extends the Vaadin Login component adding new features.
## Features
* Adds a LoginLayout that allows to create views with the same layout as the LoginOverlay
* Adds an extended LoginOverlay that allows to customize the appearance with more features than the base version