В процессе разработки интерфейсов на управляемых формах часто возникает необходимость отобразить графическую информацию, которая хранится внутри конфигурации. Это может быть логотип компании, образец заполнения документа, схема проезда или любое другое статичное изображение. Несмотря на кажущуюся простоту, начинающие разработчики часто сталкиваются с тем, что картинка не отображается или отображается некорректно.
В этой статье мы подробно разберем механизм работы с изображениями, выясним, почему обычный тип реквизита Картинка не всегда подходит для формы, и научимся правильно настраивать масштабирование. Мы пройдем путь от создания макета до тонкой настройки элемента управления на форме.
Прежде всего, нам необходимо поместить файл изображения в саму конфигурацию. Для этого мы используем макеты. Разберем по шагам, как это сделать:
СхемаПроезда или Логотип.Важный нюанс: использование макетов типа "Двоичные данные" универсально, так как позволяет хранить любые файлы, но для простых картинок 1С также предлагает "Библиотеку картинок", о которой мы поговорим позже.
Типичная ошибка новичка — создание реквизита формы с типом Картинка. На управляемых формах поле, предназначенное для вывода изображения, работает не с самим объектом картинки, а с навигационной ссылкой (адресом) на это изображение в памяти сервера.
Проанализируем правильный алгоритм настройки реквизитов:
АдресКартинки.Если вы сначала создали строковый реквизит, а затем передумали и решили сделать его "Полем картинки", проверьте свойства элемента формы: в колонке "Вид" должно быть выбрано именно Поле картинки. Если в списке выбора этого пункта нет, значит, тип данных реквизита установлен неверно (например, Число или Дата вместо Строка).
Теперь рассмотрим программную часть. Нам нужно извлечь данные из макета на сервере, поместить их в специальную область памяти (временное хранилище) и передать адрес этой области нашему строковому реквизиту. Выясним причину, почему это делается именно так: клиентское приложение не имеет прямого доступа к макетам конфигурации, оно может только отображать данные по предоставленной ссылке.
Разберем пример кода, который обычно размещается в процедуре ПриСозданииНаСервере:
&НаСервере
Процедура ПриСозданииНаСервере(Отказ, СтандартнаяОбработка)
// Получаем макет из метаданных.
// Лучше использовать обращение через менеджер справочника/обработки,
// чтобы не тянуть весь тяжелый объект в память.
ДанныеМакета = Справочники.Организации.ПолучитьМакет("Логотип");
// Помещаем двоичные данные во временное хранилище.
// Вторым параметром передаем УникальныйИдентификатор формы.
// Это гарантирует, что картинка будет удалена из памяти автоматически при закрытии формы.
АдресКартинки = ПоместитьВоВременноеХранилище(ДанныеМакета, ЭтаФорма.УникальныйИдентификатор);
КонецПроцедуры
В этом примере АдресКартинки — это реквизит формы типа Строка, который связан с элементом типа Поле картинки. После выполнения этого кода форма получит адрес вида e1cib/tempstorage/... и самостоятельно отобразит изображение.
После того как изображение появилось на форме, мы часто сталкиваемся с тем, что оно либо слишком маленькое, либо обрезается, либо растягивается, искажая пропорции. Посмотрим на ситуацию со стороны пользователя: картинка должна выглядеть аккуратно независимо от размера окна.
Для управления отображением у элемента формы Поле картинки существует критически важное свойство — Размер картинки (в коде оно доступно через свойство РазмерКартинки). Рассмотрим основные варианты этого свойства:
Чтобы установить этот режим, выделите элемент формы в конфигураторе и в палитре свойств найдите категорию Использование, пункт Размер картинки.
Проанализируем несколько продвинутых сценариев, которые помогут сделать работу с изображениями более профессиональной.
Использование Библиотеки картинок. Если картинка статична (например, иконка или логотип программы) и не меняется программно, рассмотрите возможность добавления её в Общие -> Библиотека картинок. В этом случае программирование вообще не потребуется: в свойствах элемента формы "Поле картинки" в поле "Картинка" можно просто выбрать нужный объект из библиотеки.
Поддержка SVG. Начиная с версии платформы 8.3.10, 1С отлично поддерживает векторный формат SVG. Если ваша схема или логотип сохранены в SVG, они будут идеально четкими при любом масштабировании формы. Механизм вывода через ПоместитьВоВременноеХранилище для них абсолютно такой же.
Интерактивность. Если вы хотите, чтобы при нажатии на картинку происходило какое-то действие (например, открытие полноразмерного фото), установите у элемента формы свойство Гиперссылка в значение Истина. После этого станет доступно событие Нажатие, в котором можно прописать логику открытия файла или модального окна.
Очистка памяти. Хотя мы использовали УникальныйИдентификатор формы для автоматической очистки, при динамической смене множества тяжелых изображений (например, в каталоге товаров) память сервера может нагружаться. В таких случаях перед помещением новой картинки можно явно очищать предыдущий адрес, используя метод УдалитьИзВременногоХранилища, хотя для большинства бизнес-задач стандартного механизма очистки по закрытию формы вполне достаточно.
Таким образом, мы рассмотрели полный цикл вывода изображения. Главное — помнить про правильный тип реквизита (строка) и не забывать про настройки масштабирования, чтобы ваш интерфейс выглядел профессионально на любых мониторах.