При программном выводе элементов на управляемую форму разработчики часто сталкиваются с ситуацией, когда созданные через код элементы выравниваются совсем не так, как добавленные интерактивно в редакторе. Например, при попытке вывести каталог товаров с изображениями картинки растягиваются на всю ширину формы, а соседний текст смещается. Выясним причину такого поведения и разберем по шагам, как правильно настроить свойства программных элементов управления.
Проанализируем поведение движка компоновки управляемых форм 1С. Когда элемент добавляется в конструкторе форм вручную, платформа автоматически подбирает оптимальные параметры автопривязки. Однако при программном создании вызовом метода Элементы.Добавить() платформа по умолчанию устанавливает флагам РастягиватьПоГоризонтали и РастягиватьПоВертикали значение Истина.
Дополнительно на поведение влияют следующие факторы:
АвтоМаксимальнаяШирина = Истина и АвтоМаксимальнаяВысота = Истина, из-за чего платформа игнорирует явно заданные размеры и масштабирует элемент под окно.Рассмотрим, как ограничить размеры элемента и сделать так, чтобы картинки или поля не растягивались по ширине формы. Для этого необходимо явно переопределить свойства элемента сразу после его создания.
Посмотрим на пример программного создания поля картинки с фиксированными размерами:
НовыйЭлемент = Элементы.Добавить("КартинкаТовара", Тип("ПолеФормы"), ГруппаКонтейнер);
НовыйЭлемент.Вид = ВидПоляФормы.ПолеКартинки;
НовыйЭлемент.ПутьКДанным = "РеквизитКартинка";
// Отключаем автоматическое растягивание
НовыйЭлемент.РастягиватьПоГоризонтали = Ложь;
НовыйЭлемент.РастягиватьПоВертикали = Ложь;
// Отключаем автоматический расчет максимальной ширины и высоты
НовыйЭлемент.АвтоМаксимальнаяШирина = Ложь;
НовыйЭлемент.АвтоМаксимальнаяВысота = Ложь;
// Задаем явные размеры в символах
НовыйЭлемент.Ширина = 15;
НовыйЭлемент.Высота = 5;
// Настраиваем режим отображения самого изображения
НовыйЭлемент.РазмерКартинки = РазмерКартинки.Пропорционально;
Важно: Для свойства РазмерКартинки можно использовать значения системного перечисления: Пропорционально, РеальныйРазмер или Сжать. Выбор зависит от того, как именно изображение должно вписываться в отведенные рамки.
В процессе вывода плитки товаров или декоративных надписей часто требуется убрать внешнюю рамку у поля. В синтаксис-помощнике вызов свойства Рамка может не всегда выпадать в контекстном автодополнении (контекстной подсказке), из-за чего возникает ощущение, что управлять границей невозможно.
Разберем, как отключить или настроить рамку программно:
Рамка: для отключения отображения рамки задайте ему соответствующее значение типа ЭлементУправленияРамка или установкой соответствующего стиля оформления.ЦветРамки: если требуется полностью скрыть рамку визуально, можно задать прозрачный цвет или цвет фона формы (например, WebЦвета.Прозрачный).Рассмотрим пример отключения рамки у поля:
// Управление свойством рамки
ЭлементФормы = Элементы.Найти("КартинкаТовара");
Если ЭлементФормы <> Неопределено Тогда
ЭлементФормы.Рамка = Новый Рамка(ТипЛинииРамки.Нет);
КонецЕсли;
Генерация большого количества элементов (сотен картинок и текстов) непосредственно на управляемой форме через Элементы.Добавить() может существенно снизить производительность при открытии формы, так как каждый элемент требует ресурсов на клиентскую отрисовку. Рассмотрим альтернативные архитектурные решения:
ТабличныйДокумент. В ячейки таблицы выводятся рисунки через Область.Рисунки.Добавить() и текст под ними. Сетка и границы ячеек отключаются, создавая удобный плиточный каталог.border: none) и поведением картинок, а клики по товарам перехватываются событиями 1С.