Как настроить контекстное меню и кнопки при свайпе в мобильном клиенте 1С?

Программист 1С v8.3 (Управляемые формы) IT и автоматизация бизнеса
← На главную

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

Определение жеста и природа события

Для начала разберем техническую суть вопроса. Многие начинающие разработчики ищут в палитре свойств или модуле формы событие с названием типа ПриСвайпе или ОбработкаСмахивания. Однако в архитектуре 1С прямого программного события на сам факт перемещения пальца по экрану для открытия меню не предусмотрено. Данное действие является чисто визуальным интерфейсным решением платформы для вызова контекстного меню строки таблицы или динамического списка.

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

Пошаговая настройка кнопок меню свайпа

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

Шаг 1. Управление автозаполнением командных панелей

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

  1. Перейдем в свойства формы и найдем элемент Командная панель. Снимем флаг Автозаполнение.
  2. Выберем в дереве элементов формы наш список (Таблица или Динамический список). В его свойствах также найдем раздел Командная панель и снимем флаг Автозаполнение.
  3. Проверим свойство Контекстное меню самого списка. Здесь также рекомендуется отключить Автозаполнение, если мы планируем создавать меню полностью вручную.

Шаг 2. Настройка состава команд

После отключения автозаполнения нам нужно четко определить, какие именно действия будут доступны пользователю. Посмотрим на пример настройки свойства Состав команд:

Борьба с кнопкой «Еще» в мобильном клиенте

Проанализируем проблему, часто возникающую в мобильном клиенте: даже при одной добавленной кнопке в меню все равно присутствует кнопка «Еще». Это специфическое поведение мобильной платформы, которая стремится обеспечить пользователю доступ к системным функциям (поиск, настройка списка, обновление).

Чтобы максимально минимизировать риск появления этой кнопки или сделать меню более лаконичным, обратим внимание на следующие настройки:

1. Изменять состав кнопок: В свойствах командной панели списка убедимся, что свойство Изменять состав кнопок (в некоторых версиях — возможность пользовательской настройки) отключено. Если платформа «считает», что пользователю может понадобиться изменить порядок кнопок, она зарезервирует место под меню «Еще».

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

Кастомизация внешнего вида: картинки против текста

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

В свойствах команды, которую мы выводим в список, найдем поле Отображение. Вместо значения Надпись или Надпись и картинка выберем Картинка. В мобильном клиенте это превратит громоздкую текстовую кнопку в компактный графический элемент. Если для команды выбрана стандартная картинка (например, красный крестик для удаления), платформа подберет подходящий фон автоматически.

Для программного управления видимостью кнопок в зависимости от условий (например, запрет удаления определенных строк), мы можем использовать следующий подход в обработчике ПриАктивизацииСтроки или через условное оформление (хотя условное оформление реже влияет именно на состав команд):


&НаКлиенте
Процедура СписокПриАктивизацииСтроки(Элемент)
    ТекущиеДанные = Элемент.ТекущиеДанные;
    Если ТекущиеДанные <> Неопределено Тогда
        // Пример логики: блокируем команду "Удалить" для проведенных документов
        Элементы.СписокКонтекстноеМенюУдалить.Доступность = Не ТекущиеДанные.Проведен;
    КонецЕсли;
КонецПроцедуры

Особенности версий платформы и режимов работы

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

В современных версиях (8.3.20+) появилось больше гибкости. Рассмотрим нюанс с цветом фона. На текущий момент платформа 1С не предоставляет прямого свойства ЦветФонаПриСвайпе. Цвет определяется автоматически:

Итоги настройки

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

  1. Отключаем Автозаполнение во всех связанных командных панелях (формы и самого списка).
  2. Тщательно фильтруем Состав команд в свойствах элемента формы.
  3. Добавляем собственные команды, устанавливая для них режим отображения Картинка для экономии места.
  4. Если кнопка «Еще» все равно отображается на мобильном устройстве, проверяем версию мобильного клиента и наличие системных прав на изменение состава команд пользователем.

Используя эти методы, мы создаем удобный и чистый интерфейс, который соответствует современным стандартам мобильной разработки и обеспечивает комфортную работу пользователей с данными «на лету».

← На главную