SAP Fiori 3 的 Quartz Theme 在 WebClient UI 和 SAPGUI 中的应用

简介: SAP Fiori 3 的 Quartz Theme 在 WebClient UI 和 SAPGUI 中的应用

SAP Fiori 3 是支持智能套件(Intelligent Suite)的所有 SAP 产品的新目标设计。


基于 SAP Fiori 3 指南的新 SAP Quartz Light 主题现在可用于 WebClient UI.


Quartz Light 主题旨在让应用程序内容成为中心舞台。


由于它简单而简约,它还可以让客户轻松地将其主题化为他们的品牌。


如果客户在独立模式下使用 WebClient UI,则可以从个性化 - 个性化布局中选择 SAP Quartz Light 主题。


image.png


下图来自我的系统 QGL/504:

image.png


首先,我们会注意到标题栏中的变化,例如用户图标已从屏幕左侧移动到右侧。


单击用户图标会弹出用户操作菜单,可以访问与以前相同的功能,但现在是一个下拉列表,而不是通过 SAP Fiori 2.0 Me Area,如下所示:


image.png


可以使用菜单图标访问侧面板。


image.png


如果在 Fiori Launchpad 集成模式下使用 WebClient UI,可以从 FLP 用户设置 - 外观中选择 SAP Quartz Light 主题。 FLP 集成模式下的 WebClient UI 应用程序将以选定的主题显示。


image.png


除了更新 shell 标题栏中的操作位置外,SAP 还更新了应用程序中的操作位置,使按钮的位置更加直观。


替换了一些常用操作的图标以满足 SAP Fiori 3 的要求。


还实施了 Font 72 以提供 UX 一致性。


新的 SAP Quartz Light 主题已可用于 SAP S/4HANA S/4HANA Service(版本号为 SAP S/4HANA 1909)。


Fiori 3 Quartz Light theme 可以通过 SAP Note: 3132449 的方式打到 WEBCUIF 748/Ehp4 上去。


SAPGUI 软件里的 Quartz Theme:


image.png


在 SAP UI5 应用里使用 dark theme:


data-sap-ui-theme="sap_fiori_3_dark"


最后的效果:

image.png


将 SAP UI5 应用配置成 Fiori Launchpad 里的 tile,打开后的效果:



image.png

image.png


Quartz Dark 是为 SAP Fiori 应用程序创建的附加主题,用于在需要或不可避免的低光环境中工作。深色主题还确保简洁轻便的设计在所有 SAP Fiori 应用程序中保持一致和连贯。



相关文章
|
4月前
|
前端开发 编解码 数据格式
浅谈响应式编程在企业级前端应用 UI 开发中的实践
浅谈响应式编程在企业级前端应用 UI 开发中的实践
浅谈响应式编程在企业级前端应用 UI 开发中的实践
|
4月前
|
算法 数据可视化 程序员
【Qt UI】调色板QPalette类在Qt编程中的应用
【Qt UI】调色板QPalette类在Qt编程中的应用
112 0
|
4月前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
|
8天前
|
C# Android开发 开发者
Uno Platform 高级定制秘籍:深度解析与实践样式和模板应用,助你打造统一且高效的跨平台UI设计
【9月更文挑战第7天】Uno Platform 是一个强大的框架,支持使用 C# 和 XAML 创建跨平台 UI 应用,覆盖 Windows、iOS、Android、macOS 和 WebAssembly。本文介绍 Uno Platform 中样式和模板的应用,助力开发者提升界面一致性与开发效率。样式定义控件外观,如颜色和字体;模板则详细定制控件布局。通过 XAML 定义样式和模板,并可在资源字典中全局应用或嵌套扩展。合理利用样式和模板能简化代码、保持设计一致性和提高维护性,帮助开发者构建美观高效的跨平台应用。
21 1
|
14天前
|
vr&ar C# 图形学
WPF与AR/VR的激情碰撞:解锁Windows Presentation Foundation应用新维度,探索增强现实与虚拟现实技术在现代UI设计中的无限可能与实战应用详解
【8月更文挑战第31天】增强现实(AR)与虚拟现实(VR)技术正迅速改变生活和工作方式,在游戏、教育及工业等领域展现出广泛应用前景。本文探讨如何在Windows Presentation Foundation(WPF)环境中实现AR/VR功能,通过具体示例代码展示整合过程。尽管WPF本身不直接支持AR/VR,但借助第三方库如Unity、Vuforia或OpenVR,可实现沉浸式体验。例如,通过Unity和Vuforia在WPF中创建AR应用,或利用OpenVR在WPF中集成VR功能,从而提升用户体验并拓展应用功能边界。
28 0
|
14天前
|
C# 开发者 设计模式
WPF开发者必读:命令模式应用秘籍,轻松简化UI与业务逻辑交互,让你的代码更上一层楼!
【8月更文挑战第31天】在WPF应用开发中,命令模式是简化UI与业务逻辑交互的关键技术,通过将请求封装为对象,实现UI操作与业务逻辑分离,便于代码维护与扩展。本文介绍命令模式的概念及实现方法,包括使用`ICommand`接口、`RelayCommand`类及自定义命令等方式,并提供示例代码展示如何在项目中应用命令模式。
24 0
|
14天前
|
开发者 Android开发 UED
打造流畅应用:深入探索如何在Xamarin项目中选择并实现最佳UI/UX设计的实践指南
【8月更文挑战第31天】在数字化时代,UI/UX设计成为应用成功的关键。Xamarin以高效开发和强大兼容性著称,其设计理念“一次编写,处处运行”需充分适应多平台特性,提供一致体验。选择Xamarin.Forms或结合Xamarin.Native可实现跨平台UI设计;遵循各平台设计指南,保持布局一致性和简洁性;通过用户测试不断优化。最终,结合技术和用户需求,打造美观实用的应用,脱颖而出。
25 0
|
2月前
|
IDE 程序员 开发工具
IDEA插件-Material Theme UI/IDEA最强主题插件/IDEA图标美化
"Material Theme UI" 是一个用于 JetBrains IDE(如 IntelliJ IDEA、WebStorm、Android Studio 等)的插件,它将原始外观改为 Material Design 风格,并提供丰富的选项来根据个人喜好配置 IDE。
493 0
IDEA插件-Material Theme UI/IDEA最强主题插件/IDEA图标美化
|
3月前
|
Android开发 开发者
Android UI设计中,Theme定义了Activity的视觉风格,包括颜色、字体、窗口样式等,定义在`styles.xml`。
【6月更文挑战第26天】Android UI设计中,Theme定义了Activity的视觉风格,包括颜色、字体、窗口样式等,定义在`styles.xml`。要更改主题,首先在该文件中创建新主题,如`MyAppTheme`,覆盖所需属性。然后,在`AndroidManifest.xml`中应用主题至应用或特定Activity。运行时切换主题可通过重新设置并重启Activity实现,或使用`setTheme`和`recreate()`方法。这允许开发者定制界面并与品牌指南匹配,或提供多主题选项。
43 6
|
3月前
|
Android开发 开发者
Android UI中的Theme定义了Activity的视觉风格,包括颜色、字体、窗口样式等。要更改主题
【6月更文挑战第25天】Android UI中的Theme定义了Activity的视觉风格,包括颜色、字体、窗口样式等。要更改主题,首先在`styles.xml`中定义新主题,如`MyAppTheme`,然后在`AndroidManifest.xml`中设置`android:theme`。可应用于全局或特定Activity。运行时切换主题需重置Activity,如通过`setTheme()`和`recreate()`方法。这允许开发者定制界面以匹配品牌或用户偏好。
35 2