Определение действий панели инструментов с помощью таблицы данных
Используйте структуру данных ToolbarAction, чтобы создать таблицу данных, определяющую действия, которые должны отображаться на панели инструментов. Каждая строка в таблице данных представляет действие на панели инструментов. Можно создать таблицу данных для конфигурирования виджета следующими способами:
• Задать число и тип отображаемых действий.
• Управлять порядком и положением действий.
• Управлять видимостью каждого действия на основе условия или события.
• Задать максимальную ширину для каждого действия.
В следующей процедуре описаны шаги для добавления и конфигурирования виджета "Панель инструментов".
1. Задайте функциональные требования, а затем определите вид действий, которые должны отображаться на панели инструментов.
2. В Composer создайте сервис конфигурации панели инструментов, который форматируется с помощью структуры данных ToolbarAction.
3. В Mashup Builder добавьте виджет "Панель инструментов" в мэшап, а затем добавьте сущность с сервисом конфигурации панели инструментов.
4. Привяжите свойство Все данные сервиса панели инструментов к свойству ActionsData виджета.
|
|
Связываемые свойства для каждого действия на панели инструментов отображаются на панели Свойства в следующем формате:
• <ActionID>_<имя свойства>
|
5. На панели Свойства сконфигурируйте виджет, а затем создайте привязки к другим виджетам или функциям.
Дополнительные сведения о свойствах виджета см. в разделе
Виджет "Панель инструментов" (с поддержкой тем).
Общие определения полей
• actionID - идентификатор действия в таблице данных. Это значение используется для идентификации каждого действия при конфигурировании виджета на панели Свойства в Mashup Builder.
• actionMaxWidth - определение поля, указывающее пользовательскую максимальную ширину для действия. По умолчанию каждое действие на панели инструментов отображается с использованием максимальной ширины 100 пикселей.
• actionTooltip - определяет содержимое сообщения всплывающей подсказки. Можно также добавить во всплывающую подсказку значок, используя свойство actionTooltipIcon.
• actionVisible - управляет видимостью действия на панели инструментов.
• actionDisabled - отключает действие. Можно программно управлять этим значением, чтобы включать или отключать действие в соответствии с условием в мэшапе.
• actionLabel - метка, отображаемая для действия на панели инструментов. Для действий кнопок и кнопок переключения метка отображается в действии.
• alignRight - выравнивает действие по правой области.
В дополнение к общим свойствам структура данных содержит определения полей, которые позволяют конфигурировать кнопки, кнопки переключения, ссылки и действия выпадающего списка. В следующем разделе перечислены доступные свойства для каждого типа действий с примером.
Кнопка
buttonIcon - задает значок, отображаемый на кнопке, с помощью ссылки на имя медиаобъекта.
Можно отобразить значки SVG из библиотеки значков SVG, используя следующий синтаксис cds:<icon_name>.
Дополнительные сведения о доступных значках см. в разделе
Использование значков SVG.
buttonType - определяет визуальную стилизацию, используемую для кнопки. Опции: primary, secondary, tertiary, danger, transparent.
Кнопка переключения
toggleChipIcon - указывает, следует ли отображать значок, показывающий состояние кнопки переключения. Опции: true, false.
toggleLabelPosition - управляет положением метки относительно значка. Опции: left, right.
| Действие кнопки переключения отображается в виде флажка и метки в меню переполнения, если размер области просмотра слишком мал для отображения всех действий. |
Ссылка
linkTargetWindow - указывает способ открытия связанного URL-адреса. Опции: new, same, popup.
linkType- тип ссылки.
Выпадающий список
• dropdownSeelctedText - позволяет выбрать элемент в выпадающем списке по умолчанию, используя текст значения. Например, используйте следующее выражение для выбора Item 2 по умолчанию:
dropdownSeelctedText: "value2";
• dropdownLabelPosition - указывает положение метки раскрывающегося списка. Опции: top, left.
• dropdownData - значение JSON, которое содержит данные для каждого элемента в списке. Каждый элемент представлен объектом JSON, который содержит имена полей и связанные значения. Например:
[{label:"Item 1", value: "value1"}, {label:"Item 2", value: "value2"}, {label:"Item 3", value: "value3"}]
Кнопка меню
• menuButtonData - значение JSON, которое содержит данные для каждого элемента меню на кнопке меню. Каждый элемент представлен объектом JSON, который содержит имена полей и связанные значения на основе структуры данных MenuEntry. Например:
[
{
"menuId": "item1",
"title": "Item 1",
"linkType": "Mashup",
"linkDestination": "Item1Mashup",
"isDefault": false,
"parentMenuId": "",
"imageURL": "item1_icon.png",
"linkTarget": "Replace",
"description": "Description for Item 1"
}
]
• DisplayMenuIcons - если равно false, значки для элементов кнопок меню скрыты.
• allowMissingMenuIcons - если равно false, а DisplayMenuIcons имеет значение true, значок по умолчанию отображается рядом с элементами меню без указанного значка в данных кнопки меню.
• selectedDataChanged - связываемое событие, которое инициируется при выборе пункта меню на кнопке меню.
Добавление фильтра данных
Можно использовать свойства виджета, чтобы добавить и сконфигурировать фильтр на левой или правой стороне панели инструментов. Дополнительные сведения см. в разделе
Виджет "Панель инструментов" (с поддержкой тем).
Упорядочивание действий на панели инструментов
Чтобы упорядочить действия на панели инструментов, используйте сервис данных виджета таблицы данных. Действия сортируются на основе их порядка в таблице данных. Кроме того, можно выровнять действия по правой стороне панели инструментов с помощью опции alignRight.
Структура данных ToolbarAction
В следующей таблице перечислены определения полей структуры данных ToolbarAction.
Определение поля | Описание | Базовый тип |
|---|
actionMaxWidth | Максимальная ширина действия на панели инструментов. | NUMBER |
toggleState | Состояние переключателя. | BOOLEAN |
toggleChipIcon | Показывает или скрывает значок скругленной кнопки, который используется для индикации выбора. | BOOLEAN |
actionTooltip | Всплывающая подсказка действия. | STRING |
actionVisible | Управляет видимостью действия. | BOOLEAN |
alignRight | Выравнивает действие по правой стороне панели инструментов. Чтобы выровнять действие по левой стороне, задайте для него значение false или пустое. | BOOLEAN |
actionLabel | Метка действия. | STRING |
actionTooltipIcon | Значок, отображаемый во всплывающей подсказке действия. | IMAGELINK |
actionType | Тип элемента, отображаемого для действия панели инструментов (кнопка, ссылка, выпадающий список, переключатель или кнопка меню). | STRING |
linkDestination | URL-адрес для ссылки. | STRING |
buttonIcon | Значок, отображаемый на кнопке. | IMAGELINK |
actionDisabled | Определяет, является ли действие интерактивным или выключенным. | BOOLEAN |
buttonType | Вариант отображения кнопок и кнопок меню. Можно выбрать "Первичные", "Вторичные", "Третичные", "Опасно!" или "Прозрачные". | STRING |
dropdownData | Значение JSON, которое содержит данные для каждого элемента выпадающего списка. Каждый элемент представлен объектом JSON, содержащим метку, значение и состояние элемента (необязательно). | JSON |
actionId | Это определение поля используется как основной ключ для таблицы данных. |
| Уникальный идентификатор для каждой строки в таблице данных. Каждый идентификатор используется как префикс для свойств связываемых действий на панели Свойства в Mashup Builder. | STRING |
linkTargetWindow | Управляет открытием окна цели ссылки. Можно открывать ссылку в новом окне, текущем окне или во всплывающем диалоговом окне (New, Same или Popup). | STRING |
linkType | Тип ссылки. | STRING |
dropdownSelectedText | Строковое значение элемента для выбора в выпадающем списке. | STRING |
toggleLabelPosition | Управляет положением метки кнопки переключения относительно значка состояния. Опции: left, right. | STRING |
menuButtonData | Значение JSON, которое содержит данные для каждого элемента меню на кнопке меню. Каждый элемент представлен объектом JSON, который содержит имена полей и связанные значения на основе структуры данных MenuEntry. | JSON |
displayMenuIcons | Если значение равно false, значки для кнопок меню скрыты. | BOOLEAN |
allowMissingMenuIcons | Если значение равно false, а DisplayMenuIcons имеет значение true, значок по умолчанию отображается рядом с элементами меню без указанного значка в данных кнопки меню. | BOOLEAN |