Javascript UI5添加/删除/更改响应拆分器拆分窗格
我正在尝试修改视图中的拆分窗格 我的观点是这样的:Javascript UI5添加/删除/更改响应拆分器拆分窗格,javascript,xml,sapui5,Javascript,Xml,Sapui5,我正在尝试修改视图中的拆分窗格 我的观点是这样的: <mvc:View controllerName="svm.controller.Controller" xmlns:l="sap.ui.layout" xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core" xmlns="sap.m"> <l:ResponsiveSplitter defaultPane="default
<mvc:View
controllerName="svm.controller.Controller"
xmlns:l="sap.ui.layout"
xmlns:mvc="sap.ui.core.mvc"
xmlns:core="sap.ui.core"
xmlns="sap.m">
<l:ResponsiveSplitter defaultPane="default" width="100%" height="100%">
<l:PaneContainer>
<l:SplitPane id="default" height="100%">
<Panel headerText="header">
</Panel>
</l:SplitPane>
<l:SplitPane height="100%">
<Panel headerText="header2">
</Panel>
</l:SplitPane>
</l:PaneContainer>
<l:ResponsiveSplitter>
</mvc:View>
我想做的第一件事是改变窗格的开始宽度。修改面板的大小很容易,但窗格不会更改为与其面板相同的宽度。将窗格设置为width=“20%”
和width=“80%”
不会移动拆分器开始的位置
我还希望我的一个窗格在应用程序启动时不在那里,并且基本上可以通过切换来添加和删除,包括它的面板和里面的所有内容
有没有一种方法可以用javascript或者最好是xml来做这些事情?这并不容易。你必须使用(这是实验性的) 将以下行添加到控制器的onInit()-函数:
var oSplitterLayoutData= new SplitterLayoutData({size: "30%"});
var oPane= this.byId("default");
oPane.setLayoutData(oSplitterLayoutData);
或在XML视图的面板中:
<mvc:View
controllerName="sap.ui.demo.basicTemplate.controller.App"
xmlns:l="sap.ui.layout"
xmlns:mvc="sap.ui.core.mvc"
xmlns:core="sap.ui.core"
xmlns="sap.m">
<l:ResponsiveSplitter defaultPane="default" width="100%" height="100%">
<l:PaneContainer>
<l:SplitPane id="default" height="100%">
<Panel headerText="header">
<layoutData><l:SplitterLayoutData size="30%" /></layoutData>
</Panel>
</l:SplitPane>
<l:SplitPane height="100%">
<Panel headerText="header2">
</Panel>
</l:SplitPane>
</l:PaneContainer>
</l:ResponsiveSplitter>
</mvc:View>