private Component buildFooter() { HorizontalLayout footer = new HorizontalLayout(); footer.addStyleName(ValoTheme.WINDOW_BOTTOM_TOOLBAR); footer.setWidth(100.0f, Unit.PERCENTAGE); Button ok = new Button("OK"); ok.addStyleName(ValoTheme.BUTTON_PRIMARY); ok.addClickListener( event -> { try { fieldGroup.commit(); // Updated user should also be persisted to database. But // not in this demo. Notification success = new Notification("Profile updated successfully"); success.setDelayMsec(2000); success.setStyleName("bar success small"); success.setPosition(Position.BOTTOM_CENTER); success.show(Page.getCurrent()); // DashboardEventBus.post(new ProfileUpdatedEvent()); close(); } catch (CommitException e) { Notification.show("Error while updating profile", Type.ERROR_MESSAGE); } }); ok.focus(); footer.addComponent(ok); footer.setComponentAlignment(ok, Alignment.TOP_RIGHT); return footer; }
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; }