SAP BAS中Fiori开发的高阶功能(storyboard, navigation, guided development, variant)

本文主要是介绍SAP BAS中Fiori开发的高阶功能(storyboard, navigation, guided development, variant),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1. 前言

在之前的几篇文章中,我介绍了SAP BAS的一些基本功能,包括账户申请,创建工作区,git的使用以及如何step-by-step去创建出你的第一个Fiori项目等等。在本篇中,我将进一步介绍一些在开发Fiori应用程序时会用到的高阶功能。

2. 功能点

2.1 SAP Fiori View

在SAP Fiori视图活动中,我们可以访问应用程序建模器(Application Modeler)以及一些 通用的SAP帮助文档和消息发布。

我们可以通过Application Modeler来显示、修改已有的应用程序界面,也可以在此为应用程序添加新页面。

2.1.1 Page Map

在page map页面可以更改应用程序的页面结构,也可更改应用程序的设置例如如标题,描述或灵活列布局(Flexible Column Layout)。这些改动都会被保持至manifest.json配置文件中。

当然,通过page map可以为应用新增页面。

2.1.2 Page Editor

在Page Edior中,可以展示出每个Page元素,并在Properties面板上更改它的设置。
通过Page Editor对页面进行的调整会保存至manifest.json文件中或保存为SAPUI5 Flexibility Change。

2.2 Service Modeler

SAP BAS中的服务建模器Service Modeler支持基于.xml /.edmx 文件的OData V2/V4服务模型的可视化。打开Service Modeler的两种方式:

  • 通过命令面板,输入命令:Fiori: Open Service Modeler
  • 右键metadata.xml文件,然后选择Override Annotations

通过service modeler我们可以:

  • 轻松浏览复杂的服务,并查看服务的实体集、实体和属性
  • 查看与服务的实体和属性相关联的注释annotations
  • 管理SAP Fiori元素应用程序所需的服务,例如向项目添加新服务或同步已经存在的服务
  • 管理与SAP Fiori元素项目的不同OData服务相关联的本地注释文件(local annotation)
  • 在本地覆盖annotations(通过使用复制annotation按钮)

2.3 Manifest Manager

Manifest Manager包含两部分功能:Service Manager服务管理器和Annotation File Manager注解文件管理器。

邮件manifest.json文件,可以选择打开哪种管理器:

2.3.1 Service Manager

通过Service Manager服务管理器可以为项目添加新服务(仅适用于Overview floorplan和Freestyle应用程序),以及从服务器刷新服务,进而重新生成本地的metadata.xml和annotation XMLL。

2.3.2 Annotation File Manager

通过Annotation File Manager注解文件管理,则可以:

  • 列出项目中所有的annotations文件
  • 创建新的本地annotation文件
  • 更改注解文件的顺序
  • 激活/取消激活/删除注解文件

2.4 Storyboard

打开Storyboard的方式,命令面板 中输入命令 Open Storyboard 。通过故事版storyboard可以用图形化编辑器和向导的方式开发应用程序。

故事板提供了应用程序的数据模型、外部数据模型、服务和应用程序的UI前端的图形视图,以及它们之间的连接关系。这种可视化的表现形式让开发人员可以快速理解应用程序的结构和组件。

Storyboard也可以显示为树状结构。

2.5 Service Diagram

在Storyboard中有一个隐藏功能,那就是service diagram。在storyboard上点击service name, 然后选择View Diagram可以打开对应服务的Service Diagram。

在service diagram中可以显示metadata.xml文件的不同可视化模式:

  • 通用(General):实体及其属性的列表
  • 图表 (Diagram):可视化实体及其关系
  • 元数据 (Metadata):显示纯XML文件

注意,单独打开metadata.xml文件时,其仅会显示为元数据的格式。仅在service diagram中,可以显示成图表的方式。

2.6 Guided Development

通过有Guided Development,可以查看如何在SAP Fiori元素应用程序中实现某些功能的指南和教程。可以使用命令面板的 Fiori: open Guided Development 命令,或邮件webapp文件夹打开此功能。

选定功能后,可以直接通过Guided Development一步一步实现选定的扩展功能。

2.7 App-to-App Navigation (应用间导航)

如果两个应用程序位于相同的workspace工作空间中,则可以用预览功能,来测试从一个应用程序到另一个应用程序的导航。

使用命令面板并选择 Fiori: Enable App-to-App Navigation Preview 命令启动此功能

  1.  选择源项目-配置将被添加到该项目
  2.  选择目标项目-想要导航的位置

该命令生成一个新的配置 appconfig/fioriSandboxConfig.json 到源应用程序文件夹,并更新ui5.yaml 文件。可以向同一个源应用程序添加多个目标导航。

2.8 在外部的Fiori Launchpad上运行Fiori应用程序

SAP BAS为用户提供测试应用程序运行的能力,而无需在外部Fiori Launchpad上重新部署应用程序。打开命令面板, 输入命令Fiori: Add FLP Embedded Configuration:

然后完成以下步骤:

  1. 以小写输入已部署应用程序的BSP(BSP容器是SAP系统中的一个存储位置,用于存放Web应用程序的所有文件,每个BSP容器都有一个唯一的名称,可以通过这个名称在SAP系统中访问到对应的Web应用程序)
  2. 输入含后端配置的YAML(通常是_ui5.yaml_文件)
  3. 输入到SAP Fiori Launchpad的相对链接,例如sap/bc/ui5_ui5/ui2/ushell/shells/abap/Fiorilaunchpad.html (将根据后端服务解析)
  4. 构建应用程序
  5. 使用新的start-embedded脚本运行应用程序

完成任何更改后,应用程序不会立即刷新,需要通过执行npm _run build_ _来重新构建应用,进而查看UI上的变化。一旦构建执行完成,在外部启动台上运行的应用程序就会自动刷新。

2.9 创建开发者变式

通过SAP Fiori工具提供的variant creation,开发人员可以为应用程序或单个表创建variant,这些variant变式可以与应用程序一起交付给用户。这些variant将会作为SAPUI5 flexibility changes存储在项目的webapp/changes文件夹中,并在构建Build步骤中与应用程序一起打包。

执行NPM脚本 start-variables-management。也可以使用NPM脚本start-control-property-edito,它会以UI自适应模式打开应用程序,并封装在属性编辑器页面中。

如果这个脚本不存在,可以通过命令面板的 Fiori: Add Configuration for Variants Creation 命令来配置此功能。

对于每个新变体,在项目的webapp/changes文件夹中会创建一个或多个SAPUI5更改文件。


2.10 在本地运行单元测试

您可以在本地运行单元测试。使用预配置的NPM脚本,创建一个运行配置(run configuration)或从终端(terminal)启动它。

fiori run --open webapp/test/unitTests.opa.html

3 小结

在本文中,介绍了开发Fiori应用过程中会用到的一些高阶功能,但限于篇幅限制,对于特别复杂的功能仅是做了初步的介绍,并未完全展开。有需求的同学,可以进一步在此基础上学习和探索。

这篇关于SAP BAS中Fiori开发的高阶功能(storyboard, navigation, guided development, variant)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/837320

相关文章

PyQt5 GUI 开发的基础知识

《PyQt5GUI开发的基础知识》Qt是一个跨平台的C++图形用户界面开发框架,支持GUI和非GUI程序开发,本文介绍了使用PyQt5进行界面开发的基础知识,包括创建简单窗口、常用控件、窗口属性设... 目录简介第一个PyQt程序最常用的三个功能模块控件QPushButton(按钮)控件QLable(纯文本

Java实现预览与打印功能详解

《Java实现预览与打印功能详解》在Java中,打印功能主要依赖java.awt.print包,该包提供了与打印相关的一些关键类,比如PrinterJob和PageFormat,它们构成... 目录Java 打印系统概述打印预览与设置使用 PageFormat 和 PrinterJob 类设置页面格式与纸张

MySQL 8 中的一个强大功能 JSON_TABLE示例详解

《MySQL8中的一个强大功能JSON_TABLE示例详解》JSON_TABLE是MySQL8中引入的一个强大功能,它允许用户将JSON数据转换为关系表格式,从而可以更方便地在SQL查询中处理J... 目录基本语法示例示例查询解释应用场景不适用场景1. ‌jsON 数据结构过于复杂或动态变化‌2. ‌性能要

基于Python开发一个图像水印批量添加工具

《基于Python开发一个图像水印批量添加工具》在当今数字化内容爆炸式增长的时代,图像版权保护已成为创作者和企业的核心需求,本方案将详细介绍一个基于PythonPIL库的工业级图像水印解决方案,有需要... 目录一、系统架构设计1.1 整体处理流程1.2 类结构设计(扩展版本)二、核心算法深入解析2.1 自

Qt使用QSqlDatabase连接MySQL实现增删改查功能

《Qt使用QSqlDatabase连接MySQL实现增删改查功能》这篇文章主要为大家详细介绍了Qt如何使用QSqlDatabase连接MySQL实现增删改查功能,文中的示例代码讲解详细,感兴趣的小伙伴... 目录一、创建数据表二、连接mysql数据库三、封装成一个完整的轻量级 ORM 风格类3.1 表结构

mysql表操作与查询功能详解

《mysql表操作与查询功能详解》本文系统讲解MySQL表操作与查询,涵盖创建、修改、复制表语法,基本查询结构及WHERE、GROUPBY等子句,本文结合实例代码给大家介绍的非常详细,感兴趣的朋友跟随... 目录01.表的操作1.1表操作概览1.2创建表1.3修改表1.4复制表02.基本查询操作2.1 SE

Golang如何用gorm实现分页的功能

《Golang如何用gorm实现分页的功能》:本文主要介绍Golang如何用gorm实现分页的功能方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录背景go库下载初始化数据【1】建表【2】插入数据【3】查看数据4、代码示例【1】gorm结构体定义【2】分页结构体

SpringBoot开发中十大常见陷阱深度解析与避坑指南

《SpringBoot开发中十大常见陷阱深度解析与避坑指南》在SpringBoot的开发过程中,即使是经验丰富的开发者也难免会遇到各种棘手的问题,本文将针对SpringBoot开发中十大常见的“坑... 目录引言一、配置总出错?是不是同时用了.properties和.yml?二、换个位置配置就失效?搞清楚加

Java Web实现类似Excel表格锁定功能实战教程

《JavaWeb实现类似Excel表格锁定功能实战教程》本文将详细介绍通过创建特定div元素并利用CSS布局和JavaScript事件监听来实现类似Excel的锁定行和列效果的方法,感兴趣的朋友跟随... 目录1. 模拟Excel表格锁定功能2. 创建3个div元素实现表格锁定2.1 div元素布局设计2.

Python中对FFmpeg封装开发库FFmpy详解

《Python中对FFmpeg封装开发库FFmpy详解》:本文主要介绍Python中对FFmpeg封装开发库FFmpy,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录一、FFmpy简介与安装1.1 FFmpy概述1.2 安装方法二、FFmpy核心类与方法2.1 FF