什么是SAP Fiori？SAP Fiori不是SAP發(fā)布的某款產(chǎn)品，而是SAP新一代UI設(shè)計風(fēng)格和用戶體驗的代號。
Fiori是一個意大利語中的單詞，意思是“花”：

不得不說SAP確實對“花”情有獨鐘，因為SAP的另一款內(nèi)存數(shù)據(jù)庫HANA（全稱：High-performance Analytic Appliance），在日語里也是“花”的意思。

再回到Fiori。SAP Fiori 2.0在2015年時，曾經(jīng)獲得全球最富盛名的設(shè)計競賽，紅點設(shè)計概念競賽(Red Dot Award:Design Concept 2015)的大獎。這次競賽有全球來自61個國家4680件作品參與角逐，最終SAP脫穎而出獲此殊榮。
如果您想看看按照SAP Fiori這套規(guī)范設(shè)計出的前端應(yīng)用到底長什么樣，可以按照本文介紹的方法免費體驗。
訪問鏈接：https://www.sap.com/china/products/fiori.html
點擊“免費試用”的按鈕：

在跳轉(zhuǎn)的頁面里點擊按鈕“See it in action”：

然后我們就能看到一個Fiori應(yīng)用的入口界面了，這個界面有個術(shù)語叫做Fiori Launchpad。我們也可以把下面這個鏈接加到收藏夾里，下次直接訪問。
https://www.sapfioritrial.com/sites?helpset=trial&sap-client=001

Fiori Launchpad里每個方方正正的白色區(qū)域，我們稱之為Tile。每個Tile代表一個Fiori應(yīng)用。其中上圖紅色高亮的幾個Tile代表的應(yīng)用就是Jerry所在的SAP成都研究院的開發(fā)團隊負(fù)責(zé)開發(fā)和維護的。
任意點擊一個Tile，比如My Opportunities。在進入頁面的過程中，能看到一個旋轉(zhuǎn)的花瓣動畫效果，這也呼應(yīng)了Fiori的“花”的含義：

進入Opportunity應(yīng)用后，您就能看到類似下圖的界面了，這就是一個典型的SAP Fiori應(yīng)用。

如果您對這些Fiori的前端實現(xiàn)好奇，想看看它們背后的JavaScript或者CSS的實現(xiàn)，那么同時按住Ctrl+Alt+Shift+P四個按鍵，會看到下面這個彈出窗口。選中“Use Debug Sources”的勾選項，

然后重新刷新瀏覽器，

這樣就會加載SAP Fiori應(yīng)用的調(diào)試版本了。如果不這樣做的話，默認(rèn)加載的是發(fā)布版本的前端代碼，里面的JavaScript代碼經(jīng)過壓縮，變量名和函數(shù)名完全不可讀。
此時在Chrome瀏覽器的開發(fā)者工具的Networ標(biāo)簽里能看到一系列調(diào)試版本的腳本文件的加載。

稍等片刻之后，就可以到Chrome開發(fā)者工具的Sources標(biāo)簽頁去閱讀加載好的調(diào)試版本的腳本文件了。

要獲取更多Jerry的原創(chuàng)文章，請關(guān)注公眾號"汪子熙":

總結(jié)

以上是生活随笔為你收集整理的如何免费试用SAP的Fiori应用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。