Как динамически отображать разные картинки в строках динамического списка 1С:Предприятие?

Программист 1С v8.3 (Управляемые формы)
← К списку

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

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

Отображение картинок в динамическом списке с помощью вычисляемых полей СКД

Этот метод является одним из наиболее распространенных и рекомендованных для динамических списков, поскольку он позволяет декларативно задавать логику отображения картинок. Он основан на использовании вычисляемых полей в СКД, которые возвращают индекс или ссылку на нужную картинку.

Давайте разберем этот подход по шагам.

  1. Подготовка изображений

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

    Если нам нужно отображать разные изображения в зависимости от условий, мы можем объединить несколько иконок в одно составное изображение, так называемую коллекцию картинок. Например, четыре иконки 16x16 могут быть объединены в одно изображение 64x16 пикселей. Это значительно упрощает управление иконками.

    Подготовленные изображения следует добавить в конфигурацию как

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

  2. Настройка динамического списка и вычисляемого поля

    Теперь перейдем к настройке самого динамического списка.

    • В настройках динамического списка (который использует СКД) нам необходимо создать вычисляемое поле.
    • Выражение для этого вычисляемого поля должно возвращать числовой индекс картинки из выбранной коллекции или ссылку на саму картинку, если она не индексируемая.
    • Посмотрим на пример выражения для вычисляемого поля, которое возвращает индекс картинки в зависимости от статуса документа:
      
      ВЫБОР
          КОГДА ИсточникДанных.Статус = &СтатусВыполнен Тогда 0 // Индекс первой картинки (например, зеленая галочка)
          КОГДА ИсточникДанных.Статус = &СтатусВРаботе Тогда 1 // Индекс второй картинки (например, желтый круг)
          Иначе 2 // Индекс третьей картинки (например, красный крест)
      КОНЕЦ
      
      Здесь
      
      ИсточникДанных.Статус
      
      – это поле, по которому мы определяем условие, а
      
      &СтатусВыполнен
      
      и
      
      &СтатусВРаботе
      
      – это параметры СКД, которые мы можем установить в настройках динамического списка или в коде.
    • Для колонки табличного поля на форме, где должна отображаться картинка, нам нужно установить свойство "ТипЗначения" в
      
      Картинка
      
      .
    • Далее, в свойствах элемента формы
      
      Таблица
      
      (который связан с динамическим списком), нам необходимо указать два ключевых свойства:
      • Свойство "КартинкаСтрок" (
        
        Row Picture
        
        ) – сюда мы указываем ссылку на ту общую картинку, которая содержит нашу коллекцию изображений. Например,
        
        БиблиотекаКартинок.СтатусыДокументов
        
        .
      • Свойство "ПутьКДаннымКартинкиСтроки" (
        
        Row Picture Data Path
        
        ) – сюда мы указываем путь к созданному нами вычисляемому полю, которое возвращает индекс нужной картинки в этой коллекции. Например,
        
        Список.ИндексСтатуса
        
        , где
        
        ИндексСтатуса
        
        – это имя нашего вычисляемого поля.
  3. Важность версии платформы и режима совместимости

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

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

Оптимизация производительности: вычисление картинки непосредственно в запросе

Хотя вычисляемые поля СКД удобны, иногда для сложных условий определения картинки или при необходимости выполнения объемных расчетов рекомендуется переносить вычисление непосредственно в запрос. Эта рекомендация связана с производительностью, особенно для больших динамических списков.

Давайте проанализируем, почему это важно и как это реализовать.

  1. Производительность динамических списков

    Динамические списки предъявляют высокие требования к скорости выполнения запросов, поскольку данные непосредственно отображаются пользователю, и скорость вывода и обновления критична. Сложные вычисления, выполняемые в вычисляемых полях СКД для каждой строки, могут замедлить работу списка, особенно если они требуют обращения к другим данным или выполнения ресурсоемких операций.

  2. Вычисление в запросе с использованием временных таблиц

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

    Платформа 1С:Предприятие поддерживает пакетные запросы, позволяющие использовать временные таблицы в динамических списках, начиная с версии 8.3.8. Это работает при условии, что режим совместимости не установлен ниже 8.3.8.

    Посмотрим на пример запроса, который вычисляет индекс картинки:

    
    ВЫБРАТЬ
        Документ.Ссылка КАК Ссылка,
        Документ.Дата КАК Дата,
        Документ.Сумма КАК Сумма,
        ВЫБОР
            КОГДА Документ.Проведен И Документ.Сумма > 0 Тогда 0 // Зеленая иконка
            КОГДА Документ.Проведен И Документ.Сумма = 0 Тогда 1 // Желтая иконка
            КОГДА НЕ Документ.Проведен Тогда 2 // Красная иконка
            Иначе 3 // Серая иконка
        КОНЕЦ КАК ИндексКартинки
    ИЗ
        Документ.РеализацияТоваровУслуг КАК Документ
    

    В этом примере мы вычисляем поле

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

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

Программное управление отображением картинок и работа с внешними изображениями

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

  1. Обработчик события "ПриВыводеСтроки"

    Мы можем использовать обработчик события

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

    Посмотрим на пример кода:

    
    &НаСервере
    Процедура СписокПриВыводеСтроки(Элемент, ОформлениеСтроки, ДанныеСтроки)
    
        // Предполагаем, что у нас есть колонка "СтатусКартинка"
        // и в ДанныеСтроки есть поле "Статус"
        Если ДанныеСтроки.Статус = Перечисления.СтатусыДокументов.Выполнен Тогда
            ОформлениеСтроки.Ячейки.СтатусКартинка.Картинка = БиблиотекаКартинок.ЗеленаяГалочка;
        ИначеЕсли ДанныеСтроки.Статус = Перечисления.СтатусыДокументов.ВРаботе Тогда
            ОформлениеСтроки.Ячейки.СтатусКартинка.Картинка = БиблиотекаКартинок.ЖелтыйКруг;
        Иначе
            ОформлениеСтроки.Ячейки.СтатусКартинка.Картинка = БиблиотекаКартинок.КрасныйКрест;
        КонецЕсли;
    
        ОформлениеСтроки.Ячейки.СтатусКартинка.ОтображатьКартинку = Истина;
    
    КонецПроцедуры
    

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

  2. Отображение внешних изображений (по URL)

    В некоторых специфических случаях, когда медиа-контент хранится вне 1С (например, на сайте, в CDN или S3), мы можем использовать вычисляемое поле в запросе, которое возвращает URL изображения. Затем на форме реквизит типа

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

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

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

← К списку