При разработке сложных интерфейсов в "1С:Предприятие 8" мы часто сталкиваемся с необходимостью отобразить пользователю данные, разделенные на множество категорий. Классический подход — программное изменение форм для создания страниц (вкладок). Однако, когда количество категорий растет, а их названия становятся длинными, стандартный механизм страниц перестает быть удобным: заголовки не помещаются на экран, появляются полосы прокрутки, интерфейс становится перегруженным. Более того, создание отдельного динамического списка для каждой вкладки может негативно сказаться на производительности.
Давайте подробно разберем, почему возникает эта проблема, и рассмотрим несколько приемов построения эффективных интерфейсов, от простых настроек до архитектурных изменений с использованием паттерна "Мастер-Деталь".
Прежде чем переходить к написанию кода, давайте проанализируем ситуацию, описанную автором вопроса. У нас есть множество программно созданных страниц, на каждой из которых расположен динамический список. Заголовки страниц длинные и не читаются.
Здесь есть две фундаментальные проблемы:
ДинамическийСписок, мы создаем колоссальную нагрузку на клиентское приложение и сервер при открытии формы. Платформа вынуждена инициализировать все эти источники данных, даже если пользователь смотрит только на одну вкладку.Рассмотрим варианты решения, двигаясь от простых к более сложным и правильным.
Наиболее эффективным способом решения данной задачи является отказ от использования элемента формы Группа - Страницы для навигации. Вместо этого мы используем подход, где слева находится список категорий (Мастер), а справа — отображаются данные, отфильтрованные по выбранной категории (Деталь).
Преимущества:
Разберем реализацию по шагам.
Создадим реквизит формы СписокКатегорий (тип ТаблицаЗначений или ДеревоЗначений) с колонками Наименование (Строка) и ЗначениеОтбора (Ссылка на справочник или Строка).
Также у нас должен быть основной реквизит Список (тип ДинамическийСписок), который выводит данные.
Разместим на форме группу с видом Обычная группа и группировкой Горизонтальная.
СписокКатегорий. У колонки "Наименование" установим свойство АвтоВысотаЯчейки = Истина и МногострочныйРежим = Истина. Это позволит отображать длинные заголовки в несколько строк!При создании формы на сервере мы заполняем таблицу категорий. А при активации строки в этой таблице — накладываем отбор на основной список.
Рассмотрим код события ПриАктивизацииСтроки таблицы категорий:
&НаКлиенте
Процедура СписокКатегорийПриАктивизацииСтроки(Элемент)
ТекущиеДанные = Элемент.ТекущиеДанные;
Если ТекущиеДанные = Неопределено Тогда
Возврат;
КонецЕсли;
// Получаем значение для фильтрации
ЗначениеФильтра = ТекущиеДанные.ЗначениеОтбора;
// Вызываем процедуру установки отбора динамического списка
УстановитьОтборСписка(ЗначениеФильтра);
КонецПроцедуры
&НаКлиенте
Процедура УстановитьОтборСписка(ЗначениеФильтра)
// Очищаем старые отборы или находим существующий
// Для примера используем работу через Отбор.Элементы
ЭлементыОтбора = Список.Отбор.Элементы;
ЭлементыОтбора.Очистить();
Если ЗначениеЗаполнено(ЗначениеФильтра) Тогда
НовыйЭлемент = ЭлементыОтбора.Добавить(Тип("ЭлементОтбораКомпоновкиДанных"));
НовыйЭлемент.ЛевоеЗначение = Новый ПолеКомпоновкиДанных("Категория"); // Имя вашего поля
НовыйЭлемент.ВидСравнения = ВидСравненияКомпоновкиДанных.Равно;
НовыйЭлемент.ПравоеЗначение = ЗначениеФильтра;
НовыйЭлемент.Использование = Истина;
КонецЕсли;
КонецПроцедуры
Таким образом, мы решили проблему длинных заголовков (они теперь в таблице с переносом строк) и проблему производительности (список всего один).
Если по каким-то причинам вы обязаны использовать именно механизм страниц (например, структура данных на страницах кардинально отличается и её нельзя свести к одному списку), давайте рассмотрим, как улучшить UX. Часто для тонкой настройки внешнего вида бывает полезен редактор форм в режиме предприятия, позволяющий менять свойства элементов "на лету".
Основная идея: в заголовок страницы (свойство Заголовок) мы пишем короткий код или сокращенное наименование, а полное наименование выводим внутри страницы или в подсказке.
Внутри каждой программно создаемой страницы первым элементом мы можем добавить декорацию типа Надпись.
// Пример создания страницы и заголовка внутри неё на сервере
НоваяСтраница = Элементы.Добавить("Страница_" + Идентификатор, Тип("ГруппаФормы"), Элементы.ГруппаСтраницы);
НоваяСтраница.Вид = ВидГруппыФормы.Страница;
НоваяСтраница.Заголовок = "Дог. №" + СокращенныйНомер; // Короткий заголовок
// Создаем декорацию с полным текстом ВНУТРИ страницы
ПолныйЗаголовок = Элементы.Добавить("Декорация_" + Идентификатор, Тип("ДекорацияФормы"), НоваяСтраница);
ПолныйЗаголовок.Вид = ВидДекорацииФормы.Надпись;
ПолныйЗаголовок.Заголовок = "Полное наименование договора: " + ДлиннаяСтрокаНаименования;
// Важно для читаемости:
ПолныйЗаголовок.АвтоМаксимальнаяШирина = Ложь;
ПолныйЗаголовок.Шрифт = Новый Шрифт(,, Истина); // Жирный шрифт
Еще один вариант — использовать свойство Подсказка у страницы. В платформе 1С:Предприятие 8.3 есть возможность управлять отображением подсказок.
Вы можете установить свойство ОтображениеПодсказки (ExtendedTooltip) для страницы. Это позволит выводить полное наименование при наведении курсора на короткий заголовок вкладки.
Если стандартный вид закладок вас не устраивает, но вам нужна навигация сверху или сбоку, мы можем создать свою панель навигации, используя элементы типа Декорация с режимом гиперссылки. Это добавление реквизитов и элементов формы позволяет обойти ограничения стандартных групп страниц.
Это дает гибкость: декорации можно располагать в группах с любым количеством колонок, красить в разные цвета (эмулируя "акственную" вкладку) и делать перенос текста.
Алгоритм реализации:
ГруппаНавигации (горизонтальная или вертикальная).ОтображениеСтраниц = Нет у группы страниц).ГруппаНавигации декорациями.
// Создание "кнопки" навигации
НоваяДекорация = Элементы.Добавить("Кнопка_" + Идентификатор, Тип("ДекорацияФормы"), Элементы.ГруппаНавигации);
НоваяДекорация.Вид = ВидДекорацииФормы.Надпись;
НоваяДекорация.Заголовок = ДлинноеНаименование;
НоваяДекорация.Гиперссылка = Истина;
НоваяДекорация.УстановитьДействие("Нажатие", "Подключаемый_НажатиеНавигации");
// Настройка внешнего вида для имитации кнопки
НоваяДекорация.ЦветФона = ЦветаСтиля.ФонУправляющегоПоля; // Пример
НоваяДекорация.Высота = 3; // Высота в строках, чтобы влез длинный текст
НоваяДекорация.Ширина = 20;
В обработчике нажатия мы будем программно переключать текущую страницу в основной группе страниц:
&НаКлиенте
Процедура Подключаемый_НажатиеНавигации(Элемент)
// Из имени элемента получаем идентификатор страницы
ИмяСтраницы = СтрЗаменить(Элемент.Имя, "Кнопка_", "Страница_");
// Переключаем страницу
Элементы.ГруппаСтраницы.ТекущаяСтраница = Элементы[ИмяСтраницы];
// Визуально выделяем нажатую "кнопку" (опционально)
ОбновитьСтильКнопок(Элемент);
КонецПроцедуры
Если требования к дизайну очень высоки (нужны иконки, специфическое расположение "облаком", сложная верстка заголовков), вы можете применить разработку пользовательских интерфейсов в 1С с использованием HTML, CSS и Vue.js.
Мы формируем HTML-код, который рисует красивое меню. В ссылки <a href='...'> зашиваем идентификаторы разделов. При нажатии на ссылку в поле HTML срабатывает событие ПриНажатии, которое мы обрабатываем в 1С и выполняем те же действия, что и в предыдущих методах — фильтруем список или переключаем страницу.
Преимущество: Абсолютная свобода в дизайне заголовков.
Недостаток: Более высокая сложность поддержки кода (нужно знать HTML/CSS).
Проблема "миллиона вкладок" с длинными именами — это классический сигнал о необходимости пересмотра UX-дизайна формы. Давайте подведем итог, какой метод выбрать:
Избегайте создания десятков динамических списков на одной форме. Это "тяжелая" операция для платформы 1С, которая приведет к жалобам пользователей на медленную работу программы.