Question

为什么无法将SplitApp容器添加为ICONTab Bar的聚合。我试图在ICONTAB Bar下添加splitApp，它正在运行。但它不适用于SplitApp Container。

<mvc:View controllerName="com.sap.controller.Main" 
xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" 
xmlns="sap.m">
<App>
<pages>
<Page title="{i18n>title}">
<content>
<IconTabBar id="idIconTabBar" select="handleIconTabBarSelect" 
class="sapUiResponsiveContentPadding">
<items>
<IconTabFilter>
<content></content>
</IconTabFilter>
<IconTabFilter>
<content>
<SplitApp id="SplitContDemo1" initialDetail="detail" initialMaster="master">
<detailPages>
<Page id="detail" title="Detail 1" class="sapUiStdPage">
<content>
<Label text="Detail page 1"/>
<Button text="Go to Detail page2" press="onPressNavToDetail"/>
</content>
</Page>
</detailPages>
<masterPages>
<Page id="master" title="Master 1" icon="sap-icon://action" 
class="sapUiStdPage">
<content>
<List>
<items>
<StandardListItem title="To Master2" type="Navigation" 
press="onPressGoToMaster"/>
</items>
</List>
</content>
</Page>
</masterPages>
</SplitApp>
</content>
</IconTabFilter>
</items>
</IconTabBar>
<SplitContainer id="SplitContDemo">
<detailPages>
<Button text="Detailed Button"/>
</detailPages>
<masterPages>
<Button text="Master Button"/>
</masterPages>
</SplitContainer>
</content>
</Page>
</pages>
</App>
</mvc:View>

此致 MS

Answer 1

目前尚不清楚您的问题究竟是什么。您可以将任何内容放在content的{{1}}聚合中。在IconTabFilter的{{1}}聚合中，您只能放置items和IconTabBar。

我已经检查了你的例子，并通过将Split Container放入IconTabFilter：https://jsfiddle.net/enykp4h8/1/来使其工作。

IconTabFilters

后期更新：

如果你将SplitContainer单独放在IconTabBar中，它似乎不起作用，因为标签的内容高度为0。这是因为SplitContainer的高度为其父元素的100％，而制表符的高度是根据其子元素的高度确定的（因此它们在某种程度上是相互依赖的）。

要解决此问题，您可以使用一些自定义CSS为容器提供固定高度，也可以让IconTabBar伸展到其父级的高度（使用stretchContentHeight）：

CSS Solution:

IconTabSeparators

 <IconTabFilter text="Split Container">
    <SplitContainer id="SplitContDemo">
        <detailPages>
           <Button text="Detailed Button" />
         </detailPages>
         <masterPages>
           <Button text="Master Button" />
         </masterPages>
    </SplitContainer>
 </IconTabFilter>

Stretch Content Solution：

.fixContHeight.sapMSplitContainer {
    height: 300px
}

ICONTAB Bar下的SplitApp容器

1 个答案:

后期更新：