Если вы не знали, теперь вы узнаете!

Контекстное меню - это всплывающее меню, используемое для отображения некоторых действий. В SwiftUI срабатывает 3D-касание, чтобы отобразить контекстное меню. Но чтобы использовать это, вы должны использовать модификатор .contextMenu. В этом руководстве вы узнаете, как создать контекстное меню в SwiftUI для повышения удобства использования.

Вы разработаете следующее приложение:

🎯 Полный проект на GitHub

1. Создайте простое приложение.

Вот код для создания простого экрана. По сути, вы создадите карточку-шаблон Card, которую можно использовать для текста или изображения с помощью кода. Используя CardType, вы решите, для чего будет нужна карта.

Card имеет некоторые условия для отображения текста или изображения с некоторыми стилями.

2. Добавьте изображение

Загрузите любое бесплатное изображение и добавьте его в каталог Assets. Напишите название «дом» для изображения.

3. Просмотрите экран

Если вы предварительно просмотрите приложение на холсте или запустите приложение, вы увидите следующий экран.

На этом этапе, если вы некоторое время коснетесь любой из карт, ничего не произойдет.

Добавим контекстное меню.

4. Добавление контекстного меню

Нам нужны разные контекстные меню для разных представлений. В этом приложении есть два представления.

  1. Текстовая карточка
  2. Картинная карточка

4.1 Добавление контекстного меню с текстовой карточкой

Внутри типа Card давайте определим представление cardTextContextMenu.. В нем всего одна кнопка.

Это вернет простой вид с кнопкой.

Теперь давайте склеим это представление как контекстное меню с представлением cardText.

4.2 Добавление контекстного меню с карточкой изображения

Давайте определим еще одно контекстное меню с двумя кнопками.

  1. Показать
  2. Скачать

Давайте склеим это меню с cardImage представлением.

Вот окончательный код:

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

Это творческий способ улучшить взаимодействие с пользователем в вашем приложении.