写点什么

Fiori

0 人感兴趣 · 46 次引用

  • 最新
  • 推荐
https://static001.geekbang.org/infoq/c1/c1914943a50739de9df2153f60d2919d.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAPUI5 本地工程中的键值对 sapux - true 的作用

在 SAPUI5 本地工程中,"sapux": true 是 package.json 文件中的一个字段,它用于指定项目是否是 SAPUI5 UX 工程。

https://static001.geekbang.org/infoq/c1/c1914943a50739de9df2153f60d2919d.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

谈一谈 SAP 企业管理软件里那些真假 Fiori 应用

本文首先介绍了 Fiori 设计语言的简单概念,接着删除了 Fiori 原生 UI 和 Fiori Like UI 两种从最终用户视角出发很难分辨出区别的两种 UI 技术,背后的技术实现差异,最后通过具体的例子,讲解了如何区分这两种不同 UI 技术开发而成的页面。

https://static001.geekbang.org/infoq/05/0544935f304b35bf5b3127ae4c159001.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

Fiori Elements 框架里 Smart Table 控件的工作原理介绍

用户头像
Jerry Wang
2022-11-25

笔者前一篇文章 深入掌握 SAP Fiori Elements 工作原理系列之二:如何给 Fiori Elements 应用添加自定义按钮 介绍了如何给 SAP Fiori Elements 应用的 Smart Table 工具栏里,新增自定义按钮,并实现其点击事件处理函数。

https://static001.geekbang.org/infoq/2c/2c6dddbf682bfab9727df33017a81375.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

如何给 Fiori Elements 应用添加自定义按钮

用户头像
Jerry Wang
2022-11-24

笔者的日常工作内容从 2020 年 8 月转到 Angular 前端开发之后,算是领略到了这个流行前端框架繁荣生态圈的风采:在开发过程中遇到 Angular 技术问题时,很容易在社区里找到大量相关文章。

https://static001.geekbang.org/infoq/21/212fa7ff99e6afa3f79947a2913e9543.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

深入掌握 Fiori Elements 工作原理的前提条件:理解 Smart Field

用户头像
Jerry Wang
2022-11-23

SAP 前端开发者如今使用的 SAP Fiori Elements,在 2016 年时被称为 Smart Template,其在 SAP 官网的定义是: Smart Template 是一套框架,针对最常用的应用模式,根据元数据注解,加上预定义的模板,在运行时能够动态生成 SAP UI 页面。

https://static001.geekbang.org/infoq/1c/1cd79adea8649b20f53fea3f27da1cc7.jpeg?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

本地开发完成的 Fiori Elements 应用,部署到远端 ABAP 服务器上的详细步骤

用户头像
Jerry Wang
2022-11-21

之前笔者的两篇文章,分别介绍了如何在本地使用 Visual Studio Code 创建一个 SAP Fiori Elements 应用,以及使用 Fiori Elements Controller Extension 理念,对该 Fiori Elements 应用进行二次开发的具体步骤。本文介绍本地开发完成如何部署到服务器上。

https://static001.geekbang.org/infoq/c1/c1914943a50739de9df2153f60d2919d.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

Fiori Elements 应用进行二次开发的一个具体案例分享

用户头像
Jerry Wang
2022-11-18

笔者之前的文章 使用 Fiori Elements 框架创建 UI5 Web 应用,介绍了如何使用 Visual Studio Code,创建 SAP Fiori Elements 应用。 本文介绍如何对该自动生成的应用进行二次开发。

https://static001.geekbang.org/infoq/d9/d923d7f24ee701e60bff726b8db2ec37.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

使用 Fiori Elements 框架创建 UI5 Web 应用

用户头像
Jerry Wang
2022-11-17

笔者前一篇文章 SAP Cloud Application Programming 介绍 - 2021 更新版,介绍了如何使用 SAP Cloud Application Programming,在本地创建一个 OData 服务,并且利用 SAP CAP SDK,在一个自动且临时生成的 Fiori Elements 应用里,消费该 OData 服务。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 数据绑定中的工厂函数

用户头像
Jerry Wang
2022-11-12

工厂函数是一种更强大的从模型数据创建控件的方法。 为控件聚合的每个条目调用工厂函数,开发人员可以决定每个条目是否应由具有不同属性的相同控件表示,甚至每个条目由完全不同的控件表示。

https://static001.geekbang.org/infoq/7c/7c7c40ea5a218714b80f70e9e281d002.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

谈谈企业级前端应用中通过 CSS 达到布局定制化的话题

用户头像
Jerry Wang
2022-11-11

本文以 SAP CRM Fiori 以及 SAP Commerce Cloud UI 这两个分别采用 UI5 和 Angular 开发的企业级前端应用为例,介绍了设计人员如何采用 CSS 调整来达到布局定制化的效果。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 barcode 控件的 feature 检查探测机制单步调试 - checkCordovaInIframe

用户头像
Jerry Wang
2022-11-06

第 170 行 checkCordovaInIframe 是检测 Cordova API 在 iframe 里的可用性,这里可以忽略。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

不借助 Fiori client,直接在手机浏览器里调用 SAP UI5 BarcodeScanner 实现条形码扫描的可能性?

用户头像
Jerry Wang
2022-11-05

开发人员可以使用 SAP 移动平台 SDK(Mobile Platform SDK) 构建自定义 SAP Fiori 客户端(适用于 iOS 和 Android),以调整品牌、添加对自定义身份验证方案的支持,或添加额外的 SAP、合作伙伴或开源插件。定制版与 SAP Fiori Client 具有相同的核心功能。

https://static001.geekbang.org/infoq/21/212fa7ff99e6afa3f79947a2913e9543.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 BarcodeScannerButton 的初始化逻辑 - feature 检测,Cordova API 检测等逻辑

用户头像
Jerry Wang
2022-11-02

sap.ndc.BarcodeScannerButton:用于启动条码扫描过程的按钮控件(显示条码图标)。 如果本机扫描功能不可用或未授予相机功能,则该按钮要么被隐藏,要么通过打开带有输入字段的对话框来提供后备,可以在其中手动输入条形码。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 和 Angular 的函数防抖 (Debounce) 和函数节流 (Throttle) 实现原理介绍

用户头像
Jerry Wang
2022-11-01

笔者之前的文章 SAP UI5 OData谣言粉碎机:极短时间内发送两个Odata request, 前一个会自动被cancel掉吗,介绍过 SAP 成都研究院 CRM Fiori 开发团队开发过的一个Live Search的场景。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 BarcodeScannerButton 的初始化逻辑 - feature 检测,Cordova API 检测等逻辑

用户头像
Jerry Wang
2022-11-01

sap.ndc.BarcodeScannerButton:用于启动条码扫描过程的按钮控件(显示条码图标)。 如果本机扫描功能不可用或未授予相机功能,则该按钮要么被隐藏,要么通过打开带有输入字段的对话框来提供后备,可以在其中手动输入条形码。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

部署 SAP UI5 应用到 SAP BTP 时遇到的 fiori not found 错误消息

用户头像
Jerry Wang
2022-10-18

我在 SAP Business Application Studio 里开发了一个 Spring Boot 应用,这个应用提供了一个 OData 服务实现。然后我用 BAS 的 create from template 功能,创建了一个 SAP UI5 应用。

https://static001.geekbang.org/infoq/b7/b7b5ae74c0d5d9f22e53c73cfa87931e.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 Form 表单 Column Layout 下的 Column 个数分配问题

用户头像
Jerry Wang
2022-09-18

ColumnLayout 控件以基于列的响应方式呈现表单组。 根据其大小,该组被分为一列或多列。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

关于 SAP UI5 所有控件的共同祖先 - sap.ui.base.ManagedObject

用户头像
Jerry Wang
2022-09-11

ManagedObject 的新子类是通过调用 ManagedObject.extend 创建的,并且可以使用本文介绍的以下托管功能。

https://static001.geekbang.org/infoq/2c/2c6dddbf682bfab9727df33017a81375.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP Fiori Launchpad Tile,UI5 应用,和 PFCG Role 的对应关系

用户头像
Jerry Wang
2022-08-22

问题:已经看到了SAP Fiori Launchpad上的某个tile,如何反推后台需要配置哪个PFCG Role才能看到该tile?

https://static001.geekbang.org/infoq/7b/7b4f3bfe58c7ef55ba13064f81d73712.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

在 Business Application Studio 里使用 SAP UI5 应用消费 OData 的 Create 和 Delete 操作

用户头像
Jerry Wang
2022-07-20

在 SAP Business Application Studio 里创建一个 SAP UI5 应用,应该具有如下的项目结构:

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP Fiori 的附件处理 (Attachment handling)

用户头像
Jerry Wang
2022-07-17

以 SAP CRM Fiori 应用为例。附件处理有两个层面,即在 Fiori UI 上显示附件(读取操作),以及通过 Fiori UI 创建附件(写入操作)。

https://static001.geekbang.org/infoq/d9/d923d7f24ee701e60bff726b8db2ec37.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP Fiori @OData.publish 注解的工作原理解析

用户头像
Jerry Wang
2022-07-12

本文从一个开发人员的视角,深入介绍了 SAP Fiori 注解 @OData.publish 的工作原理。同时也展示了如何通过事物码 ST05,自行定位到 ABAP 框架自动生成 OData 服务资源的准确代码位置。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

关于 SAPGUI 事物码在 Fiori Launchpad 中嵌入运行的技术细节

用户头像
Jerry Wang
2022-07-11

本文前半部分,首先介绍了将 SAPGUI 传统的事物码,嵌入到 Fiori Launchpad 中启动并在浏览器里运行的技术原理,接着以每一位 ABAP 开发人员每天都会使用的事物码 SE80 为例,介绍了将其配置到 Fiori Launchpad 的详细步骤。

https://static001.geekbang.org/infoq/fe/fe85a6a8ce8580b605fb2296b747251c.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP Fiori 注解 @ObjectModel.readOnly 工作原理解析

用户头像
Jerry Wang
2022-07-09

本文首先概述了 ABAP Programming Model for SAP Fiori 的定义,接着以这种编程模型里一个重要的注解 @ObjectModel.readOnly 为例,详细介绍了 CDS 注解与 ABAP 后台协同工作的技术细节。

https://static001.geekbang.org/infoq/21/212fa7ff99e6afa3f79947a2913e9543.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP Fiori 应用索引大全工具和 SAP Fiori Tools 的使用介绍

用户头像
Jerry Wang
2022-07-06

Fiori 应用索引,顾名思义,这是 SAP官方发布的一个Fiori应用检索工具,所有标准发布的Fiori应用的明细都能在这个工具里查到。本文依次分享了 Fiori Application Reference 和 Fiori Tools 这两个实用工具在笔者实际工作中所发挥的重要作用。

https://static001.geekbang.org/infoq/d9/d923d7f24ee701e60bff726b8db2ec37.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 框架的 manifest.json

用户头像
Jerry Wang
2022-07-06

链接:https://sapui5.hana.ondemand.com/resources/sap/ui/core/manifest.json

https://static001.geekbang.org/infoq/d9/d923d7f24ee701e60bff726b8db2ec37.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

SAP UI5 ObjectPageLayout 控件使用方法分享

用户头像
Jerry Wang
2022-07-05

SAP UI5 ObjectPageLayout 控件允许应用程序轻松显示与业务对象(Business Object)相关的信息的布局。

https://static001.geekbang.org/infoq/d9/d923d7f24ee701e60bff726b8db2ec37.png?x-oss-process=image%2Fresize%2Cw_416%2Ch_234

Fiori 应用通过 Adaptation Project 的增强方式分享

用户头像
Jerry Wang
2022-07-01

笔者曾经在 SAP 成都研究院 CRM Fiori开发团队工作时,担任了德国一个著名的灯具制造商客户的CRM Fiori项目的dev angel. 当时客户提出了若干对 CRM Fiori标准应用的增强需求,总的来说分为前台Fiori UI界面的增强(比如增添新的自定义字段)以及后台逻辑的增强

Fiori_Fiori技术文章_InfoQ写作社区