К статье
Практический материал

Разработка и Конфигурация · 10 мин

Как выровнять элементы на форме 1С

Как выровнять элементы на форме 1С: работа с группами, растягивание, выравнивание надписей и полей ввода, частые ошибки и проверка результата.

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

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

Материал ориентирован на управляемые формы (обычные формы встречаются в старых конфигурациях и устроены иначе — там выравнивание выполняется привязками границ). Все действия выполняются в конфигураторе, в редакторе формы.

Как платформа 1С раскладывает элементы на форме

Управляемая форма строится как дерево: корневая группа, внутри неё — другие группы и элементы (поля, надписи, кнопки, таблицы). Каждая группа имеет свойство «Группировка»: вертикальная, горизонтальная или «в ячейке». Дочерние элементы размещаются последовательно — сверху вниз или слева направо — в порядке их следования в дереве.

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

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

Базовое выравнивание через группы

Основной приём — выстроить иерархию групп до того, как настраивать отдельные поля. Типовой каркас формы документа выглядит так: корневая вертикальная группа → группа шапки (горизонтальная, внутри две вертикальные колонки) → группа с табличной частью → группа итогов.

Чтобы создать группу, в редакторе формы нажмите «Добавить группу» (или через контекстное меню дерева элементов), выберите тип «Группа — обычная группа» и задайте свойство «Группировка». Затем перетащите в неё нужные поля. Отображение заголовка группы отключается свойством «Отображение» — значение «Нет» делает группу невидимым контейнером.

Как выровнять поля в две колонки
  1. 1
    Создайте внутри родительской группы горизонтальную группу с отображением «Нет»
  2. 2
    Внутри неё создайте две вертикальные группы — будущие колонки
  3. 3
    Перетащите поля ввода в нужную колонку в дереве элементов
  4. 4
    У обеих колонок включите «Растягивать по горизонтали»
  5. 5
    Откройте форму в режиме предприятия и проверьте поведение при изменении ширины окна

Если поля в колонках «пляшут» по ширине, задайте у полей или их групп явную ширину либо проверьте, что растягивание настроено одинаково. Разная ширина надписей внутри колонки — следующая частая причина неровности, о ней ниже.

Выравнивание полей ввода и надписей в колонку

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

Решение — собрать выравниваемые поля в одну вертикальную группу. Если по смыслу они должны лежать в разных группах (например, разделены вкладками), задайте у полей свойство «ПоложениеЗаголовка» и при необходимости фиксированную ширину заголовка через свойства поля, чтобы колонки совпадали визуально.

Для надписей-заголовков и декораций используйте свойство «Горизонтальное положение»: левое, центр, правое. Оно работает в пределах области, которую занимает элемент. Если надпись требуется прижать вправо, убедитесь, что сама надпись растягивается по горизонтали — иначе центрировать будет нечего.

Настройка растягивания и размеров

Свойство «Растягивать по горизонтали» определяет, будет ли элемент занимать всю доступную ширину родителя. Для полей ввода и таблиц это обычно нужно включать, для кнопок и флажков — оставлять выключенным, иначе кнопка расползётся на всю форму.

Если в горизонтальной группе несколько растягивающихся элементов, платформа делит свободное место между ними. Пропорции можно регулировать, задавая разную ширину элементов: элемент с большей заданной шириной получит и большую долю при растягивании.

Фиксированная ширина уместна для полей с заведомо коротким содержимым: номер, дата, код. Но не злоупотребляйте ею: форма с жёстко заданными размерами плохо переносит узкие окна, крупные шрифты интерфейса и работу через веб-клиент.

Подходы к размерам элементов

Автоматический размер

Платформа сама подбирает ширину по содержимому. Подходит для надписей и кнопок; для полей ввода даёт непредсказуемый результат.

Фиксированная ширина

Поле всегда одного размера. Хорошо для дат и номеров; плохо переносит узкие окна и масштабирование интерфейса.

Растягивание по родителю

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

Выравнивание кнопок и командной панели

Кнопки формы размещаются в командной панели формы или в отдельных группах кнопок. Чтобы выстроить кнопки в один ряд, создайте группу вида «Группа кнопок» с горизонтальной группировкой и перетащите в неё команды. Вертикальная группировка даст столбец кнопок.

Частая задача — прижать кнопку к правому краю формы. Для этого в горизонтальной группе перед кнопкой размещают «распорку»: декорацию или пустую группу с включённым растягиванием по горизонтали. Распорка занимает всё свободное место и выталкивает кнопку вправо.

Следите за свойством «Важность» кнопок в командной панели: кнопки с обычной важностью могут автоматически убираться в подменю «Ещё» при нехватке места. Если кнопка «пропала» с формы — проверьте именно это.

Прежде чем двигать отдельные элементы, посмотрите на форму в режиме предприятия при разной ширине окна. Часто «кривизна» видна только в конфигураторе, а в реальной работе форма выглядит нормально — или наоборот, проблема проявляется только при сужении окна.
ПЗ
Практическое замечание

Проверка результата и типичные ошибки

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

Контрольные точки

Как проверить результат

Поля ввода в одной колонке
Норма

Левые границы полей совпадают по вертикали

Тревожный признак

Поля начинаются на разном расстоянии от края — они в разных группах

Поведение при сужении окна
Норма

Поля пропорционально уменьшаются, ничего не обрезается

Тревожный признак

Часть элементов исчезает или налезает друг на друга

Кнопки у правого края
Норма

Кнопка стабильно прижата вправо при любой ширине

Тревожный признак

Кнопка «плавает» или уходит в меню «Ещё»

Табличная часть
Норма

Таблица занимает всю отведённую область

Тревожный признак

Таблица сжата, рядом пустое место — не включено растягивание

Типичные ошибки
01
Попытка выровнять элементы порядком в дереве без групп — элементы выстроятся в один столбец и собьют всю компоновку
02
Включение растягивания у кнопок и флажков — кнопка растягивается на всю ширину формы и выглядит чужеродно
03
Фиксированная ширина у всех полей — форма ломается при узком окне или крупном шрифте интерфейса
04
Вложенность групп глубже четырёх-пяти уровней — форму становится трудно поддерживать, а платформа медленнее её отрисовывает
05
Проверка формы только в конфигураторе — реальные проблемы с растягиванием видны только в режиме предприятия

Отдельная ошибка — программное создание элементов формы без явного указания родительской группы. Такие элементы попадают в конец корневой группы и нарушают выравнивание. При программном добавлении всегда указывайте родителя и, при необходимости, свойство «Переместить» для точной позиции.

FAQ по выравниванию элементов формы

Почему поле ввода не растягивается, хотя свойство включено?

Растягивание работает только в пределах родительской группы. Проверьте, растягивается ли сама группа, и нет ли рядом элемента, который «съедает» всё свободное место. Также убедитесь, что у поля не задана фиксированная ширина одновременно с растягиванием — поведение в этом случае зависит от комбинации свойств.

Как разместить два поля на одной строке?

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

Как выровнять элементы в обычной форме (старой)?

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

Можно ли выровнять элементы формы программно?

Да: у элементов формы доступны свойства ГоризонтальноеПоложение, Ширина, РастягиватьПоГоризонтали и другие — их можно менять в коде модуля формы. Но статическую компоновку лучше задавать в редакторе формы, а код использовать только для динамических изменений (например, скрытия полей по условию).

Почему форма выглядит по-разному в тонком клиенте и в веб-клиенте?

Разные клиенты по-разному рассчитывают размеры шрифтов и отступы, поэтому мелкие расхождения неизбежны. Не полагайтесь на пиксельную точность: используйте растягивание вместо фиксированных размеров и проверяйте форму во всех клиентах, с которыми работают пользователи.

Как вернуть форму к исходному виду после неудачных правок?

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

Итог

Что важно запомнить

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