Сторонний контрол палитры цветов (для RX 4.9 - 4.11)

Авторы

• Идея, реализация на стороне Directum RX – Пушкарев Андрей Андреевич, прикладной разработчик ООО «РосА»;
• Реализация стороннего контрола – Кугушев Андрей Андреевич, руководитель группы прикладных разработчиков ООО «РосА»;

Преамбула

В рамках реализации требований от аналитиков на проекте столкнулись со следующим кейсом:

Создать справочник M;
Создать в справочнике N связанное свойство-ссылку на справочник M и вынести его контрол X на форму;
В справочнике N контрол X должен подсвечиваться цветом, указанным в связанной записи справочника M;
Администратор системы должен иметь возможность изменить цветовое выделение в проводнике при создании записи справочника M;

В веб-клиенте Directum RX существует функциональность цветовыделения контролов свойств. Есть возможность задавать подсветку предопределённой палитрой цветов Colors.Common или же использовать код цвета модели RGB глубиной 8 бит #RRGGBB (шестнадцатеричное представление красного, зелёного и синего каналов цвета от 0x00 до 0xFF соответственно). У системы есть возможность динамически менять цвет контрола при каждом обращении к нему или при обновлении формы. Получить итоговый цвет можно получить из строкового представления.

При использовании данного метода были выявлен недостаток — отсутствие визуализации цвета при определении его кодом #RRGGBB. Иначе говоря, увидеть цвет можно только по факту его определения в дополнительном свойстве и нужно использовать сторонние палитры цветов (например, в поисковике Яндекса).

Была поставлена задача реализации палитры цветов модели RGB глубиной 8 бит с помощью стороннего контрола.

Данный функционал позволит:

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

Реализация

В рамках выполняемой задачи были определены следующие ограничения:

• Подсветка задаётся для одного свойства одновременно - фиксируется жёсткая связка между свойством и контролом как «один к одному»;
• Используется дополнительное свойство для хранения кода цвета для каждого свойства;
• При определении кода цвета исключен альфа-канал (канал прозрачности из модели ARGB), так как при тестах было выявлено, что альфа-канал не влияет на отображение цвета веб-клиентом и всегда считается как 0xFF (полная непрозрачность);

При реализации палитры цветов были учтены следующие нюансы:

· Палитра цветов создается с помощью дистрибутива сторонних контролов на языке программирования TypeScript в связке с фреймворком ReactJS:

• отображение палитры;
• выборка цвета;
• изменение значения кода цвета через API самого Directum RX;

· Добавлена логика поддержки цветового кода с помощью свойства типа Строка и ранее созданного стороннего контрола со стороны Directum RX:

• добавлена проверка по регулярному выражению для свойства цветового кода в событии "Изменение значения свойства" и "Изменение значение контрола" в настроечном справочнике;
• добавлено изменение цвета подсветки свойства "Имя" из кода цвета в событии "Обновление формы" в событии "Изменение значения свойства" и "Изменение значение контрола" в настроечном справочнике;
• добавлено получение цвета из кода цвета в событии "Обновление формы" в основном справочнике;
• добавлена проверка корректности ввода и отображение ошибок в событии "Обновление формы" в настроечном справочнике;

С точки зрения разработки добавляется новое свойство типа Строка для хранения кода цвета, добавляется связка стороннего контрола с этим свойством и идёт обращение к данному значению вида:

_obj.State.Properties.Name.HighlightColor = Colors.Parse(_obj.ColorCode);

            где _obj.ColorCode — строковое преставление кода #RRGGBB, которое можно подтянуть через API со стороннего контрола палитры (без альфа-канала).

Теперь значение цвета можно визуально задавать в проводнике системы.

Результат

Варианты улучшения

• Привести оформление палитры цветов к единому с веб-клиентом стилем;
• Доработать отображение палитры цвета в зависимости от требования заказчиков;
• Дополнить настроечный справочник критериями, чтобы подбирать подсветку в зависимости от дополнительных условий;