Экраны запуска без раскадровки идеально подходят для SwiftUI

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

Xcode по умолчанию создает раскадровку, которую вы можете использовать для настройки экрана загрузки. Хотя в большинстве случаев это работает нормально, в Xcode 12 и iOS 14 доступны новые захватывающие возможности.

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

История экранов запуска

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

iOS 8, которая шла с Xcode 6, позволила нам заменить статическое изображение файлом раскадровки. Это уже упростило и улучшило способ определения экранов загрузки, но возможности по-прежнему были ограничены. Экраны запуска были сильно кэшированы, и динамическая замена была невозможна. Однако использование меток, представлений изображений и других элементов интерфейса устраняет необходимость открывать приложение для редактирования изображений для экспорта изображений во всех нужных размерах.

Xcode 12 и iOS 14 улучшили экраны запуска, описанные в этой статье.

Рекомендации по использованию экранов запуска

Прежде чем мы углубимся в то, как и когда, полезно знать назначение экрана запуска. Трудно сделать неправильно, но легко исправить.

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

Не цитируя все из руководящих принципов, я думаю, что наиболее важно понять несколько вещей:

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

Последняя точка дает направление. Чем ближе экран-заставка подходит к первой странице, тем более плавным будет первое впечатление от вашего приложения.

Очистка кеша во время разработки

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

В большинстве случаев во время тестирования на iOS 14 я видел правильное обновление экрана. Однако если это не так, вы можете попробовать один из следующих подходов:

  • Очистите папку сборки с помощью Product ➞ Clean Build Folder.
  • Удалите приложение из симулятора и переустановите его.

В крайнем случае, вы можете перезагрузить симулятор. Однако это отнимает много времени и не делает вас действительно продуктивным. Есть еще один недокументированный трюк, предоставленный Gui Rambo, который не тестировался на iOS 14+, но также может работать:

Вы можете вызвать этот метод из своего didFinishLaunchingWithOptions метода. Однако убедитесь, что вы включаете этот фрагмент кода только во время разработки.

Добавление режима сна для задержки запуска вашего приложения

Да, вы правильно читаете. Во время разработки экрана запуска может быть полезно добавить задержку, чтобы вы могли более внимательно изучить реализованный дизайн. Если ваше приложение запускается быстро, его экран запуска может быть виден менее одной секунды.

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

Варианты реализации экранов запуска

Теперь, когда вы в курсе всей необходимой информации об экранах запуска, пришло время погрузиться в доступные параметры в Xcode 12 и более поздних версиях. Есть два способа реализовать стартовый экран:

  1. Использование раскадровки (по умолчанию).
  2. Используя plist конфигурацию, в которой вы можете установить изображение, должно ли изображение запуска соответствовать вставкам безопасной области, цвету фона, видимости панели навигации, видимости панели вкладок, видимости панели инструментов и конфигурации экрана запуска для каждой схемы URL.

Список plist параметров конфигурации является новым в Xcode 12 и позволяет вам настроить экран запуска без использования раскадровок. Это отлично подходит для приложений SwiftUI, в которых некрасиво иметь файл раскадровки для вашей «страницы-заставки».

Использование файла раскадровки

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

Откройте LaunchScreen.storyboard файл, который настроен на вкладке "Общие" целевого приложения:

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

Использование конфигурации plist

Другой вариант - использовать plist конфигурацию, которая, скорее всего, станет будущим создания экранов запуска, поскольку SwiftUI заменяет раскадровки (здесь играет роль бога).

Эта конфигурация вступит в силу только в том случае, если вы удалите ключ раскадровки с именем «Базовое имя файла интерфейса экрана запуска» или UILaunchStoryboardName в случае отображения необработанных ключей.

Как только вы начнете настраивать экран запуска в своем Info.plist файле, вам будет легко обнаружить параметры, поскольку они перечислены при добавлении нового ключа. Начните с добавления нового ключа с именем UILaunchScreen под названием «Экран запуска»:

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

Фоновое изображение и цвет настраиваются в каталоге активов:

Я использую одномасштабное изображение SVG, которое автоматически подстраивается под разные размеры экрана.

В том же словаре конфигурации мы можем переключать видимость панели навигации, панели вкладок и панели инструментов. Это может привести к следующему выводу:

Это был бы отличный экран загрузки, если бы на первом экране моего приложения были и панель вкладок, и панель навигации. Переход получился бы плавным и естественным!

Настройка экранов запуска по схеме URL

Еще одна новая опция, которая поставляется с Xcode 12, - это возможность настроить другой экран загрузки для каждой схемы URL. Если ваше приложение использует настраиваемые URL-адреса для глубокой ссылки на ваше приложение, вы можете найти полезным настроить экран загрузки для каждой схемы, чтобы ваше приложение плавно переходило.

Вы можете протестировать свои глубокие ссылки и универсальные ссылки с помощью RocketSim, чтобы быстро выполнять итерацию и повышать производительность.

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

  • Экран запуска по умолчанию
  • Экраны запуска для использования по схеме URL

Примером может быть отображение только вкладки и панели навигации для схемы URL launchscreen://:

Ключ для этого называется UILaunchScreens под названием «Экраны запуска» и требует, чтобы вы предоставили конфигурацию по умолчанию, определения экранов запуска и ассоциации URL-адресов.

Связи URL-адресов определены в словаре с ключами, установленными для схем URL-адресов. Схема URL, такая как launchscreen://, определяется как launchscreen. Значение должно соответствовать идентификатору в определениях экрана запуска.

Заключение

У экранов запуска есть история улучшений, и Xcode 12 добавляет новую главу в эту историю. Определение разных экранов запуска для каждой схемы URL, переключение видимости панелей инструментов и определение конфигурации внутри info.plist устраняют необходимость в раскадровке экрана запуска.

Спасибо за прочтение!