private void initLayout() {
FormLayout loginForm = new FormLayout();
loginForm.setSizeUndefined();
loginForm.addComponent(userName = new TextField("Username"));
loginForm.addComponent(passwordField = new PasswordField("Password"));
loginForm.addComponent(login = new Button("Login"));
login.addStyleName(ValoTheme.BUTTON_PRIMARY);
login.setDisableOnClick(true);
login.setClickShortcut(ShortcutAction.KeyCode.ENTER);
login.addClickListener(new Button.ClickListener() {
@Override
public void buttonClick(Button.ClickEvent event) {
login();
}
});
VerticalLayout loginLayout = new VerticalLayout();
loginLayout.setSizeUndefined();
loginLayout.addComponent(loginFailedLabel = new Label());
loginLayout.setComponentAlignment(loginFailedLabel, Alignment.BOTTOM_CENTER);
loginFailedLabel.setSizeUndefined();
loginFailedLabel.addStyleName(ValoTheme.LABEL_FAILURE);
loginFailedLabel.setVisible(false);
loginLayout.addComponent(loginForm);
loginLayout.setComponentAlignment(loginForm, Alignment.TOP_CENTER);
VerticalLayout rootLayout = new VerticalLayout(loginLayout);
rootLayout.setSizeFull();
rootLayout.setComponentAlignment(loginLayout, Alignment.MIDDLE_CENTER);
setCompositionRoot(rootLayout);
setSizeFull();
}
private com.vaadin.ui.Component buildLoginForm() {
final VerticalLayout loginPanel = new VerticalLayout();
loginPanel.setSizeUndefined();
loginPanel.setSpacing(true);
Responsive.makeResponsive(loginPanel);
loginPanel.addStyleName("login-panel");
loginPanel.addComponent(buildLabels());
loginPanel.addComponent(buildFields());
loginPanel.addComponent(new CheckBox("Remember me", true));
return loginPanel;
}
private Component buildProfileTab() {
HorizontalLayout root = new HorizontalLayout();
root.setCaption("Profile");
root.setIcon(FontAwesome.USER);
root.setWidth(100.0f, Unit.PERCENTAGE);
root.setSpacing(true);
root.setMargin(true);
root.addStyleName("profile-form");
VerticalLayout pic = new VerticalLayout();
pic.setSizeUndefined();
pic.setSpacing(true);
Image profilePic = new Image(null, new ThemeResource("img/profile-pic-300px.jpg"));
profilePic.setWidth(100.0f, Unit.PIXELS);
pic.addComponent(profilePic);
Button upload =
new Button(
"Change…",
event -> {
Notification.show("Not implemented in this demo");
});
upload.addStyleName(ValoTheme.BUTTON_TINY);
pic.addComponent(upload);
root.addComponent(pic);
FormLayout details = new FormLayout();
details.addStyleName(ValoTheme.FORMLAYOUT_LIGHT);
root.addComponent(details);
root.setExpandRatio(details, 1);
firstNameField = new TextField("First Name");
details.addComponent(firstNameField);
lastNameField = new TextField("Last Name");
details.addComponent(lastNameField);
titleField = new ComboBox("Title");
titleField.setInputPrompt("Please specify");
titleField.addItem("Mr.");
titleField.addItem("Mrs.");
titleField.addItem("Ms.");
titleField.setNewItemsAllowed(true);
details.addComponent(titleField);
sexField = new OptionGroup("Sex");
sexField.addItem(Boolean.FALSE);
sexField.setItemCaption(Boolean.FALSE, "Female");
sexField.addItem(Boolean.TRUE);
sexField.setItemCaption(Boolean.TRUE, "Male");
sexField.addStyleName("horizontal");
details.addComponent(sexField);
Label section = new Label("Contact Info");
section.addStyleName(ValoTheme.LABEL_H4);
section.addStyleName(ValoTheme.LABEL_COLORED);
details.addComponent(section);
emailField = new TextField("Email");
emailField.setWidth("100%");
emailField.setRequired(true);
emailField.setNullRepresentation("");
details.addComponent(emailField);
locationField = new TextField("Location");
locationField.setWidth("100%");
locationField.setNullRepresentation("");
locationField.setComponentError(new UserError("This address doesn't exist"));
details.addComponent(locationField);
phoneField = new TextField("Phone");
phoneField.setWidth("100%");
phoneField.setNullRepresentation("");
details.addComponent(phoneField);
newsletterField = new OptionalSelect<>();
newsletterField.addOption(0, "Daily");
newsletterField.addOption(1, "Weekly");
newsletterField.addOption(2, "Monthly");
details.addComponent(newsletterField);
section = new Label("Additional Info");
section.addStyleName(ValoTheme.LABEL_H4);
section.addStyleName(ValoTheme.LABEL_COLORED);
details.addComponent(section);
websiteField = new TextField("Website");
websiteField.setInputPrompt("http://");
websiteField.setWidth("100%");
websiteField.setNullRepresentation("");
details.addComponent(websiteField);
bioField = new TextArea("Bio");
bioField.setWidth("100%");
bioField.setRows(4);
bioField.setNullRepresentation("");
details.addComponent(bioField);
return root;
}