SAP UI5 — Тематизация

Дизайнер тем пользовательского интерфейса — это инструмент на основе браузера, который позволяет разрабатывать темы, изменяя один из шаблонов тем, предоставляемых SAP.

Пример. Вы можете изменить цветовую схему или добавить логотип своей компании. Инструмент обеспечивает предварительный просмотр темы в процессе проектирования.

Используйте свой корпоративный брендинг и обратите внимание на приложения, созданные с использованием технологий SAP UI. Дизайнер тем пользовательского интерфейса — это браузерный инструмент для перекрестных тем. Используйте его, чтобы легко создавать темы фирменного стиля, изменив один из шаблонов тем, предоставляемых SAP. Например, вы можете изменить цветовую схему или добавить логотип вашей компании. Инструмент предназначен для разных групп пользователей, включая разработчиков, визуальных дизайнеров и администраторов.

Поддерживаемая платформа

• SAP NetWeaver как ABAP (через UI Add-On 1.0 SP4)
• Портал SAP NetWeaver (версия 7.30 SP10 и выше)
• SAP HANA Cloud (планируется)
• Портал SAP NetWeaver (запланировано 7.02)

Основные характеристики и преимущества

• Графический WYSIWYG-редактор на основе браузера — изменяет значения параметров темы и сразу видит, как это влияет на визуализацию выбранной страницы предварительного просмотра.

• Встроенные страницы предварительного просмотра — выберите встроенные страницы предварительного просмотра, чтобы увидеть, как будет выглядеть ваша пользовательская тема при применении к приложению.

  • Предварительный просмотр приложения (пример: утверждение заказа на поставку, панель запуска SAP Fiori)

  • Контрольные превью

• Различные уровни темы —

  • Быстрое создание тем (основные настройки кросс-технологий)

  • Экспертная тематика (настройки темы для конкретной технологии)

  • Ручное редактирование LESS или CSS

• Цветовая палитра для повторного использования — задает набор параметров с основными значениями цвета, определяющими ваш фирменный стиль.

• Перекрестная технология — создайте одну непротиворечивую тему, которая применяется к различным клиентам и технологиям SAP UI —

  • Стандартные библиотеки SAPUI5 (включая приложения SAP Fiori и панель запуска SAP Fiori)

  • Унифицированные технологии рендеринга (такие как Web Dynpro ABAP и Floorplan Manager)

  • Бизнес-клиент SAP NetWeaver

Графический WYSIWYG-редактор на основе браузера — изменяет значения параметров темы и сразу видит, как это влияет на визуализацию выбранной страницы предварительного просмотра.

Встроенные страницы предварительного просмотра — выберите встроенные страницы предварительного просмотра, чтобы увидеть, как будет выглядеть ваша пользовательская тема при применении к приложению.

Предварительный просмотр приложения (пример: утверждение заказа на поставку, панель запуска SAP Fiori)

Контрольные превью

Различные уровни темы —

Быстрое создание тем (основные настройки кросс-технологий)

Экспертная тематика (настройки темы для конкретной технологии)

Ручное редактирование LESS или CSS

Цветовая палитра для повторного использования — задает набор параметров с основными значениями цвета, определяющими ваш фирменный стиль.

Перекрестная технология — создайте одну непротиворечивую тему, которая применяется к различным клиентам и технологиям SAP UI —

Стандартные библиотеки SAPUI5 (включая приложения SAP Fiori и панель запуска SAP Fiori)

Унифицированные технологии рендеринга (такие как Web Dynpro ABAP и Floorplan Manager)

Бизнес-клиент SAP NetWeaver

Вы можете создавать темы приложений, которые не используют следующие элементы пользовательского интерфейса:

Вы можете использовать только темы, созданные с помощью дизайнера тем пользовательского интерфейса для приложений Web Dynpro ABAP, начиная с SAP NetWeaver 7.0 EHP2

NWBC for Desktop (4.0 или более поздняя версия): Вы можете использовать темы оболочки NWBC и обзорные страницы (страница указателя, страница новой вкладки, карта служб).

NWBC для HTML (3.6): Вы можете оформить карту сервиса. Оболочка не может быть тематической.

Как вызвать дизайнера тем в SAP Fiori?

Шаг 1 — Войдите на сервер переднего плана SAP Fiori. Вы можете использовать T-Code: Theme Designer или использовать ярлык, как показано на следующем снимке экрана, и войти в систему.

Шаг 2. После входа в систему вы получите все шаблоны по умолчанию, предоставленные SAP для Theme Designer. Выберите тему по умолчанию и нажмите Открыть.

Шаг 3 — введите ссылку Fiori Launchpad и название приложения и нажмите «Добавить».

Шаг 4 — С правой стороны панели экрана вы можете выбрать Цвет, Шрифт, Изображение и другие свойства. Вы можете редактировать цвета, как показано на следующих скриншотах.

Шаг 5 — Чтобы сохранить тему, вы можете нажать значок Сохранить, как показано на следующем снимке экрана. У вас также есть возможность сохранить и построить вариант.

После того, как вы нажмете «Сохранить и построить», он начнет сохранять, а после завершения вы получите подтверждающее сообщение — «Сохранить и построить завершено».

Шаг 6 — Чтобы получить ссылку на эту тему, используйте T-код, как показано на следующем скриншоте —

Шаг 7 — Выберите созданную вами тему и перейдите на вкладку «Информация».

Шаг 8 — Используйте Ctrl + Y, чтобы скопировать URL-адрес с экрана и запишите это.

Поддерживаемые темы

Это стандартные темы, которые поставляются с UI5 —

• Синий кристалл
• Отражение золота
• Мобильная визуальная идентификация
• Сверхконтрастный черный

Типы диаграмм

В библиотеке диаграмм sap.viz.ui5 есть различные типы диаграмм, которые можно использовать для представления бизнес-данных. Ниже приведены некоторые типы диаграмм CVOM: столбец, пузырь, линия, круговая диаграмма и т. Д.