SAP UI5 应用里一些容器控件的介绍

本文涉及的产品
容器镜像服务 ACR,镜像仓库100个 不限时长
容器服务 Serverless 版 ACK Serverless,952元额度 多规格
容器服务 Serverless 版 ACK Serverless,317元额度 多规格
简介: SAP UI5 应用里一些容器控件的介绍

sap.m.Shell 控件可用作应用程序的根元素。 它可以包含 App 或 SplitApp 控件。 Shell 为整个应用程序提供了一些总体功能,并负责在桌面浏览器平台上进行视觉适配,例如应用程序周围的框架。


sap.m.App: 该 App 继承自 sap.m.NavContainer 并因此提供其导航功能。 它将某些标头标签添加到 HTML 页面,这些标签在 SAP UI5 运行在移动设备上至关重要。


image.png


开发人员可以配置应用程序的主页图标(home icon)。


有一些选项可以使用 backgroundColor 和 backgroundImage 属性来设置背景颜色和背景图像。


默认情况下(isTopLevel 设置为 true)sap.m.App 遍历其父元素并自动将它们的高度设置为 100%.


sap.m.Page: 包含应用程序的整个屏幕的容器控件。sap.m.Page 是一个容器控件,它包含一个应用程序的整个屏幕。 该页面具有三个可以容纳内容的不同区域 - 页眉(header)、内容区域(content area)和页脚(footer).


标头(header)

页面的最顶部区域被页眉占据。 标准标题包括导航按钮和标题。开发人员也可以创建自己的自定义标头,该标头在 customHeader 聚合中定义。


Content Area

内容占据了页面的主要部分。 默认情况下只有内容区域是可滚动的。 这可以通过将 enableScrolling 设置为 false 来禁用其滚动行为。


footer

页脚是可选的,占据页面的固定底部。 或者,页脚可以浮动在内容底部的上方。 这是通过 floatingFooter 属性启用的。


注意:不同区域的所有可访问性信息及其相应的 ARIA 角色都在 sap.m.PageAccessibleLandmarkInfo 类型的聚合 landmarkInfo 中设置。


在 SAP Quartz 主题中使用 sap.m.Page 时,断点和布局填充可以由容器的宽度决定。 要启用此概念并将响应填充添加到页面控件的元素,可以根据用例添加以下 CSS 类:sapUiResponsivePadding–header、sapUiResponsivePadding–subHeader、sapUiResponsivePadding–content、sapUiResponsivePadding–footer、sapUiResponsivePadding- -浮动页脚。



image.png

相关文章
|
5月前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
|
5月前
|
JavaScript 前端开发 开发者
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
|
5月前
|
Web App开发 数据采集 前端开发
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
|
5月前
|
XML 存储 数据格式
SAP UI5 控件 customData 属性的应用介绍
SAP UI5 控件 customData 属性的应用介绍
|
5月前
|
前端开发 JavaScript API
SAP UI5 sap.ui.require.toUrl 的作用介绍
SAP UI5 sap.ui.require.toUrl 的作用介绍
|
5月前
|
搜索推荐
如何让 SAP UI5 Smart Table 支持多项选择(Multiple-Selection)试读版
如何让 SAP UI5 Smart Table 支持多项选择(Multiple-Selection)试读版
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
|
5月前
|
Web App开发 前端开发 JavaScript
乱花渐欲迷人眼 - 让 SAP UI5 应用的日志输出不再素面朝天
乱花渐欲迷人眼 - 让 SAP UI5 应用的日志输出不再素面朝天
|
5月前
|
Web App开发 JSON JavaScript
SAP UI5 应用程序小技巧 - 一键将 JSON 对象导出成本地 json 文件
SAP UI5 应用程序小技巧 - 一键将 JSON 对象导出成本地 json 文件
|
5月前
|
XML 数据处理 数据格式
什么是 SAP UI5 XML Templating 技术
什么是 SAP UI5 XML Templating 技术
下一篇
无影云桌面