При разработке интерфейсов на управляемых формах 1С программисты часто сталкиваются с проблемой «пляшущих» элементов. В отличие от обычных форм, где мы могли позиционировать каждый пиксель, управляемый интерфейс стремится к динамическому распределению пространства. В этой статье мы подробно разберем, как приручить механизмы платформы и добиться идеального расположения элементов в две колонки, сохранив при этом адаптивность формы.
Рассмотрим самый надежный способ разделения формы на две основные части. Этот метод позволяет создать две независимые колонки, которые будут вести себя предсказуемо при изменении размеров окна.
Проанализируем шаги реализации:
Группировка в значение Горизонтальная.Группировка — Вертикальная.Чтобы колонки были строго одинаковыми по ширине, выясним причину возможного перекоса. Часто платформа пытается подстроить ширину под самый длинный заголовок. Чтобы этого избежать, у обеих вертикальных групп следует установить свойство РастягиватьПоГоризонтали в значение Да, а свойство РастяжимостьПоГоризонтали выставить в одинаковое значение (например, 1).
Если нам нужно, чтобы элементы в разных колонках всегда находились на одной горизонтальной линии (строке), используем другой подход. Рассмотрим ситуацию, когда в первой колонке ПолеВвода, а во второй — Надпись или Флажок.
Разберем алгоритм действий:
Вертикальной группировкой.Горизонтальной группировкой.Ширина).Этот способ гарантирует, что вторая колонка начнется строго с одной и той же позиции во всех строках. Однако у него есть минус: если пользователь сильно изменит масштаб, фиксированная ширина может выглядеть некорректно.
Часто программисты замечают, что строки с флажками «съезжают» вправо или влево относительно обычных полей ввода. Это происходит из-за особенностей отрисовки заголовков флажков. Проанализируем, как это исправить.
Использование пустых декораций:
Как советуют опытные разработчики, после элемента (например, после флажка в горизонтальной группе) можно добавить элемент Декорация - рисунок или Декорация - надпись. Установите следующие свойства для декорации:
Высота: 1;РастягиватьПоГоризонтали: Да;Заголовок: (пустая строка).Такой невидимый элемент заполнит всё оставшееся пространство справа, «подперев» основные элементы и не давая им смещаться произвольным образом.
Один из самых профессиональных приемов — использование свойства ШиринаЗаголовка. Выясним, почему это важно. По умолчанию в 1С стоит значение «0» (автоматически). Это заставляет платформу вычислять ширину по самому длинному тексту заголовка в текущей группе.
Чтобы добиться идеальной вертикальной линии между заголовками и полями:
ШиринаЗаголовка.Теперь все границы полей ввода выстроятся строго по одной линии, независимо от длины текста «Наименование», «Код» или «Артикул».
В современных версиях платформы 8.3 существует специальный вид группы — Группа колонок. Она предназначена именно для табличного расположения элементов. Посмотрим, как ее настроить:
Внутри такой группы можно комбинировать элементы. Она автоматически управляет выравниванием вложенных элементов. При использовании этого типа группы обратите внимание на свойство Отображение — оно позволяет визуально выделить логические блоки формы.
Рассмотрим ситуацию, когда форма «плывет» на разных мониторах. Основное правило управляемых форм — меньше фиксированных размеров, больше логических ограничений.
Вместо жесткого задания ширины в 300 пикселей, лучше использовать:
АвтоМаксимальнаяШирина: Да (для элементов, которые не должны растягиваться бесконечно).ОбъединятьСПредыдущим: позволяет «приклеить» декорацию или кнопку к основному полю, чтобы между ними не было лишних отступов.Подводя итог, можно сказать, что создание ровного интерфейса в УФ — это всегда комбинация правильной иерархии групп и тонкой настройки свойств ШиринаЗаголовка и Растяжимость. Экспериментируйте с этими параметрами, и ваши формы будут выглядеть профессионально на любом устройстве.