Как реализовать динамическую смену картинки в табличной части документа в зависимости от значения реквизита?

Программист 1С v8.3 (Управляемые формы) IT и автоматизация бизнеса
← На главную

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

Метод 1: Использование индекса картинки из коллекции

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

Во-первых, проанализируем структуру коллекции. Чтобы 1С понимала, какую часть картинки показывать, мы должны подготовить файл, в котором несколько иконок расположены в ряд. Например, если нам нужны две иконки размером 16х16 пикселей, общий размер файла должен составлять 32х16 пикселей. В конфигураторе, при добавлении такой картинки в общие картинки, необходимо правильно указать количество кадров.

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

  1. Путь к данным: указываем числовой реквизит табличной части (например, ИндексКартинки).
  2. Картинка значений: выбираем нашу коллекцию из библиотеки картинок.
  3. Вид: устанавливаем значение "Поле картинки".

Важно помнить, что индексация в 1С начинается с 0. Если реквизит имеет значение 0, будет показана первая иконка из коллекции, если 1 — вторая, и так далее. Для типа Булево платформа делает автоматическое приведение: Ложь соответствует индексу 0, а Истина — индексу 1. Однако, как отмечают участники обсуждения, иногда требуется инверсия или более сложная логика, которую можно реализовать в запросе или кодом.

Посмотрим на пример кода, который может использоваться для динамического вычисления индекса в запросе (например, при получении данных для динамического списка или заполнении ТЧ):


ВЫБОР 
    КОГДА ТЧ.Статус = ЗНАЧЕНИЕ(Перечисление.Статусы.Выполнено) ТОГДА 0 
    КОГДА ТЧ.Статус = ЗНАЧЕНИЕ(Перечисление.Статусы.ВРаботе) ТОГДА 1 
    ИНАЧЕ 2 
КОНЕЦ КАК НомерКартинки

Метод 2: Использование Условного оформления (рекомендуемый подход)

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

Разберем алгоритм настройки условного оформления:

  1. Перейдем на закладку "Условное оформление" в редакторе формы.
  2. Добавим новое правило. В "Оформлении" выберем параметр Картинка и укажем нужную иконку из библиотеки (например, БиблиотекаКартинок.Завершено).
  3. В "Условии" укажем: Объект.Товары.Активен Равно Истина.
  4. В "Оформляемых полях" выберем колонку, в которой должна появиться эта картинка.

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

Метод 3: Программное изменение значения при клике

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

Выясним причину, по которой картинка может не меняться или "исчезать". Как отметил автор темы, критически важна инициализация значений. Если реквизит, отвечающий за индекс картинки, не заполнен (имеет значение NULL или не определен), 1С может ничего не отображать. Поэтому при создании документа или добавлении новой строки в табличную часть необходимо явно устанавливать начальное значение.

Рассмотрим пример процедуры обработки клика, которая переключает картинку (индекс):


&НаКлиенте
Процедура ТоварыВыбор(Элемент, ВыбраннаяСтрока, Поле, СтандартнаяОбработка)
    
    Если Поле.Имя = "ТоварыИндексКартинки" Тогда
        СтандартнаяОбработка = Ложь; // Отменяем стандартное редактирование
        
        ТекущиеДанные = Элементы.Товары.ТекущиеДанные;
        Если ТекущиеДанные <> Неопределено Тогда
            // Переключаем индекс между 0 и 1
            ТекущиеДанные.ИндексКартинки = ?(ТекущиеДанные.ИндексКартинки = 0, 1, 0);
        КонецЕсли;
    КонецЕсли;
    
КонецПроцедуры

Чтобы изменение отразилось мгновенно и поле вело себя отзывчиво, установите для элемента формы свойство РежимРедактирования в значение Непосредственно. Это позволит избежать лишних кликов для активации ячейки.

Технические тонкости работы с коллекциями

Проанализируем особенности хранения картинок, упомянутые в обсуждении. Если вы используете коллекцию размером, например, 32х16, где две иконки 16х16 стоят рядом, важно убедиться, что свойство элемента РазмерКартинки установлено в значение РеальныйРазмер или Авто. Если 1С попытается растянуть или сжать коллекцию, индексы могут "поплыть", и пользователь увидит куски соседних иконок.

Также стоит обратить внимание на инициализацию при открытии формы. Если данные в табличной части загружаются программно, не забудьте обойти строки и установить корректные индексы:


&НаСервере
Процедура ПриСозданииНаСервере(Отказ, СтандартнаяОбработка)
    
    Для Каждого СтрокаТЧ Из Объект.Товары Цикл
        // Устанавливаем начальные картинки на основе булева флага
        СтрокаТЧ.ИндексКартинки = ?(СтрокаТЧ.ФлагОшибки, 1, 0);
    КонецЦикла;
    
КонецПроцедуры

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

← На главную