是否可以在 UI5 的拆分面板中有 2 个导航容器?
Is it possible to have 2 NavContainers in a splitted panel in UI5?
在拆分面板中是否可以有两个NavContainer?
我试过如下所示,但没有显示子视图中的任何内容,只有两边都是空的拆分面板。错误日志什么也没说。
当我将第一个 NavContainer 作为页面元素的内容标记中的第一个元素时,将呈现第一个容器的视图。 (查看视图定义中的注释行)
<mvc:View
controllerName="my.controller.parent"
xmlns="sap.m"
..
id="splittedContainers" xmlns:m="sap.m">
<Page id="myPage" class="sapUiSizeCompact sapUiTinyMargin" title="myTitle">
<!-- Putting the NavContainer here seems to work -->**
<content class="sapUiSizeCompact sapUiTinyMargin">
<Panel class="sapUiSizeCompact sapUiTinyMargin">
<content>
<l:Splitter orientation="Horizontal">
<l:contentAreas>
<Panel width="100%">
<layoutData>
<l:SplitterLayoutData size="auto" />
</layoutData>
<NavContainer id="childNav1">
<pages>
</pages>
</NavContainer>
</Panel>
<Panel>
<layoutData>
<l:SplitterLayoutData size="300px" />
</layoutData>
<NavContainer id="childNav2">
<pages>
</pages>
</NavContainer>
</Panel>
</l:contentAreas>
</l:Splitter>
</content>
</Panel>
</content>
</Page>
</mvc:View>
manifest.json:
..
"routes": {
"rBoth": {
"pattern": "both",
"target": "parentTarget"
},
"rChild1": {
"pattern": "both/first",
"target": "tChild1"
},
"rChild2": {
"pattern": "both/second",
"target": "tChild2"
}
..
..
"targets": {
"parentTarget": {
"viewPath": "my.view",
"viewName": "SplitParentView",
"parent": "firstLvlTarget",
"controlId": "pageContainer",
"controlAggregation": "pages",
"transition": "flip",
"viewLevel": 2
},
"tChild1": {
"viewPath": "my.view.childs",
"viewName": "ChildView1",
"parent": "parentTarget",
"controlId": "childNav1",
"controlAggregation": "pages",
"transition": "flip",
"viewLevel": 3
},
"tChild2": {
"viewPath": "my.view.childs",
"viewName": "ChildView2",
"parent": "parentTarget",
"controlId": "childNav2",
"controlAggregation": "pages",
"transition": "flip",
"viewLevel": 3
},
..
你想通过这个达到什么目的?
大多数屏幕的宽度都大于高度,因此 FlexibleColumnLayout 在大多数情况下都有帮助。
NavContainer 有一个 pages-Aggregation。
These can be of type sap.m.Page, sap.ui.core.View, sap.m.Carousel or
any other control with fullscreen/page semantics."
我认为 Panels 不适合此类控件。
如果您只想水平拆分,可以将 ObjectPage 与 Sections and Subsections
一起使用
在拆分面板中是否可以有两个NavContainer?
我试过如下所示,但没有显示子视图中的任何内容,只有两边都是空的拆分面板。错误日志什么也没说。
当我将第一个 NavContainer 作为页面元素的内容标记中的第一个元素时,将呈现第一个容器的视图。 (查看视图定义中的注释行)
<mvc:View
controllerName="my.controller.parent"
xmlns="sap.m"
..
id="splittedContainers" xmlns:m="sap.m">
<Page id="myPage" class="sapUiSizeCompact sapUiTinyMargin" title="myTitle">
<!-- Putting the NavContainer here seems to work -->**
<content class="sapUiSizeCompact sapUiTinyMargin">
<Panel class="sapUiSizeCompact sapUiTinyMargin">
<content>
<l:Splitter orientation="Horizontal">
<l:contentAreas>
<Panel width="100%">
<layoutData>
<l:SplitterLayoutData size="auto" />
</layoutData>
<NavContainer id="childNav1">
<pages>
</pages>
</NavContainer>
</Panel>
<Panel>
<layoutData>
<l:SplitterLayoutData size="300px" />
</layoutData>
<NavContainer id="childNav2">
<pages>
</pages>
</NavContainer>
</Panel>
</l:contentAreas>
</l:Splitter>
</content>
</Panel>
</content>
</Page>
</mvc:View>
manifest.json:
..
"routes": {
"rBoth": {
"pattern": "both",
"target": "parentTarget"
},
"rChild1": {
"pattern": "both/first",
"target": "tChild1"
},
"rChild2": {
"pattern": "both/second",
"target": "tChild2"
}
..
..
"targets": {
"parentTarget": {
"viewPath": "my.view",
"viewName": "SplitParentView",
"parent": "firstLvlTarget",
"controlId": "pageContainer",
"controlAggregation": "pages",
"transition": "flip",
"viewLevel": 2
},
"tChild1": {
"viewPath": "my.view.childs",
"viewName": "ChildView1",
"parent": "parentTarget",
"controlId": "childNav1",
"controlAggregation": "pages",
"transition": "flip",
"viewLevel": 3
},
"tChild2": {
"viewPath": "my.view.childs",
"viewName": "ChildView2",
"parent": "parentTarget",
"controlId": "childNav2",
"controlAggregation": "pages",
"transition": "flip",
"viewLevel": 3
},
..
你想通过这个达到什么目的? 大多数屏幕的宽度都大于高度,因此 FlexibleColumnLayout 在大多数情况下都有帮助。
NavContainer 有一个 pages-Aggregation。
These can be of type sap.m.Page, sap.ui.core.View, sap.m.Carousel or any other control with fullscreen/page semantics."
我认为 Panels 不适合此类控件。
如果您只想水平拆分,可以将 ObjectPage 与 Sections and Subsections
一起使用