Как программно установить картинку из файла на кнопку или элемент формы в 1С 8.3

← На главную

При разработке интерфейсов на управляемых формах 1С 8.3 программисты часто сталкиваются с задачей динамической смены иконок. Казалось бы, задача тривиальная: есть объект КнопкаФормы, у него есть свойство Картинка. Однако при попытке присвоить этому свойству объект, созданный из двоичных данных или файла, разработчик получает либо ошибку, либо отсутствие результата. В этой статье мы подробно разберем, почему стандартный метод не работает и какими способами можно реализовать динамическое отображение графики.

Разбор проблемы: почему КнопкаФормы.Картинка имеет ограничения

Для начала проанализируем поведение платформы. Согласно официальной справке, свойство Картинка объекта КнопкаФормы доступно для чтения и записи, но имеет существенное примечание: если картинка задается программно, она может быть либо пустой, либо взятой из библиотеки картинок конфигурации. Это означает, что платформа на уровне ядра управляемого интерфейса не умеет «на лету» привязывать к обычной кнопке навигационные ссылки вида e1cib/tempstorage/....

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

Решение №1: Использование декорации-картинки с обработчиком нажатия

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

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

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


&НаСервере
Процедура УстановитьКартинкуНаФормуНаСервере(ПолныйПутьКФайлу)
    
    // Создаем объект картинки из файла на сервере
    НоваяКартинка = Новый Картинка(ПолныйПутьКФайлу);
    
    // Помещаем картинку во временное хранилище. 
    // Используем УникальныйИдентификатор формы, чтобы данные удалились вместе с закрытием формы.
    Адрес = ПоместитьВоВременноеХранилище(НоваяКартинка, УникальныйИдентификатор);
    
    // Присваиваем адрес реквизиту, который связан с полем картинки на форме
    Объект.АдресКартинкиКнопки = Адрес;
    
КонецПроцедуры

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

Решение №2: Использование шрифтов-иконок (Icon Fonts)

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

Рассмотрим, как это работает:

Установим в операционной системе шрифт с иконками или включим его в состав конфигурации как макет.
Для обычной кнопки в свойстве Шрифт выберем наш иконочный шрифт.
В поле Заголовок кнопки программно запишем код символа, который соответствует нужной иконке.

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

Решение №3: Поле HTML-документа для максимальной кастомизации

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

Выясним, как передать картинку в HTML. Мы можем конвертировать двоичные данные картинки в строку Base64 и вставить её прямо в код страницы. Посмотрим на пример формирования HTML-кода:


&НаСервере
Функция СформироватьКодКнопки(ДвоичныеДанныеКартинки)
    
    СтрокаBase64 = Base64Строка(ДвоичныеДанныеКартинки);
    
    // Формируем HTML с кнопкой и встроенным изображением
    ТекстHTML = "<html><body>
                |<button onclick='window.external.OnClick();' style='background:none; border:none;'>
                |<img src='data:image/png;base64," + СтрокаBase64 + "' />
                |</button>
                |</body></html>";
    
    Возврат ТекстHTML;
    
КонецФункции

Для обработки нажатия в 1С используется событие ПриНажатии у поля HTML-документа. Этот метод позволяет полностью обойти ограничения платформы по работе с кнопками, так как внутри HTML-контейнера вы вольны использовать любые графические ресурсы.

Важные нюансы работы с временным хранилищем и кэшированием

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

При вызове функции ПоместитьВоВременноеХранилище, если вы передаете один и тот же адрес (навигационную ссылку), платформа может решить, что данные не изменились. Чтобы гарантированно обновить картинку, рекомендуется всегда генерировать новый адрес или использовать Новый УникальныйИдентификатор() в качестве ключа, если это допустимо бизнес-логикой. Однако самым надежным способом является очистка реквизита перед помещением нового значения:


// Сначала очищаем старую ссылку
Объект.АдресКартинкиКнопки = "";
// Затем помещаем новые данные
Объект.АдресКартинкиКнопки = ПоместитьВоВременноеХранилище(НоваяКартинка);

Сводная таблица методов

Подводя итог, выделим основные сценарии использования рассмотренных методов:

Декорация типа Картинка: Оптимально для большинства задач, когда нужно заменить одну статичную картинку на другую из файла.
Шрифты-иконки: Идеально для типовых интерфейсных решений (кнопки «Ок», «Отмена», «Печать»), где важна скорость работы и масштабируемость.
HTML-поле: Используется в сложных интерфейсах, где 1С выступает лишь каркасом для веб-технологий.

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