我想在一个布局中为SAPUI5移动应用程序放置两个按钮

时间:2014-05-06 05:34:28

标签: sapui5

我是SAPUI5的新手。我能够在我的SAPUI5移动应用程序中创建控件。但是我无法在布局中设置它们。我正在将我的视图编写为HTML页面并将控件添加到该页面。我已经尝试将它们放在一个分区中,但我不知道指定layout的属性是什么。请指导布局。

由于

<template data-controller-name="sample.controllers.index">
<div data-sap-ui-type="sap.m.Page" data-title="Title">
    <div data-sap-ui-aggregation="content">
    <div data-sap-ui-type="sap.m.Layout" data-type="vertical">
        <div data-sap-ui-type="sap.m.Input"  data-width="20%"
id="Textfield" data-placeholder="User" data-max-length="10"></div><br>
        <div data-sap-ui-type="sap.m.Input"  data-width="20%" id="Textfield2" data-placeholder="Password" data-type="Password"></div><br>
        <div data-sap-ui-type="sap.m.TextArea" data-width="30%" id="textarea" data-placeholder="Text for information..."></div>
    </div>
        <div data-sap-ui-type="sap.m.Button" id="btn1" data-text="My Button1" data-press="doIt"></div>
        <div data-sap-ui-type="sap.m.Button" id="btn2" data-text="My Button2" data-press="doIt"></div>
        <div data-sap-ui-type="sap.m.Label" data-text="I'm Label" data-width="100px" data-height="100px" data-background-colour="orange"></div>
    </div>
</div>

这是我的示例代码,当我在浏览器上运行它时,它会显示一条错误消息

  

未捕获错误:无法从resources / sap / m / Layout.js加载'sap / m / Layout.js':404 - 未找到

这是我的index.html

`

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>

        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.m"
                data-sap-ui-theme="sap_bluecrystal">
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

        <script>
                sap.ui.localResources("sample");
                var app = new sap.m.App({initialPage:"idindex1"});
                var page = sap.ui.view({id:"idindex1", viewName:"sample.views.index", type:sap.ui.core.mvc.ViewType.HTML});
                app.addPage(page);
                app.placeAt("content");
        </script>

    </head>
    <body class="sapUiBody" role="application">
            <div id="content"></div>
    </body>
</html>`

1 个答案:

答案 0 :(得分:0)

 <div data-sap-ui-type="sap.m.Layout" data-type="vertical"> 

没有像sap.m.Layout这样的控件。对于布局,您可以从sap.ui.layout控件中选择任意一个,例如sap.ui.layout.Grid