Сегодня мы расскажем о новом элементе для дашбордов – Кнопке (Button). Это специальный элемент, который предоставляет возможность выполнять различные сценарии по нажатию или в зависимости от состояния.

Сценарии

Сценарий, он же скрипт, может быть создан с помощью Blockly или синтаксиса языка платформы, на которой реализован Stimulsoft продукт. Напомним, что сценарий созданный с помощью Blockly является универсальным для всех платформ и будет работать в режиме Интерпретации. Более подробно мы писали об этом здесь. Но обо всем по порядку. И начнем, пожалуй, с простого – добавления элемента на дашборд.

Добавить элемент Кнопка на дашборд можно с вкладки Вставить (Insert) или Инструментария (Toolbox). Также этот элемент может быть скопирован в буфер обмена и вставлен из него, или скопирован с помощью кнопки ctrl в дизайнере отчетов. После того как Кнопка добавлена на дашборд, следует определить ее тип, создать сценарий и настроить её визуальное оформление. Этот элемент не имеет собственного редактора, и вся его настройка осуществляется при помощи свойств элемента.

Типы кнопки

Элемент Кнопка может быть представлен в трех типах. Все они знакомы пользователям. В той или иной степени, все сталкивались с ними на web страницах или приложениях.

  • Button
    Первый тип, который и используется по умолчанию для этого элемента, так и называется – Кнопка. Как правило, его основное предназначение – выполнение сценария по нажатию.

  • Check Box
    Второй тип, который может быть применен к элементу – Флажок (Check Box). Основное отличие от типа Кнопка: флажок может иметь два состояния – Отмечено (Checked) и Не отмечено (Unchecked). Этот тип может выполнять сценарий по нажатию, но, что более актуально, может определить сценарий в зависимости от состояния. Также, используя свойство элемента Отмечено, можно определить состояние по умолчанию для флажка – Отмечено или Не отмечено.

  • Radio Button
    Третий тип элемента – Переключатель (Radio Button). Этот тип похож на флажок, но Переключатель можно сгруппировать в один элемент управления, используя свойство Группа (Group). Формирование кнопок в группы осуществляется по общим правилам группировки элементов на дашборде. В состоянии Отмечено может быть только одна кнопка из группы.

События кнопки

Для кнопки на данный момент доступны два сценария: При нажатии (Click) и Изменение отметки (Checked Changed). Первое событие актуально для всех типов элемента, второе возникает только тогда, когда состояние, определенное при помощи свойства Отмечено (Checked), изменяется со значения по умолчанию. Соответственно, событие изменения состояния кнопки актуально для типов Флажок и Переключатель.

Вызвать редактор сценария для события При нажатии можно с помощью двойного щелчка по элементу Кнопка или нажав кнопку Обзор (Browse) на панели свойств на вкладке События (Event). Вызвать редактор для события Изменение отметки можно на вкладке События.

Основные свойства

Основные свойства позволяют определить поведение элемента и располагаются на панели свойств в группе Кнопка. Немного о некоторых свойствах мы уже рассказывали выше. Они помогают определить тип элемента, его группу, состояние элемента по умолчанию. Также можно указать необходимый текст на кнопке, используя одноименное свойство, и значок. Значок, он же иконка, в это случае может быть общим или, в зависимости от состояния – Отмечено или Не отмечено.

Кроме этого, к основной возможности относится выбор типа геометрии элемента. Кнопка может быть представлена в виде прямоугольника или окружности. Прямоугольник в свою очередь можно превратить в квадрат, если сделать высоту и ширину элемента одинаковой.

Есть еще один важный нюанс в поведении элемента, который можно определить с помощью основных свойств.
Напоминание!

Дашборд представляет собой безразмерную область при просмотре и растягивается на величину окна вьювера, если иное не определено настройками самого дашборда. Элементы дашборда также растягиваются пропорционально своим размерам.
Кнопка как элемент обладает настройкой поведения при растягивании. Она может растягиваться как по высоте и ширине, так и только по ширине. Это определяется при помощи свойства элемента Растягивать (Stretch).

Основные настройки помогают определить поведение, тип и форму кнопки. А вот визуальное оформление выполняется с использованием других свойств и требует дополнительного рассмотрения.

Визуальная настройка элемента

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

Кроме того, все свойства оформления можно разделить на:

  • Общие.
    То есть те, что присутствуют и для других элементов панели индикаторов. Например, кисть, стиль, тень, радиус закругления.

  • Специальные.
    То есть те, которые доступны только для этого элемента, и в данном случае, это свойства из группы Визуальные состояния (Visual States).

При настройке кнопки с использованием стиля, необходимо использовать стиль типа Управление (Control). Свойство элемента Стиль (Style) при этом должно быть установлено в значение Авто (Auto), а другие, такие как кисть, кисть значка и кисть текста – в значение Из стиля (From Style). Все специальные свойства, в этом случае, должны быть установлены в значение Из состояния по умолчанию (From Default State). Стоит учитывать, что не все настройки оформления присутствуют в перечне свойств стиля. В частности, настроить цвет, тип, вид значка из стиля невозможно.

После того, как элемент кнопка добавлен и настроен, все что остается – это определить ей сценарий для события.

Сценарии кнопки

Действия, которые будет выполняться при возникновении событий и есть сценарий, скрипт. Благодаря доступному на момент публикации статьи функционалу вы можете определить сценарий изменения оформления элементов дашборда. Например, менять их стили, закруглять, изменять прозрачность, включать и выключать водяной знак и многое другое. Также при помощи кнопки вы можете организовать фильтрацию данных. Причем фильтровать можно как данные элементов, так и непосредственно запросы в источнике данных. Правда, для фильтрации данных необходимо будет использовать переменную отчета. Таким образом, вы можете создать панель параметров прямо на дашборде и адаптировать её оформление в стиле дашборда.

Мы подготовили несколько примеров дашбордов, чтобы вы могли посмотреть простые сценарии:

  • Дашборд с кнопками, который демонстрирует возможности изменения настроек оформления.



  • Дашборд с фильтрацией данных в запросе. В этом примере демонстрируется фильтрация в преобразовании данных, но точно такой же принцип распространяется и на фильтрацию запроса к хранилищу данных.



Также несколько примеров вы сможете найти в нашем онлайн-хранилище отчетов по запросу Button. В частности, пример фильтрации данных в элементах дашборда.
В дополнение, мы подготовили подробное видео с демонстрацией основных возможностей нового элемента дашбордов.

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