Как гибко разместить кнопки на форме с произвольным оформлением и шрифтами?

← На главную

При разработке интерфейсов на обычных формах (в отличие от управляемых) программисты часто сталкиваются с жесткими ограничениями платформы. Одной из таких проблем является создание командной панели с кнопками, оформление которых (например, шрифт, цвет или размер) должно отличаться от стандартного. Стандартная КоманднаяПанель не позволяет менять шрифт кнопок, а ручное размещение элементов не обеспечивает их автоматического "перетекания" при изменении ширины окна. Разберем несколько эффективных методов решения этой задачи, от использования встроенных объектов до интеграции веб-технологий.

Способ 1: Использование Поля HTML-документа

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

Во-первых, мы можем использовать современные возможности CSS, такие как flexbox. Это позволит кнопкам автоматически переноситься на новую строку, если они не помещаются по ширине. Проанализируем пример формирования текста HTML:


ТекстHTML = "
|<style>
|  .container { display: flex; flex-wrap: wrap; gap: 10px; }
|  .myButton { 
|    padding: 10px 20px; 
|    background-color: #f0f0f0; 
|    border: 1px solid #ccc; 
|    font-family: 'Verdana'; 
|    font-size: 14px; 
|    cursor: pointer;
|  }
|  .myButton:hover { background-color: #e0e0e0; }
|</style>
|<div class='container'>
|  <div class='myButton' onclick='location.href=\"btn1\"'>Первая кнопка</div>
|  <div class='myButton' onclick='location.href=\"btn2\"'>Вторая кнопка</div>
|</div>";
ЭлементыФормы.ПолеHTML.УстановитьТекст(ТекстHTML);

Чтобы отловить нажатие такой "кнопки" в коде 1С, мы используем событие ПриНажатии (или onclick в зависимости от настроек) элемента управления. Выясним, как это работает: при клике в HTML-документе меняется location.href, что вызывает событие в 1С, где в параметрах мы можем прочитать переданную строку (например, "btn1") и выполнить соответствующее действие.

Способ 2: Табличный документ как интерактивная панель

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

Рассмотрим по шагам, как превратить таблицу в панель кнопок:

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

Для обработки нажатия используем событие Выбор табличного документа. Проанализируем пример кода:


Процедура ТабличноеПолеВыбор(Элемент, Область, СтандартнаяОбработка)
    СтандартнаяОбработка = Ложь; // Отключаем стандартный вход в ячейку
    Если Область.Имя = "КнопкаПечать" Тогда
        // Вызываем процедуру печати
    ИначеЕсли Область.Текст = "Закрыть" Тогда
        ЭтаФорма.Закрыть();
    КонецЕсли;
КонецПроцедуры

Способ 3: Программное управление обычными кнопками (Flow Layout своими руками)

Если нам принципиально использовать стандартные объекты 1С (например, Кнопка или Надпись с событием нажатия), нам придется реализовать алгоритм автоматического позиционирования. Стандартные формы не умеют делать это сами, поэтому разберем логику "резиновой" верстки.

Посмотрим на пример алгоритма, который распределяет кнопки в зависимости от текущей ширины формы:


Процедура ПересчитатьРасположениеКнопок()
    ТекущийЛево = 10;
    ТекущийВерх = 10;
    МежэлементныйИнтервал = 5;
    МаксШиринаФормы = ЭтаФорма.Ширина;

    Для Каждого Кнопка Из МассивКнопок Цикл
        Если ТекущийЛево + Кнопка.Ширина > МаксШиринаФормы Тогда
            // Перенос на следующую строку
            ТекущийЛево = 10;
            ТекущийВерх = ТекущийВерх + Кнопка.Высота + МежэлементныйИнтервал;
        КонецЕсли;
        
        Кнопка.Лево = ТекущийЛево;
        Кнопка.Верх = ТекущийВерх;
        
        ТекущийЛево = ТекущийЛево + Кнопка.Ширина + МежэлементныйИнтервал;
    КонецЦикла;
КонецПроцедуры

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

Способ 4: Использование элементов типа "Надпись"

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

Выясним преимущества этого подхода:

Вы можете установить любой шрифт (Bold, Italic, размер).
Вы можете менять цвет текста и фон.
У надписи есть событие Нажатие, которое превращает её в полноценную кнопку.
Если установить флаг ВыделятьГиперссылку, пользователь получит привычный визуальный отклик.

Сравнение методов и рекомендации

Подведем итог. Выбор метода зависит от ваших приоритетов:

1. Если важна максимальная красота и адаптивность: используйте HTML-поле. Это единственный способ сделать современные "круглые" кнопки с градиентами и тенями, которые будут идеально перетекать при растягивании окна. 2. Если нужно надежное решение в стиле 1С: выбирайте Табличный документ. Его легко рисовать в конфигураторе, он стабилен и поддерживает экспорт (если это вдруг потребуется). 3. Если кнопок немного и важна простота кода: используйте обычные Надписи с программным расчетом координат Лево и Верх.

Проанализировав все варианты, мы видим, что даже в старых "обычных формах" 1С есть место для гибких и красивых интерфейсных решений, достаточно лишь отойти от использования стандартной командной панели.