OpenUI5控制不可见

我试图获得unified split containers工作一个小例子，但下面的截图说明我的问题非常好：OpenUI5控制不可见

正如你所看到的，按钮呈现，但由于某种原因不可见。你能帮我找到原因吗？

这是我index.html文件：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <meta charset="UTF-8"> 
    <title>App 0001</title> 
    <script 
     id="sap-ui-bootstrap" 
     src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" 
     data-sap-ui-theme="sap_bluecrystal" 
     data-sap-ui-libs="sap.m, sap.ui.commons, sap.ui.core, sap.ui.table" 
     data-sap-ui-resourceroots='{ "x4": "/example4/x4" }' > 
    </script> 
    <script> 
    //var myView = sap.ui.jsview("x4") 
    var myView = sap.ui.xmlview("x4") 
    myView.placeAt('content'); 
    </script> 
</head> 
<body class="sapUiBody"> 
    <div id="content"></div> 
</body> 
</html>

这是视图（x4.view.xml）按上openui5的show code page探索

<mvc:View 
    controllerName="x4" 
    xmlns:u="sap.ui.unified" 
    xmlns:mvc="sap.ui.core.mvc" 
    xmlns="sap.m" 
    class="fullHeight"> 
    <u:SplitContainer 
     id="mySplitContainer" 
     showSecondaryContent="true"> 
     <u:secondaryContent> 
     <Text text="Hello World!" /> 
     </u:secondaryContent> 
     <u:content> 
     <Button text="Toggle Secondary Content" /> 
     <Button text="Switch SplitContainer Orientation" /> 
     </u:content> 
    </u:SplitContainer> 
</mvc:View>

和这个（最小）x4.controller.js

sap.ui.controller("x4", {});

The Firebug err或控制台看起来干净，这个错误似乎是独立于浏览器，与IE浏览器我们观察到相同的行为。

来源

2014-11-04 niklasfi

不要直接将视图添加到div。将其包裹在应用程序中。

<script> 
     var oApp = new sap.m.App(); 
     var myView = sap.ui.xmlview("x4") 
     oApp.addPage(myView); 
     oApp.placeAt('content'); 
</script>

来源

2014-11-04 10:38:33 sakthi

的问题是，默认情况下SplitContainer中使用100％的高度，但其母公司，查看，没有定义的高度（它可以适应它的内容），所以有典型的CSS高度捷径其中高度崩溃归零。最重要的是，SplitContainer隐藏了任何溢出的内容，所以Button（和其他）不可见，即使它存在。

任何解决方案都需要确保视图具有定义的高度。一个简单的解决方案是分配一个绝对高度（例如以像素为单位），一个更好的可以设置100％的高度，但是所有的父母高度也需要设置为100％（或绝对值），所以CSS

html, body, #content { 
    height: 100%; 
    margin: 0; // body has usually a margin in browsers 
}

需要使视图工作达到100％的高度。

提示：displayBlock="true"应在100％高度情况下的视图上设置，否则默认显示（内嵌块）会在基线以下增加4或5个像素，从而导致滚动条。

来源

2014-11-07 09:46:43 akudev

OpenUI5控制不可见

回答

相关问题