如何删除SmartFilterBar周围的边距?

时间:2018-10-01 06:10:15

标签: sapui5

我在SmartFilterBar内有SplitPane,看起来像这样:

enter image description here

,我想删除SmartFilterBar周围的空格。

该视图的代码:

<l:SplitPane requiredParentWidth="400" demandPane="true" id="default">
    <Panel height="100%">
        <smartFilterBar:SmartFilterBar id="smartFilterBar" entitySet="ZMM_C_CLASSIFICATION" search="_onSearch">
            <smartFilterBar:controlConfiguration>
                <smartFilterBar:ControlConfiguration key="ClassType" visibleInAdvancedArea="true" preventInitialDataFetchInValueHelpDialog="false"></smartFilterBar:ControlConfiguration>
                <smartFilterBar:ControlConfiguration key="ClassNum" visibleInAdvancedArea="true" preventInitialDataFetchInValueHelpDialog="false"></smartFilterBar:ControlConfiguration>
            </smartFilterBar:controlConfiguration>
        </smartFilterBar:SmartFilterBar>
        <Tree id="classTree" items="{path: 'Tree>/'}" toggleOpenState="onToggleOpenState">
            <CustomTreeItem>
                <FlexBox width="100%" alignItems="Center" justifyContent="SpaceBetween">
                    <items>
                        <Label text="{Tree>text}" wrapping="true"/>
                        <Button icon="sap-icon://display" type="Transparent" press="onItemPress"/>
                    </items>
                </FlexBox>
            </CustomTreeItem>
        </Tree>
    </Panel>
    <l:layoutData>
        <l:SplitterLayoutData size="30%"/>
    </l:layoutData>
</l:SplitPane>

更新

我也尝试过:

<l:SplitPane requiredParentWidth="400" demandPane="true" id="default">
    <l:content>
        <smartFilterBar:SmartFilterBar id="smartFilterBar" entitySet="ZMM_C_CLASSIFICATION" search="_onSearch">
            <smartFilterBar:controlConfiguration>
                <smartFilterBar:ControlConfiguration key="ClassType" visibleInAdvancedArea="true" preventInitialDataFetchInValueHelpDialog="false"></smartFilterBar:ControlConfiguration>
                <smartFilterBar:ControlConfiguration key="ClassNum" visibleInAdvancedArea="true" preventInitialDataFetchInValueHelpDialog="false"></smartFilterBar:ControlConfiguration>
            </smartFilterBar:controlConfiguration>
        </smartFilterBar:SmartFilterBar>
        <Tree id="classTree" items="{path: 'Tree>/'}" toggleOpenState="onToggleOpenState">
            <CustomTreeItem>
                <FlexBox width="100%" alignItems="Center" justifyContent="SpaceBetween">
                    <items>
                        <Label text="{Tree>text}" wrapping="true"/>
                        <Button icon="sap-icon://display" type="Transparent" press="onItemPress"/>
                    </items>
                </FlexBox>
            </CustomTreeItem>
        </Tree>
    </l:content>
    <l:layoutData>
        <l:SplitterLayoutData size="30%"/>
    </l:layoutData>
</l:SplitPane>

然后控件消失: enter image description here

2 个答案:

答案 0 :(得分:0)

您可以通过指定类使用SAP UI5类在控件上实现此目的

根据需要,可以选择边距或填充。

sapUiNoContentPadding或sapUiNoMargin

填充: https://help.sap.com/saphelp_uiaddon10/helpdata/en/c7/1f6df62dae47ca8284310a6f5fc80a/frameset.htm

保证金: https://help.sap.com/saphelp_uiaddon10/helpdata/en/77/7168ffe8324873973151dae2356d1c/frameset.htm

您可以在下面的示例中指定

abstract class ReportScheduleEvent extends ApplicationEvent { ... }

public class IncomingReportCompletionEvent
        extends ReportScheduleEvent {

    private final int eventsToExpect;
    // ...
}

public class ReportCompletionEvent extends ReportSchedulingEvent {
    // ...
}

public class YourListener
    implements ApplicationListener<ReportSchedulingEvent> {

    private final DatabaseWriter dbWriter;
    private volatile int expectedEvents = 0;

    public void onApplicationEvent(final ReportSchedulingEvent event) {
        if (event instanceof IncomingReportCompletionEvent) {
            this.expectedEvents = 
                    ((IncomingReportCompletionEvent) event)
                    .getExpectedEventCount();
        } else {
            this.expectedEvents--;
            if (this.expectedEvents == 0) {
                this.dbWriter.doYourThing();
            }
        }
    }
}

答案 1 :(得分:0)

希望这对您有所帮助,根据新版本(1.56.8),您需要删除sapUiCompFilterBarNonPhone类,该类将填充添加到过滤器栏中。删除UI5生成的类,然后添加sapUiTinyMargin类,以使过滤器栏周围有一些空白。

您可以使用以下代码来实现。

var oFilterBar = sap.ui.getCore().byId("YourFilterBarId");//Update your filter Bar ID
if (oFilterBar)      
 oFilterBar.removeStyleClass("sapUiCompFilterBarNonPhone").addStyleClass("sapUiTinyMargin");