您现在的位置:首页 >> 前端 >> 内容

sapui5shell调用app,app可导航

时间:2017/1/9 9:48:12 点击:

  核心提示:第一步:在index.html 中构造app, pages, shell第二步:在shell controller js代码中 onInit方法中addContent(app)第一步代码:sap.ui...

第一步:在index.html 中构造app, pages, shell

第二步:在shell controller js代码中 onInit方法中addContent(app)

第一步代码:

sap.ui.localResources("mobile");

var app = new sap.m.App({initialPage:"idpage2"});
var page1 = sap.ui.view({id: "idpage1", viewName:"mobile.page1", type:sap.ui.core.mvc.ViewType.XML});
var page2 = sap.ui.view({id: "idpage2", viewName:"mobile.page2", type:sap.ui.core.mvc.ViewType.XML});
app.addPage(page1);
app.addPage(page2);


var shell = sap.ui.view({id:"idshell", viewName:"mobile.ShellView", type:sap.ui.core.mvc.ViewType.XML});

shell.placeAt("content");

第二步代码:

    onInit: function() {

            this.getView().byId("myShell").addContent(app);

        },

ShellView.view.xml代码:

//这里写代码片
<mvc:View
    controllerName="mobile.ShellController"
    xmlns:l="sap.ui.layout"
    xmlns:u="sap.ui.unified"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns="sap.m"
    class="viewPadding">
        <u:Shell
            id="myShell"
            icon="{/logo}">
            <u:headItems>
                <u:ShellHeadItem
                    tooltip="Configuration"
                    icon="sap-icon://menu2"
                    press="handlePressConfiguration" />
                <u:ShellHeadItem
                    tooltip="Home"
                    icon="sap-icon://home"
                    visible="false"
                    press="handlePressHome" />
            </u:headItems>
            <u:headEndItems>
                <u:ShellHeadItem
                    icon="sap-icon://log"
                    tooltip="Logoff"
                    press="handleLogoffPress" />
            </u:headEndItems>
            <u:user>
                <u:ShellHeadUserItem
                    image="sap-icon://person-placeholder"
                    username="Karl Mustermann"
                    press="handleUserItemPressed" />
            </u:user>
            <u:search>
                <SearchField
                    search="handleSearchPressed"/>
            </u:search>
            <u:paneContent>
                <Text text="Lorem ipsum" />
            </u:paneContent>
        </u:Shell>
</mvc:View>

Tags:SA AP PU UI 
作者:网络 来源:杨江的IT分享专栏
  • 上一篇:phpstorm使用技巧
  • 下一篇:js-css日常