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

问题描述 投票:10回答:1

最近我使用shell创建了两个UI5应用程序 - > views和appContainer - > views。两者都产生相同的输出。我很困惑何时在UI5中使用Shell,App,Container,Page,View和SplitApp。

我想知道它们之间的区别。另请说明根据您的经验使用上述容器的最佳实践。

图形化解释将有助于理解。

sapui5
1个回答
36
投票

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

sap.没.shell

在这里,shell并不奇怪,它是一个可用于视图的父容器。但是,与其他容器相比,它允许您限制大型设备的应用程序宽度。如果您想为您的应用程序实现此目的,这是您的控制。

sap.m.Shell

sap.m.App | sap.m.SplitApp

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

sap.m.SplitContainer

谈论容器,应该提到sap.m.SplitContainer。基本上,它提供与sap.m.SplitApp相同的功能,但由于您的应用程序中应该只有一个应用程序(sap.m.Appsap.m.SplitApp),所以如果要在应用程序中深入导航后想要启动主/明细视图,则可以使用此控件。

sap.ui.core.mvc.View

视图(及其所有子类型,如JSViewXMLViewHTMLView)反映了页面的一个简单页面或区域。与所有其他容器相比,视图可能具有关联的控制器,并使您能够实现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

ui5 master detail pages within splitapp within shell


没有Shell的SplitApp或SplitContainer

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

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

ui5 master detail pages within splitapp without shell


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

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

ui5 page within view within app within shell


没有任何Shell的sap.m.App

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

ui5 page within view within app without shell

© www.soinside.com 2019 - 2024. All rights reserved.