SAP’s UI Technologies supporting the new Horizon visual theme of SAP Fiori
SAP 正在轉變我們的設計和開發文化，更加專注于幫助人們更快、更輕松地完成工作并取得更好的成果。 如果您還沒有閱讀過相關內容，請先閱讀我們首席設計官 Benedikt Lehnert 的這篇博文，然后再繼續閱讀：體驗心態：重新設計我們在 SAP 構建產品的方式。

SAP 的新設計語言是 SAP Fiori 的演變。 新的視覺主題 Horizon 為基于可訪問的模塊化設計系統的現代友好用戶界面鋪平了道路。 在其他方面，計劃中的新地平線主題包括：

• 符合 Web 內容可訪問性指南的有吸引力且清新的調色板
• 具有對比、留白和大膽的排版以適應自然的信息層次結構的焦點感
• 圓角營造出友好、平易近人的現代外觀
• 一種減少跨設備學習曲線的移動優先方法
• 一個新的圖標集，可以清晰地傳達并感覺現代

圖一：My Home page from

上圖是 SAP S/4HANA Cloud 2111 的主頁，使用 Purchase 業務角色登錄。開啟了 Horizon preview 主題。

How do SAP’s UI technologies support the Horizon visual theme?

SAP 力求跨解決方案和跨 UI 技術提供一致的用戶體驗。 SAP Fiori DNA 通過一個通用主題構建到所有 Web 開發人員的基礎中，從而可以更輕松地構建新的 SAP Fiori 應用程序。 通用主題庫是高效重用和統一主題外觀及其顏色和度量的關鍵。 因此，SAP 能夠快速引入 Horizon 主題，并正確關注各種 UI 技術。

UI 主題設計器和基于 HTML 的 UI 框架（如 SAPUI5 / OpenUI5、UI5 Web Components 和 Fundamental Library）基于主題基礎內容，該內容提供所有相關主題參數作為現代 CSS 變量。 通過 UI 主題設計器自定義這些參數，您可以根據 SAP 的標準主題創建自定義主題。

SAP UI5 對 Horizon 主題的支持情況

• SAPUI5 1.93.3 and 1.96.0: 支持 experimental preview 版本，以搜集用戶需求
• UI5 Web Components 1.0.0，以便在 Angular 和 React 里使用。

如何啟用 Horizon 主題

對 end user 來說，直接在 Fiori Launchpad 里選擇。

對于開發者來說，在 index.html 里添加一行代碼即可：

data-sap-ui-theme="sap_horizon"

更多Jerry的原創文章，盡在：“汪子熙”:

總結

以上是生活随笔為你收集整理的SAP Fiori 的 UI 新主题 Horizon的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。