本系列文章

SAP CAP篇一: 快速創(chuàng)建一個(gè)Service，基于Java的實(shí)現(xiàn)
SAP CAP篇二：為Service加上數(shù)據(jù)庫(kù)支持
SAP CAP篇三：定義Model
SAP CAP篇四：為CAP添加Fiori Elements程序(1)
SAP CAP篇五：為CAP添加Fiori Elements程序(2)
SAP CAP篇六：為CAP添加Fiori Elements程序(3)
SAP CAP篇七：為CAP添加Fiori Launchpad入口 (Sandbox環(huán)境)
SAP CAP篇八：為CAP添加App Router并支持Fiori Launchpad (Sandbox環(huán)境)
SAP CAP篇九：升級(jí)為SAP CDS 7.0, CAP Java 2以及Spring Boot 3
SAP CAP篇十：理解Fiori UI的Annoation定義
SAP CAP篇十一：支持Media Object：圖片、附件等
SAP CAP篇十二：AppRouter 深入研究

官方文檔和基礎(chǔ)概念

官方文檔中當(dāng)然包含了Fiori UI的部分，不過(guò)要弄懂整個(gè)概念，也得先從OData的部分開始看起。

一切從根源說(shuō)起：

• 不論是SAP CAP還是SAP RAP，其實(shí)都拓展了OData的定義。
• OData的設(shè)計(jì)初衷是格式化REST風(fēng)格的API，通過(guò)$metadata, $count, $filter, $select等定義規(guī)范了POST/GET等一系列操作；
• SAP CDS Annotation其實(shí)是在OData的metadata中添加了額外的為了UI（其實(shí)這里特指Fiori UI）定義的內(nèi)容，用來(lái)規(guī)范Fiori UI程序的組成。
• SAP CDS Annotation的設(shè)計(jì)理念應(yīng)該是，最大簡(jiǎn)化界面層面的開發(fā)，甚至可以不寫一行界面代碼的方式生成標(biāo)準(zhǔn)、統(tǒng)一的前臺(tái)程序。

SAP CAP對(duì)Fiori UI的支持

理解了上述的基礎(chǔ)概念，下面就基于前面幾篇的項(xiàng)目，研究下SAP CAP對(duì)Fiori UI是如何通過(guò)Annotation實(shí)現(xiàn)的。

package.json的新增內(nèi)容

在SAP CAP篇四：為CAP添加Fiori Elements程序(1) 為項(xiàng)目添加Fiori Elements程序時(shí)，其實(shí)Application Generator自動(dòng)在項(xiàng)目的package.json文件中添加了如下依賴：

  "devDependencies": {
    "@sap/ux-specification": "^1.102.23"
  }

除了添加的依賴之外，還有如下額外的部分：

  "sapux": [
    "app/manage-books",
    "app/browse-books"
  ],

這里每條新增的項(xiàng)目就對(duì)應(yīng)每個(gè)新添加的Fiori Elements。

Annotation定義

上述package.json只是讓編譯器知道在編譯時(shí)查找Annotation定義，以輸出Annotation相關(guān)的定義為Metadata。

Annotation定義則是保存在對(duì)應(yīng)的Annotation CDS文件中。具體來(lái)說(shuō)，在本例中，對(duì)應(yīng)的Annotation定義存放在fiori-service.cds中。

本篇沒(méi)法具體介紹所有的Annotation，僅使用最常用的List Page來(lái)進(jìn)行說(shuō)明。

List Page

List Page由上面的Filter Bar加Table構(gòu)成。

• 前者由UI.SelectionFields定義。
• 后者由UI.LineItem來(lái)定義。這里定義的LineItem其實(shí)是定義Table中的Column。

annotate service.Books with @(
    UI.SelectionFields: [ ID, title, descr ],
    UI.LineItem : [
        {
            $Type : 'UI.DataField',
            Value : title,
        },
        {
            $Type : 'UI.DataField',
            Value : descr,
        },
        {
            $Type : 'UI.DataField',
            Value : stock,
        },
        {
            $Type : 'UI.DataField',
            Value : price,
        },
        {
            $Type : 'UI.DataField',
            Value : currency_code,
        },
        {
            $Type: 'UI.DataField',
            Value: category_ID
        }
    ]
);

生成的Edmx文件

與SAP CAP Node.js版本不同，SAP CAP Java項(xiàng)目只能通過(guò)生成的edmx文件來(lái)查看上述Annotation。

參見(jiàn)項(xiàng)目 srv\src\main\resources\edmx文件夾，通常其中有很多xml文件，文件命名中指定了相關(guān)的語(yǔ)言版本。

      <Annotations Target="AdminService.Books">
        <Annotation Term="UI.SelectionFields">
          <Collection>
            <PropertyPath>ID</PropertyPath>
            <PropertyPath>title</PropertyPath>
            <PropertyPath>descr</PropertyPath>
          </Collection>
        </Annotation>
        <Annotation Term="UI.LineItem">
          <Collection>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="title"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="descr"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="stock"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="price"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="currency_code"/>
            </Record>
            <Record Type="UI.DataField">
              <PropertyValue Property="Value" Path="category_ID"/>
            </Record>
          </Collection>
        </Annotation>

對(duì)應(yīng)代碼及branch

與本文配套的代碼參見(jiàn)這里。

本篇對(duì)應(yīng)的branch是6_cds7。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-563937.html

到了這里，關(guān)于SAP CAP篇十：理解Fiori UI的Annoation定義的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！