Давай выясним!

На WWDC 2019 Apple удивила всех разработчиков, анонсировав совершенно новый фреймворк под названием SwiftUI. Это не просто меняет способ разработки приложений для iOS. Это самый большой сдвиг в экосистеме разработчиков Apple (включая iPadOS, macOS, tvOS и watchOS) с момента появления Swift.

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

Если вы все еще работаете с фреймворком UIKit, но хотите использовать PreviewProvider из SwiftUI для повышения производительности, я дам вам несколько советов, как это сделать.

Давайте создадим расширение UIViewController:

  1. Xcode создает этот блок кода только в том случае, если возможно импортировать SwiftUI и если вы находитесь в режиме отладки. (необязательный)
  2. Сделайте расширение доступным для потребителей с iOS 13 и выше.
  3. Частная структура Preview соответствует протоколу UIViewControllerRepresentable. Мы будем использовать его для создания превью для наших контроллеров представления.
  4. Структура зависит от UIViewController. Например, если нам нужен предварительный просмотр для SettingsViewController, мы предоставим его для Previewstruct.
  5. Методы makeUIViewController(context:) и updateUIViewController(_ uiviewController:context:) требуются протоколом UIViewControllerRepresentable. Внутри makeUIViewControllermethod мы возвращаем контроллер представления, для которого хотим получить предварительный просмотр. Последний метод остается пустым.
  6. Создайте удобное свойство preview, которое возвращает Preview для контроллера представления.

Это все, что нам нужно добавить, чтобы поддерживать предварительный просмотр любых UIViewController в наших приложениях. Давайте протестируем то, что мы создали.

Пример использования

Давайте создадим простой ViewController HomeViewController.swift:

На этом HomeViewController.swift у нас есть необязательный HomeView, давайте создадим простой UIView с 3 метками и 1 кнопкой, используя код представления, например:

В нашем примере мы изолировали вещи, связанные с представлениями нашего экрана, в файле HomeView.swift.

Хорошо, а как насчет нашего PreviewProvider ?

По умолчанию в SwiftUI мы можем добавить его в конец нашего файла представления. Добавим в конце HomeView.swift :

  1. Xcode создаст этот блок кода, только если возможно импортировать SwiftUI, и если вы находитесь в режиме отладки, по той же причине мы включили в наше расширение UIViewController. (необязательный)
  2. Мы предоставляем предварительный просмотр нашего расширения из UINavigationController, передавая наше ViewController как rootViewController.

И вуаля!

Несколько важных вещей/советов…

  • Имя структуры Preview должно иметь суффикс Preview, например: ViewControllerPreview, HomeViewControllerPreview, SomeViewPreview. Если нет, у вас будет ошибка сборки =/.
  • Если холст предварительного просмотра не представлен, вы можете использовать ярлык ⌘+Option + Return или сделать это вручную.

  • Чтобы возобновить предварительный просмотр, вы также можете использовать ярлык ⌘+Option+P.

Хорошо, мы узнали, как реализовать предварительный просмотр для нашего ViewControllers, но я очень ленив и не хочу вручную добавлять весь код для каждого отдельного ViewController, который я создам, поэтому давайте создадим фрагмент кода!

Чтобы создать новый фрагмент кода, щелкните правой кнопкой мыши в любом месте файла и выберите «Создать фрагмент кода». Затем вы дадите имя своему фрагменту кода, добавите блок кода, который будет заполняться при автозаполнении, затем добавьте этот блок кода и добавьте свой тег для автозаполнения, я использовал SwiftUIPreview в этот пример.

Это будет работать следующим образом:

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

Ресурсы

Исходный код примера проекта доступен на GitHub.