关于sap:SAP-Fiori-的-UI-新主题-Horizon

44次阅读

共计 1046 个字符,预计需要花费 3 分钟才能阅读完成。

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 的原创文章,尽在:” 汪子熙 ”:

正文完
 0