UI5

首页 > TAG信息列表 > UI5

SAP UI5 应用中的 sap.ui.require 使用场景

下图是笔者 SAP UI5 开发教程中使用到的一段代码： var mPath = sap.ui.require.toUrl('sap/ui5/walkthrough') + "/"; console.log('Jerry: ', mPath); 本文介绍 sap.ui.require 的使用场景和明细。其主要用途是，解析一个或多个 SAP UI5 模块依赖关系。工作模式为，单个模块导出值

SAP UI5 应用中 MockServer 的实例化方法

我们在 SAP UI5 应用代码中，使用如下代码创建一个 Mock Server 实例： this.oVocabularyMockServer = new MockServer({rootUri: "/sap/opu/odata/SAP/vocabulary_srv/"}); 这个 Mock Server 来自命名空间 sap.ui.core.util，它只能用来模拟向支持 OData V2 REST协议的远程服务器发出

SAP UI5 里的 Busy Dialog 控件使用概述

sap.m.BusyDialog 用于指示系统正忙。当显示 Busy 对话框时，整个应用程序被会阻止，无法进行任何新的操作。 Busy Dialog 包含下列几个组成部分，其中大部分是可选的。 title - 对话框的标题。默认情况下，没有标题。 text - 显示在Busy Dialog 上方的文本。 showCancelButton - 一个可

SAP ABAP OData 服务的分页加载数据集的实现(Paging)试读版

正如本教程的开篇介绍文章SAP OData 开发教程 - 从入门到提高(包含 SEGW, RAP 和 CDP)所提到的，SAP OData 服务开发，从实现技术上来说，可以分为三大类。因此本教程也分为三大部分，分别进行介绍。本文是本教程的文章目录。作者简介 Jerry Wang，2007 年从电子科技大学计算机专业硕士毕业

通过 FileUploader 的初始化，了解 SAP UI5 应用的 StaticArea 初始化逻辑

SAP UI5 FileUploader 实现的依赖： sap.ui.define([ 'sap/ui/core/Control', './library', 'sap/ui/core/LabelEnablement', 'sap/ui/core/InvisibleText', 'sap/ui/core/library', 'sap/ui/Device', '.

SAP UI5 FileUploader 使用的隐藏 iframe 和 form 元素的设计明细

我们研究 SAP UI5 FileUploader 控件渲染时生成的 HTML 源代码：真正提供给用户选择文件上传的控件，是下图高亮的这个类型属性 type 为 file 的 input 控件。这个 file input 位于下图高亮的 form 控件，该控件的 action 指向文件服务器 url：http://localhost:3003/upload, 即接收文件

SAP UI5 FileUploader 的本地文件上传技术实现分享

当我们使用 SAP UI5 的 FileUploader 控件，上传本地文件时，其执行逻辑的入口，就是 FileUploader.prototype.upload：首先判断该控件是否已经被 disable： if (!this.getEnabled()) { return; } SAP UI5 FileUploader 底层可以基于 form 的 multipart/form-data 或者 XHR 两种技术

关于 SAP UI5 应用 ui5.yaml 里的 paths 映射问题

url 里多了一个 webapp：此刻都是正确的：可能因为这个 webapp 文件夹的原因：这个 upload 属性可能不能硬编码成其他的，否则上传到服务器之后，又要重新修改：这个 upload 会根据 index.html 所在的路径，自动补全之前的代码。根据项目类型，UI5 Tooling 要求 SAP UI5 的项目源文件位于

关于 SAP UI5 floating footer 显示与否的单步调试以及使用 SAP UI5 的收益

floating bar 隐藏之前的 position 位置：消失在可见区域之后，position 变成 -10000 了：这个 visibility：hidden 导致的 toolbar 被隐藏：一旦把这个 ✓ 去掉，隐藏的 overflow toolbar 马上显示出来了：点击 Edit 按钮之后，给 section 插入了 sapUiHidden 的 class：枚举：ObjectPageL

关于 SAP UI5 Context.prototype.delete 方法的输入参数 Group ID 的细节

在 Jerry 这篇教程 SAP UI5 应用开发教程之六十六 - 基于 OData V4 的 SAP UI5 表格控件如何实现删除功能里，有个朋友提了个问题：我们选中列表行项目之后，点击删除按钮，会触发一个 OData 的删除请求：这个删除请求，通过 onDelete 函数的第 62 行代码，调用 BindingContext 实例的 dele

关于 SAP UI5 参数 $$updateGroupId 前面两个 $ 符号的含义

我的 SAP UI5 教程，SAP UI5 应用开发教程之六十五 - 基于 OData V4 的 SAP UI5 表格控件如何实现创建，编辑和保存功能，里面演示了通过 XML 视图的方式，非 SAP UI5 Table 控件，定义复合绑定路径的语法，如下图所示： <Table id="peopleList" growing="true" growingTh

SAP UI5 Theme Library 的解析逻辑和 SAP UI5 配置元数据的默认值

我们在 SAP UI5 应用的 index.html 里通过属性 data-sap-ui-theme="sap_fiori_3" 指定 theme，会导致运行时自动加载对应的 library.css 文件。上图 id 为 sap-ui-bootstrap 的 script 标签，也称为 bootstrap 标签。SAP UI5 对这个标签，包括其 data-sap-ui-XXX 属性的解析细节，在我这

开源工具 SAP UI5 Tools 介绍

SAP UI5 Tools 是一个开放和模块化的工具链，用于开发基于 UI5 框架的最先进的应用程序。大多数 UI5 工具模块提供了 JavaScript api，供其他 Node.js项目直接使用。这允许开发人员通过编程的方式，依赖于UI5工具来实现特定于UI5的构建功能和项目处理，同时创建属于自己的工具来完美匹配

SAP UI5 表格行项目内的按钮点击之后，如何获得当前所在的表格行项目的数据

我的 SAP UI5 教程这篇文章下面，有个朋友留言咨询一个问题：我想问一个问题就是，我在table表格里放了一个按钮，就是如何点击按钮能够获取到本行的数据呀，本文专门解答。首先我们得在 Table 行项目里构造一个按钮出来。重用我教程里步骤 33：SAP UI5 应用开发教程之三十三 - SAP UI

SAP UI5 walkthrough-08备注

SAP UI5翻译注解：需要在webapp 目录下面建立i18n文件夹，然后添加翻译文件，一般是多份语言文件，如下图：

SAP UI5 walkthrough-04备注

SAP UI5 使用view视图进行界面排版　　

SAP UI5 框架的 manifest.json

链接：https://sapui5.hana.ondemand.com/resources/sap/ui/core/manifest.json 从 ApplicationVersion 里能得到 SAP UI5 框架最新的版本：1.101.0 这个最新的版本也能在下面的链接里得到： https://sapui5.hana.ondemand.com/ openSourceComponents 里能得到 SAP UI5 使用的所有开源

sap.ui.core.IAsyncContentCreation 这个标记接口在 SAP UI5 框架中的应用

这是 sap.ui.core.UIComponent 子类的标记接口(Marker interface)。什么是标记接口？可以查阅我这篇文章：ABAP和Java的tag(marker) interface。简单地说，Marker interface 是编程语言在不支持注解(annotation)的情况下, 通过接口的概念，来为一个类或者函数(JavaScript 里的 function

SAP UI5 应用的主-从-从(Master-Detail-Detail)布局模式的实现步骤

所谓 SAP UI5 应用的主-从-从布局模式，意思是屏幕水平方向分为左，中，右三部分。每个部分分别显示 Master，Detail 第一层和 Detail 第二层数据。下面这个 gif 是具备这种布局方式的一个具体例子：该应用程序提供以下功能：基于 sap.f.FlexibleColumnLayout 控件的最多三列布局。此

SAP UI5 OData V4 模型的构造方式

sap.ui.model.odata.v4.ODataModel 是使用 OData V4 服务的模型实现。 SAP Fiori 元素构建块 (sap.fe.macros) 必须与 SAPUI5 OData V4 模型一起使用，而不是智能控件（sap.ui.comp 库）或 sap.ui.table.AnalyticalTable（或分析表方案）。不支持 TreeTable 与 SAPUI5 OData V4 模型一起使用

什么是 SAP UI5 的 Smart Field

SmartField 控件解释表示 OData 服务中的实体关系模型、数据类型、服务功能和注释的元数据，以自动生成底层内部控件并减少开发应用程序所需的代码量。在某些情况下，OData 实体派生自控件的绑定上下文。随控件更改或显示的 OData 实体的属性派生自控件的 value 属性。重要提示：SmartF

SAP Fiori 的学习路线指南

以下是我在 SAP 成都研究院工作 15 年根据自己工作中积累的经验，总结出的 Fiori 学习路线指南，纯属个人观点，不代表 SAP 公司。什么是 SAP Fiori，什么是 SAP UI5，二者的关系如何。Fiori 1.0，2.0 和 3.0 的演进：介绍 SAP Fiori 和 SAP UI5 这两个初学者容易混淆概念的区别和联系，介

SAP UI5 setProperty 的执行逻辑单步调式和分析

按照 Jerry 这篇文章介绍的代码，运行之后，给类型为 sap.ui.model.type.Currency 的字段设置一个非 number 类型的值之后，触发该数据类型自带的数据校验机制，显示 Enter a number 的错误消息。 SAP UI5 应用开发教程之四十六 - 使用 Message Manager 实现开箱即用的验证(Validation)信

SAP UI5 应用开发教程之四十一 - Chrome 扩展 UI5 Inspector 的离线安装和使用方法

和 Angular，React，Vue 等流行的前端开发框架一样，SAP UI5 在 Chrome 里也有着自己的扩展，称为 UI5 Inspector, 安装之后，在 Chrome 开发者工具里会出现一个新的名为 UI5 的面板。在本教程之前的步骤里我们或多或少都接触到了这个工具：本文作为一个专题，来介绍其安装和使用方法。目录

SAP UI5 应用开发教程之四十四 - Label 和 Input 控件文本没有水平对齐的原因分析和解决方案

一套适合 SAP UI5 初学者循序渐进的学习教程教程目录 SAP UI5 本地开发环境的搭建 SAP UI5 应用开发教程之一：Hello World SAP UI5 应用开发教程之二：SAP UI5 的引导过程 Bootstrap SAP UI5 应用开发教程之三：开始接触第一个 SAP UI5 控件 SAP UI5 应用开发教程之四：XML 视