РАЗРАБОТКА

Разработка, ориентированная на игровую площадку

Как создать прототип вашего приложения быстрее скорости света.

Swift Playgrounds - замечательная вещь. Они быстрые. Они позволяют быстро опробовать свой код. Они позволяют вам проверить свой пользовательский интерфейс за считанные секунды. Они действительно могут ускорить ваш цикл разработки.

Это краткое видео о том, как они могут помочь, например, при создании прототипа ячейки для коллекции.

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

Однако как мы можем начать использовать игровую площадку в нашем цикле разработки прямо сейчас?

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

В этой статье вы узнаете, как добавить игровую площадку в свое приложение, чтобы вы могли прототипировать свой пользовательский интерфейс и свои алгоритмы быстрее, чем когда-либо!

Примечание. Если вы уже являетесь экспертом по Xcode и управлению зависимостями, вы можете сразу перейти к разделу «Добавление площадки» этой статьи.

Создание проекта

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

  1. Открыть Xcode
  2. Нажмите File > New > Project
  3. Выберите App из шаблонов iOS.
  4. Дайте ему имя (я выбрал PDD)
  5. Выберите место на диске и нажмите Create

Здесь ничего особенного. Обычные вещи для создания нового проекта.

Учитывая, что на самом деле мы не хотим использовать раскадровки, давайте немного очистим шаблон:

  • Удалите файл Main.Storyboard
  • Добавьте следующий фрагмент в SceneDelege.swift:
  • Откройте файл Info.plist и удалите две выделенные записи.

  • Нажмите кнопку Play и убедитесь, что приложение создается и запускается!

Добавление фреймворка

Все мы любим модульные приложения. У них есть несколько плюсов:

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

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

Итак, давайте создадим платформу, в которой мы сможем реализовать наш пользовательский интерфейс.

  1. В Xcode щелкните File > New > Target
  2. Прокрутите вниз, пока не найдете шаблон Framework.
  3. Выберите шаблон Framework и нажмите "Далее".
  4. Дайте ему имя (я назвал его UI)
  5. Нажмите Finish

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

Для этого примера возьмем файл ViewController.swift, переместим его в новую структуру. Если мы попытаемся построить проект сейчас, мы столкнемся с рядом неудач. Чтобы исправить их:

  1. Откройте файл SceneDelegate.swift и добавьте import UI
  2. Откройте файл ViewController.swift и обновите код следующим фрагментом:

В этом фрагменте мы просто делаем ViewController public, чтобы мы могли создать его из приложения, и добавляем необходимые инициализаторы.

Теперь мы можем снова нажать кнопку Play и увидеть, что приложение работает, как и раньше.

Добавление стручков

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

Cocoapods - одно из самых известных средств управления зависимостями, которое мы используем в Bending Spoons каждый день. Попробуем интегрировать библиотеку в наш проект.

  1. В корневой папке нашего проекта создайте файл с именем Podfile
  2. Скопируйте и вставьте следующий фрагмент
  3. В терминале перейдите в корневую папку вашего проекта.
  4. запустите команду pod install и дождитесь завершения процесса

Этот процесс создаст рабочее пространство Xcode с расширением .xcworkspace. Эта среда немного отличается от стандартного проекта: она в основном собирает разные .xcodeproj, чтобы они могли работать вместе.

Давайте откроем PDD.xcworkspace, и вы увидите в навигаторе проекта следующую ситуацию:

Теперь у нас есть доступ к PinLayout Pod, и мы можем использовать его для компоновки элементов наших представлений!

Добавление детской площадки

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

Для начала создадим его стандартным способом:

  1. В Xcode нажмите File > New > Playground
  2. Выберите шаблон SingleView и нажмите "Далее".
  3. Перейдите в то же место, где вы создаете свой проект.
  4. Дайте название детской площадке (я решил назвать ее PDD)
  5. В нижней части диалогового окна выберите рабочее пространство для параметров Add to: и Group:.
  6. Нажмите Create

Теперь Xcode создал новую игровую площадку, с которой мы можем играть. Игровая площадка также поддерживает функцию liveView, которая помогает нам быстро создавать прототипы.

Однако теперь мы изменили наше рабочее пространство. Что произойдет, если нам придется добавить в проект новый модуль? Команда pod install воссоздает .xcworkspace, и после открытия игровая площадка исчезает!

Автоматическое добавление детской площадки

Если мы немного исследуем, что такое .xcworkspace файл, мы обнаружим, что это в основном папка, которая, в частности, содержит файл с именем contents.xcworkspacedata.

Этот файл определяет структуру рабочего пространства. Вновь созданное рабочее пространство из pod install содержит только следующее содержимое:

В то время как рабочее пространство, измененное путем добавления игровой площадки, имеет contents.xcworkspacedata с таким содержимым:

Таким образом, чтобы автоматически добавить нашу игровую площадку в рабочую область, мы можем подготовить небольшой скрипт (конечно, в Swift), который мы запускаем сразу после команды pod install.

Скрипт выглядит так:

Чтобы запустить его, вам просто нужно набрать swift integrate-playground.swift в терминале и позволить волшебству случиться.

Он в основном использует файловый менеджер для получения информации о детской площадке и xcworkspace. Затем он добавляет линию, чтобы включить игровую площадку в рабочую область. Вот и все: отныне у нас всегда будет площадка для прототипов наших представлений и алгоритмов!

Создание прототипа представления

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

Это в основном:

  1. import PinLayout
  2. import UI
  3. Добавьте следующий код для представления, в котором для размещения метки используется PinLayout.
  4. Создайте ViewController из модуля UI
  5. Создайте MyView и замените ViewController.view
  6. Установите его как новый liveView.

Наконец, мы можем настроить площадку.

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

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

Вот и все! Коротко о быстром прототипировании!

Заключение

В этой статье мы рассмотрели создание проекта с несколькими зависимостями: пользовательские фреймворки, модули и игровые площадки. Изложенные идеи будут работать также с Swift Package Manager и другими системами управления зависимостями. Мы также автоматизировали включение игровой площадки в рабочую область: таким образом, нам не придется добавлять ее вручную каждый раз, когда рабочая область создается заново.

В Bending Spoons мы не создаем наши проекты вручную, но мы используем различные инструменты, которые создают xcodeproj из других шаблонов. Xcodegen - один из таких инструментов. Идеи, изложенные в этой статье, применимы и к проектам, созданным с помощью этих инструментов.

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