Search code examples
smartgwtdynamicform

Align DynamicForm Horizontally to the Center of VLayout


Is there any possible way to align horizontally a DynamicForm to the center of a VLayout? I've tried what is done in this showcase demo, but it won't work for the form (it does work correctly for the IButton).

Here is my code:

public class PreferencesStackSection extends SectionStackSection {

    private static final String SAVE_ICON = "icons/save.png";
    private static final int COMPONENT_GAP = 10;

    // Object used to get access to internationalization constants and messages
    private BMSimulatorConstants constants = GWT.create(BMSimulatorConstants.class);

    private DataSource ds;
    private DynamicForm form;
    private IButton saveBtn;

    public PreferencesStackSection(String title) {
        super(title);
        ds = DataSource.get("preferences");
        buildPreferencesLayout();
    }


    private void buildPreferencesLayout() {
        VLayout layout = new VLayout(COMPONENT_GAP);
        layout.setMargin(COMPONENT_GAP * 2);
        layout.setDefaultLayoutAlign(Alignment.CENTER);
        createPreferencesForm(layout);
        createSaveButton(layout);
        this.addItem(layout);
    }

    private void createPreferencesForm(VLayout layout) {
        form = new DynamicForm();
        form.setNumCols(1);
        form.setTitleOrientation(TitleOrientation.TOP);
        form.setDataSource(ds);
        layout.addMember(form);
    }

    private void createSaveButton(VLayout layout) {

        saveBtn = new IButton(constants.preferencesSaveButton());
        saveBtn.setIcon(SAVE_ICON);
        saveBtn.addClickHandler(new ClickHandler() {
            public void onClick(ClickEvent event) {

                DSCallback callback = new DSCallback() {
                    public void execute(DSResponse response, Object rawData, DSRequest request){
                        SC.say(constants.preferencesSavedOK());
                    }
                };

                form.saveData(callback);
            }
        });
        layout.addMember(saveBtn);
    }
}

Solution

  • This solved the problem (the order of the lines is really important for it to work):

    private void createPreferencesForm(VLayout layout) {
        form = new DynamicForm();
        form.setDataSource(ds);
        form.setNumCols(1);
        form.setTitleOrientation(TitleOrientation.TOP);
        layout.addMember(form);
        form.setWidth("70%");
        for(FormItem item: form.getFields()){
            item.setWidth("*");
        }
    }