Vaadin：带有表单的自定义布局[文本字段标题和必填指示符]

如何解决Vaadin：带有表单的自定义布局[文本字段标题和必填指示符]

|| 我们正在开发一些Form，但是在Vaadin Forms中使用CustomLayout。我们在HTML中使用了“字段标签”，但想隐藏TextField标题。还希望在文本字段的左侧设置必填属性。 图形设计师和开发人员之间的任务是分开的，因此自定义布局对我们来说很方便，因此我们现在不能使用任何其他布局。 目前，我的测试屏幕如下：[仅在表单中添加了两个字段用于自定义布局] 如您所见，“ hello”标题位于文本框的顶部，我想将其完全删除。该标题仅用于说明目的，否则我将其设为空，但表中仍然有空间。我也想使所需的指示器与文本框对齐。 我做了一个Form Field工厂，尝试了很多选择，但是没有运气。 如果需要任何特定的CSS更改，请明确告诉我如何添加它，因为我是CSS新手。根据论坛的先前讨论，我在TextField中添加了以下样式，但没有任何成功，

myLabel.setStyleName(\"inline\");

并使用CSS：

.inline,.inline div { display: inline; }

[我的情况是将其添加到TextField对象中}     

解决方法

        \“也要在文本字段的左侧设置必填属性\”，如果要使必填字段为必填项，则应为其设置属性.setRequired（true）;。 如果要手动处理表单中所有元素的位置，则应执行以下操作：

public class YourFormextends Form{

private YourForm() {

        setImmediate(true);
        setValidationVisible(false);
        setValidationVisibleOnCommit(false);
        setValidationVisible(false);
        setValidationVisibleOnCommit(false);
        setWriteThrough(false);

        VerticalLayout formLayout = createFormLayout();
        setLayout(formLayout);

        setFormFieldFactory(yourFormFieldFactory());
    }

public static VerticalLayout createFormLayout() {
        final VerticalLayout layout = new VerticalLayout();
        layout.setMargin(true);

        final VerticalLayout formErrorLayout = new VerticalLayout();
        final VerticalLayout formFieldLayout = formFieldLayout();

        layout.addComponent(formErrorLayout,CREATE_FORM_ERROR_LAYOUT_INDEX);
        layout.addComponent(formFieldLayout,CREATE_FORM_FIELD_LAYOUT_INDEX);

        return layout;
    }

    private static VerticalLayout formFieldLayout() {
        VerticalLayout rootLayout = new VerticalLayout();
        rootLayout.setSpacing(true);
        rootLayout.setMargin(false,false,true,false);
        GridLayout layout = new GridLayout();

        layout.setRows(1);
        layout.setColumns(3);

        rootLayout.addComponent(layout);

        return rootLayout;

    }

private FormFieldFactory activityFormFieldFactory() {
    FormFieldFactory factory = new FormFieldFactory() {

        private static final long serialVersionUID = 1L;

        @SuppressWarnings(\"unchecked\")
        @Override
        public Field createField(Item item,Object propertyId,Component uiContext) {
            String fieldName = (String) propertyId;
            if (fieldName.equals(FIELD_NAME_HELLO)) {

                if (EDIT_MODE) {
                    TextField textField = new TextField(FIELD_NAME_HELLO);
                    textField.setRequired(true);
                    return textField;
                }
            }
        }
    }

@Override
protected void attachField(Object propertyId,Field field) {
    String fieldName = (String) propertyId;

    VerticalLayout formFieldLayout = getFormFieldLayout();

        if (fieldName.equals(FIELD_NAME_HELLO)) {
            GridLayout layout = (GridLayout) formFieldLayout.getComponent(0);
            layout.addComponent(fieldCaption,0);
            layout.addComponent(field,1,0);
layout.addComponent(fieldDescription,2,0);
        }
}
}


}