何时在SAPUI5中使用Shell,App,Container,Page,View和SplitApp

Question

最近我使用shell-> views和appContainer-> views创建了两个SAPUI5应用程序.两个结果输出相同.我很困惑何时在SAPUI5中使用Shell和App,Container,Page,View和SplitApp.我想知道SAPUI5中Shell,App,Container,Page,View和SplitApp之间的区别.另请介绍从您的经验中使用上述容器的最佳实践.图解说明有助于理解.

Answer 1

你是对的,有很多容器控件,这可能会令人困惑.那么让我简要介绍一下:

sap.m.Shell

shell,这里没有任何意外,是一个可以用于视图的父容器.但是,与其他容器相比,它允许您限制大型设备的应用程序宽度.如果您想为您的应用程序实现此目的,这是您的控制.这是一个例子:

sap.ui.unified.Shell

统一的Shell充当了一个丰富的父控件,左侧有一个可选的辅助内容,顶部有搜索功能,还有很多东西.统一shell看起来像这样:

sap.m.App | sap.m.SplitApp

sap.m.App和sap.m.SplitApp都可能是最常用的父控件.实际上,其中一个应该始终是移动应用程序的一部分,因为它们会进行一些HTML修改以改善移动设备上的体验(有关详细信息,请参阅jQuery.sap.initMobile).当然,他们可以成为任何壳牌的孩子.此外,它们很重要,因为它们扩展了sap.m.NavContainer,因此提供导航功能.例如,sap.m.App有一个sap.m.App聚合.通过呼叫,sap.m.SplitApp您可以简单地从一个页面导航到另一个页面(一旦您使用路由,这将由路由器完成).sap.m.SplitApp包含两个NavContainers.一个用于主区域,另一个用于细节区域.此外,它还可以管理整个应用程序的一个背景.

sap.m.SplitContainer

谈论容器,应该提到sap.m.SplitContainer.基本上,它提供与sap.m.SplitApp相同的功能,但由于您的应用程序中应该只有一个应用程序(sap.m.App或sap.m.SplitApp),因此如果要启动主服务器,可以使用此控件/详细信息视图,一旦您在应用程序中深入导航

sap.ui.core.mvc.View

视图(及其所有子类型,如JSView,XMLView,HTMLView)反映了页面的一个简单页面或区域.与所有其他容器相比,视图可能具有关联的控制器,并使您能够实现MVC的视图/控制器部分.

sap.ui.core.Fragment

碎片是视图的轻量级变体.它们像视图一样使用,它们的行为相似,但默认情况下没有关联的控制器.但是,如果需要,您可以使用具有功能的简单对象作为控制器替换.如果您要将用户界面的特定部分外部化为其他文件(并且可能多次重复使用),则可以使用片段.

例子

关于应用程序的体系结构,它取决于您要显示的内容(有限的应用程序宽度,主/细节,...).几乎每种组合都是可能的,但我认为每个应用程序只有一个App对象仍然是最佳实践.如果你不需要其中一个Shell的功能,你可以简单地省略它并使你的app对象成为顶级容器.架构的一些示例可能如下所示:

在sap.m.Shell中使用SplitApp或SplitContainer

sap.m.Shell
    sap.m.SplitApp
        sap.ui.core.view.XMLView (Master)
            sap.m.Page

        sap.ui.core.view.XMLView (Detail)
            sap.m.Page

没有Shell的SplitApp或SplitContainer

sap.m.SplitApp
    sap.ui.core.view.XMLView (Master)
        sap.m.Page

    sap.ui.core.view.XMLView (Detail)
        sap.m.Page

sap.m.App在sap.m.Shell中

sap.m.Shell
    sap.m.App
        sap.ui.core.view.JSView
            sap.m.Page

没有任何Shell的sap.m.App

sap.m.App
    sap.ui.core.view.XMLView
        sap.m.Page