列之间的间距' ResponsiveGridLayout' (SAPUI5)

时间:2016-05-17 09:30:20

标签: styles sapui5 spacing responsive

如何缩短ResponsiveGridLayout的间距?在此图片中,我希望SearchFieldButton之间没有任何消息。我已经通过Google搜索并仔细查看了API,但我一无所获。

enter image description here

编辑:

                var oResponsiveLayout = new sap.ui.layout.form.ResponsiveGridLayout({

        columnsL : 3,
        columnsM : 3,
        columnS : 1
    });
    var oFormLayout = new sap.ui.layout.form.Form({
        layout : oResponsiveLayout,
        formContainers : [ new sap.ui.layout.form.FormContainer({
            formElements : [ new sap.ui.layout.form.FormElement({
                fields : [ this.oSearchField = new sap.ui.commons.SearchField({
                    width : "100%",
                    placeholder : "Suchtext / ID",
                    search : this._onSearchRequest.bind(this),
                    layoutData : new sap.ui.layout.GridData({
                        span : "XL9 L9 M6 S6"
                    })
                }) ]
            }) ]
        }), new sap.ui.layout.form.FormContainer({
            formElements : [ new sap.ui.layout.form.FormElement({
                fields : [ this.oArrowUp = new sap.ui.commons.Button({
                    layoutData : new sap.ui.layout.GridData({
                        span : "XL1 L1 M2 S2"
                    }),
                    width : "100%",
                    icon : "resources/images/arrow_up.png",
                    tooltip : new sap.ui.commons.RichTooltip({
                        text : "Vorheriges Element der Suche anzeigen"
                    }),
                    press : this._onSearchArrowUpRequest.bind(this)
                }), this.oArrowDown = new sap.ui.commons.Button({
                    layoutData : new sap.ui.layout.GridData({
                        span : "XL1 L1 M2 S2"
                    }),
                    width : "100%",
                    icon : "resources/images/arrow_down.png",
                    tooltip : new sap.ui.commons.RichTooltip({
                        text : "Nächstes Element der Suche anzeigen"
                    }),
                    press : this._onSearchArrowDownRequest.bind(this)
                }) ]
            }) ]
        }),

2 个答案:

答案 0 :(得分:1)

Here is the solution; you can add empty Label before SearchField and set the labelSpan(M/L/S) according to your need. It will also be responsive, so you are safe to use it.

答案 1 :(得分:1)

<强>类= “sapUiSmallMarginEnd”

在xml视图中使用SearchField中的上述类