Как в обычной форме 1С вывести картинку или флажок в списке вместо текста

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

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

Задача: замена текста на визуальный элемент

Представим ситуацию: у нас есть колонка "Проверен", имеющая тип Булево. По умолчанию система выводит в ней текст. Наша цель — скрыть текст и отобразить либо стандартный флажок, либо произвольную картинку из библиотеки. Разберем основные способы реализации этой задачи.

Способ 1: Использование стандартного флажка через ОформлениеСтроки

Это самый простой и быстрый способ, если вам достаточно стандартного флажка 1С. Основная работа происходит в событии табличного поля ПриВыводеСтроки. Рассмотрим программный код, который позволяет это сделать:


Процедура ДокументСписокПриВыводеСтроки(Элемент, ОформлениеСтроки, ДанныеСтроки)
    // Отключаем отображение стандартного текста (Да/Нет)
    ОформлениеСтроки.Ячейки.Проверен.ОтображатьТекст = Ложь;
    
    // Включаем отображение флажка
    ОформлениеСтроки.Ячейки.Проверен.ОтображатьФлажок = Истина;
    
    // Устанавливаем значение флажка на основе данных строки
    ОформлениеСтроки.Ячейки.Проверен.Флажок = ДанныеСтроки.Проверен;
    
    // Чтобы убрать лишние рамки и запретить редактирование прямо в списке
    ОформлениеСтроки.Ячейки.Проверен.ТолькоПросмотр = Истина;
КонецПроцедуры

Важный нюанс: Чтобы этот код работал корректно, убедитесь, что имя ячейки в ОформлениеСтроки.Ячейки совпадает с именем колонки, которое вы задали в конфигураторе или программно при добавлении через ЭлементыФормы.ДокументСписок.Колонки.Вставить().

Способ 2: Вывод произвольной картинки по условию

Если вместо флажка нужна специфическая иконка (например, из БиблиотекаКартинок), мы используем свойства ОтображатьКартинку и ИндексКартинки. Проанализируем пример кода:


Процедура ДокументСписокПриВыводеСтроки(Элемент, ОформлениеСтроки, ДанныеСтроки)
    Ячейка = ОформлениеСтроки.Ячейки.Статус;
    Ячейка.ОтображатьТекст = Ложь;
    Ячейка.ОтображатьКартинку = Истина;

    Если ДанныеСтроки.Проведен Тогда
        // Указываем индекс картинки из коллекции картинок строк табличного поля
        Ячейка.ИндексКартинки = 0; 
    Иначе
        Ячейка.ИндексКартинки = 2;
    КонецЕсли;
КонецПроцедуры

Для работы этого метода у самого табличного поля (списка) в свойствах должно быть заполнено поле КартинкиСтрок. Там выбирается коллекция картинок (набор иконок), а ИндексКартинки определяет, какая именно иконка из набора будет показана (счет идет от нуля). Для подбора подходящих значков можно использовать набор стандартных графических ресурсов и иконок платформы 1С.

Способ 3: Оптимизация через событие ПриПолученииДанных

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

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


Процедура ДокументСписокПриПолученииДанных(Элемент, ОформленияСтрок)
    // Подготовим массив ссылок для запроса
    МассивСсылок = Новый Массив;
    Для Каждого Оформление Из ОформленияСтрок Цикл
        МассивСсылок.Добавить(Оформление.ДанныеСтроки.Ссылка);
    КонецЦикла;

    // Выполняем один запрос вместо десятков
    // (Здесь должен быть ваш запрос к БД)
    
    Для Каждого Оформление Из ОформленияСтрок Цикл
        // Устанавливаем картинку напрямую из библиотеки без использования индексов
        Если ДокументПроверен(Оформление.ДанныеСтроки.Ссылка) Тогда
            Оформление.Ячейки.Проверен.УстановитьКартинку(БиблиотекаКартинок.ЗеленаяГалка);
        КонецЕсли;
    КонецЦикла;
КонецПроцедуры

Программное добавление колонок и привязки

Если вы добавляете колонку для картинки программно, рассмотрите метод Вставить у коллекции колонок. Часто после программного добавления элементов на форму (надписей или кнопок под списком) возникают проблемы с тем, что они "наезжают" друг на друга при изменении размера окна. Чтобы этого избежать, настроим привязки.

Проанализируем пример установки привязок для программно созданного флажка:


// Привязываем левую границу флажка к правой границе другого элемента
ЭлементФормы_Проверен.УстановитьПривязку(ГраницаЭлементаУправления.Лево, 
    ЭлементыФормы.ЗатратыВТабличнойЧасти, 
    ГраницаЭлементаУправления.Право);

// Привязываем правую границу к самому себе (левой части), чтобы элемент не растягивался
ЭлементФормы_Проверен.УстановитьПривязку(ГраницаЭлементаУправления.Право, 
    ЭлементФормы_Проверен, 
    ГраницаЭлементаУправления.Лево);

Подведем итоги

Для успешного вывода графики в списках обычных форм необходимо соблюдать следующие правила:

  1. Всегда отключать ОтображатьТекст, если вы выводите картинку или флажок в той же ячейке.
  2. Для простых условий (на основе реквизитов самой строки) используйте ПриВыводеСтроки.
  3. Для сложных условий с запросами к БД используйте только ПриПолученииДанных.
  4. Если используете ИндексКартинки, не забудьте назначить коллекцию в свойство КартинкиСтрок табличного поля.
  5. При программном создании элементов управления всегда задавайте УстановитьПривязку, чтобы интерфейс оставался адаптивным.

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

← На главную