Как это сделать: самоучитель по Xcode 12 для начинающих

В этом руководстве мы рассмотрим самые важные аспекты Xcode 12. Вы получите экскурсию по Xcode, чтобы быстрее освоить программирование на Swift и разработку приложений для iOS. Это Xcode 101!

Вот что мы рассмотрим:

• Что такое Xcode и для чего он нужен?
• Как загрузить, установить и обновить Xcode
• SwiftUI, новый, захватывающий фреймворк пользовательского интерфейса iOS.
• Взгляд с высоты птичьего полета на то, как использовать Xcode
• Работа с навигаторами и инспекторами
• Как создаются пользовательские интерфейсы с помощью Interface Builder
• Запуск приложения в симуляторе iPhone
• Как запустить собственное приложение на iPhone
• Мы поиграем со Swift и игровыми площадками
• Как работает отладка и инструменты в Xcode?
• Как разобраться в документации Xcode
• Важные области Xcode, такие как органайзер.
• Мы обсудим настройки сборки и то, как их настроить.
• Swift Package Manager (SPM) – полезно знать!
• Мои самые любимые инструменты сторонних разработчиков для Xcode

Оглавление

Что такое Xcode?

Xcode – это приложение для Mac, которое вы используете для создания приложений для iOS, macOS, tvOS и watchOS. Вы используете программирование на языке Swift и множество инструментов внутри Xcode для создания приложений для iPhone, iPad, Mac, Apple TV и других устройств.

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

Минимальные системные требования для Xcode 12:

• Mac с macOS 11 (Big Sur).
• 4 ГБ оперативной памяти, но 8+ ГБ будет удобнее.
• Не менее 8 ГБ свободного места для хранения данных†
• Mac 2013-2015 года или новее, MacBook, iMac или Mac mini.
• В настоящее время я работаю на MacBook Pro 2018 года, но я с удовольствием работал с MacBook Air 2013 года до 2018 года.

Xcode работает только на macOS, что означает, что вам нужен Mac, если вы хотите создавать приложения для iOS с помощью Xcode. Xcode не будет работать на iPad. Существует несколько альтернатив для Windows/PC, но они далеки от идеала.

Следующий шаг в этом руководстве – установка Xcode. Давайте приступим к этому!

Быстрый совет: Вы можете найти максимальную последнюю версию Xcode, которую может запустить ваш Mac, путем перекрестного сравнения минимальной версии macOS для запуска в этой вики с совместимостью оборудования в этой вики. Используя этот подход, вы также можете выяснить, для каких версий iOS вы сможете создавать сборки.

†: Xcode занимает много места в памяти, но для базовой установки достаточно 8 ГБ. Кроме того, Xcode будет хранить SDK, отладочные символы, “производные данные”, файлы iPhone Simulator и многое другое.

Как загрузить и установить Xcode

Проще всего загрузить и установить Xcode через Mac App Store. Вот как это делается:

1. Найдите Xcode в Mac App Store или воспользуйтесь этой ссылкой.
2. Нажмите Установить (или Получить)
3. Дождитесь завершения установки Xcode, что может занять некоторое время.
4. Быстрый совет: Не хотите использовать приложение App Store? Ознакомьтесь с mas-cli/mas – интерфейсом командной строки для Mac App Store. Вы можете искать, устанавливать и обновлять приложения – из Mac App Store – через командную строку Terminal!~ Мощное сочетание: Xcode и SwiftUI

Xcode обновляется раз в год, примерно в сентябре-октябре, одновременно с выходом новой основной версии iOS. Каждое обновление Xcode приносит улучшения, новые функции, исправления ошибок и доступ к последним SDK. В течение года выпускается ряд более мелких обновлений Xcode, включая обновления для Swift.

• Заметным новшеством в Xcode является SwiftUI. С помощью SwiftUI вы можете объявлять пользовательские интерфейсы (UI) ваших приложений для iOS и их поведение. Это новый способ создания пользовательских интерфейсов – и он меняет наше представление о создании пользовательских интерфейсов для приложений iOS.
• Интересным аспектом SwiftUI является то, что для создания пользовательских интерфейсов можно использовать программирование на Swift. Приведем небольшой пример:
• В приведенном выше коде объявляется представление, которое выводит на экран хорошо известный текст Hello worl! До этого момента вы создавали контроллер представления на основе Storyboard, чтобы показать что-либо на экране в вашем приложении для iOS. Вы можете создавать такие контроллеры представлений с помощью Interface Builder (см. ниже).
• Кодирование пользовательского интерфейса с помощью кода является новым и захватывающим, но оно также должно быть более продуктивным. Кроме того, теперь вы можете фиксировать код пользовательского интерфейса с помощью Git’а – без конфликтов слияния – а раньше это было невозможно.
• SwiftUI – это новинка, и хотя он уже выпущен в качестве производственного программного обеспечения, ему необходимо пройти этап принятия, прежде чем он станет новым стандартом дефакто для создания пользовательских интерфейсов. Вполне вероятно, что кривая внедрения SwiftUI будет похожа на кривую внедрения Swift в 2014 году, то есть медленный, но устойчивый рост.

Пока SwiftUI не заменит пользовательские интерфейсы на основе Storyboard, важно научиться работать с контроллерами представления и раскадровками, а также с SwiftUI. Более того, SwiftUI хорошо интегрируется с существующими представлениями и библиотеками на базе UIKit, что означает, что представления на базе UIKit останутся актуальными в течение значительного времени. Разумно изучить оба подхода.

У нас есть множество руководств по обоим:

Начало работы со SwiftUI

Создание пользовательского интерфейса с помощью представлений и модификаторов в SwiftUI

Работа со стеками в SwiftUI

struct ContentView: View var body: some View Text(“Hello worl!”) > >

Объяснение контроллеров представлений: Полное руководство по iOS и Swift

Как: передавать данные между контроллерами представлений в Swift (расширенный вариант)

Создание игры для iOS с помощью Swift в Xcode

С первого взгляда: Как использовать Xcode

Давайте посмотрим на Xcode! Во-первых, убедитесь, что вы запустили Xcode на своем Mac. Вас встретит экран приветствия Xcode: Вот что вы можете выбрать:

• Начать новую игровую площадку для кодирования Swift
• Создать новый проект Xcode, например, для создания приложения для iOS
• Клонировать существующий проект из репозитория Git.
• Открыть любой из ваших последних проектов, справа.
• Вы также можете открыть любой другой проект с помощью кнопки в правом нижнем углу или выбрать скрытие экрана приветствия при следующем запуске Xcode. Если у вас много проектов Xcode, просто открывать их через Finder может быть более продуктивно.
• Далее, когда вы открываете проект приложения iOS в Xcode, вы видите что-то вроде этого:

Давайте

В правом верхнем углу вы видите кнопки Play и Stop, а также выпадающий элемент рядом с ними. С помощью этих кнопок вы можете создать свое приложение, после чего оно начнет работать на заданной цели. Другими словами, сначала выберите “iPhone 11 Pro”, затем нажмите Play, и ваше приложение запустится в iPhone Simulator. Отлично!

• Вверху, посередине, вы видите строку состояния. С ее помощью Xcode сообщит вам, что он делает. Он также сообщит вам об ошибках в вашем проекте.
• Справа вверху вы увидите несколько кнопок, которые позволяют показывать или скрывать части Xcode. Например, если вы хотите сосредоточиться на коде Swift, вы можете скрыть левую и правую панели. Кнопка + – это Библиотека, которая включает фрагменты Swift-кода (и многое другое в Interface Builder). Кнопка с двумя стрелками включает режим Code Review в Xcode, который позволяет сравнивать Swift-файлы бок о бок.
• Редактор кода в Xcode имеет две удобные функции: хлебные крошки и мини-карта. Мини-карта – это глобальный контур вашего кода, который работает как полоса прокрутки. Хлебная крошка, или панель перехода, помогает перемещаться по иерархии проекта. С ее помощью можно также перейти к определенной функции или классу. А кнопки слева позволяют вернуться назад или вперед к предыдущему файлу, как в веб-браузере.
• Далее в этом учебнике мы рассмотрим несколько частей Xcode более подробно…
• В этом учебнике много жаргона и специфических слов, обозначающих определенные вещи в Xcode. Я изо всех сил старался называть вещи их правильными именами, но не думайте ни на секунду, что вам нужно говорить “Навигатор проекта”, когда на самом деле вы хотите сказать “браузер файлов” или “эта штука слева”. Жизнь слишком коротка для одинаковых носков! Вы сами устанавливаете свои чертовы правила.

Как создавать пользовательские интерфейсы с помощью Interface Builder

Одним из основных инструментов в Xcode является Interface Builder. Как следует из названия, с помощью Interface Builder вы создаете пользовательские интерфейсы для своих приложений. Вы создаете раскадровки, соединяете их с контроллерами представлений, и это формирует основу пользовательского интерфейса вашего приложения.

Давайте посмотрим на Interface Builder!

Interface Builder может показаться сложным на первый взгляд, но это простая программа, учитывая, насколько она мощная. С помощью “IB” вы можете делать 3 вещи: создавать пользовательский интерфейс, проверять элементы пользовательского интерфейса и вносить изменения в элементы пользовательского интерфейса.

• Пользовательский интерфейс Interface Builder состоит из 3 основных областей:
• Слева вы видите Контур документа. Это иерархический список всех элементов пользовательского интерфейса, контроллеров представления, сцен и т.д. в Storyboard (или XIB). Это как навигатор для элементов пользовательского интерфейса. Например, ищете ярлык? Воспользуйтесь контуром документа или найдите метку в редакторе.
• Давайте посмотрим на эти инспекторы. У вас их 7:
• Инспектор файлов дает основную информацию о файле, который вы редактируете в данный момент, например, о файле Swift или сториборде. Наиболее заметными являются настройки языковой локализации (для каждого файла) и Target Membership, который определяет, будет ли файл добавлен в конечный пакет приложения.

Эти 7 инспекторов можно разделить на 2 группы, а именно:

Инспекторы, основанные на ресурсах, такие как инспекторы File, History, Help и Identity. Они информируют вас о ресурсах, таких как имя файла или имя класса. Эти инспекторы в основном используются для получения информации.

На приведенном выше снимке экрана вы также видите несколько разных элементов:

Вы смотрите на раскадровку, которая представляет собой подход к объединению различных контроллеров представления в один. Раскадровка состоит из сцен с переходами между ними. Другой подход к созданию пользовательского интерфейса – это использование XIBs и отдельных классов контроллеров представления.

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

В нижней левой части Interface Builder вы видите надпись “View as: iPhone 11”. С помощью этого параметра вы можете просматривать свой пользовательский интерфейс как различные модели устройств iPhone и размеры экрана. Это очень полезно для создания отзывчивых пользовательских интерфейсов.

Кстати, об отзывчивости – в правом нижнем углу редактора Interface Builder вы видите несколько кнопок. С помощью этих кнопок можно создавать ограничения, в первую очередь ограничения Pin и Alignment. Ограничения определяют, как изменяется размер вашего пользовательского интерфейса при изменении размера экрана или размеров вводимых данных.

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

Interface Builder раньше был отдельным приложением, которое запускалось рядом с Xcode, а теперь я рассматриваю его как отдельное приложение внутри Xcode. То же самое относится и к Instruments, который на самом деле все еще является отдельным приложением…

Запуск приложения с помощью симулятора iPhone

Если у вас нет iPhone или iPad, iPhone Simulator – это лучший вариант. Это iPhone, который вы можете запустить на своем Mac прямо из Xcode. iPhone Simulator запускается довольно быстро, поэтому он идеально подходит для непрерывного рабочего процесса разработки.

Вот как запустить свое приложение в iPhone Simulator:

Сначала откройте проект iOS в Xcode.

• Затем в левом верхнем углу Xcode выберите симулятор, который вы хотите использовать.
• Наконец, нажмите кнопку Run/Play или нажмите Command + R
• Теперь Xcode скомпилирует и соберет ваше приложение, установит его в iPhone Simulator и запустит приложение. Теперь вы можете использовать свое приложение в iPhone Simulator, как если бы это был настоящий iPhone!
• Вы можете использовать мышь для взаимодействия с вашим приложением, но есть несколько моментов, которые вы должны знать:

Постукивание в приложении – это то же самое, что и нажатие, но прокрутка не работает! Вам придется нажимать и перетаскивать мышь, чтобы имитировать перетаскивание пальцем.

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

iPhone Simulator имеет несколько полезных функций, в том числе:

Вы можете сбросить Simulator через Hardware → Erase All Content and Settings….. Это приведет к удалению всех установленных приложений и настроек, что позволит вам начать все с чистого листа.

Вы можете использовать клавиатуру Mac для ввода текста в текстовые поля. Вы также можете использовать экранную клавиатуру, которую можно показать/скрыть с помощью Command + K.

• Большинство функций iPhone доступны через меню “Оборудование”. Полезно запомнить сочетание клавиш Shift + Command + H, чтобы нажать кнопку Home.
• Вы можете имитировать обновление местоположения GPS через Debug → Location. Когда симулятор запущен, вы также можете имитировать определение местоположения GPS в Xcode через меню Debug → Simulate Location.
• Давайте двигаться дальше и выясним, как вы можете запустить свое приложение на настоящем iPhone!

Совет: если вы создаете приложение для использования в производстве, не ограничивайтесь тестированием приложения в iPhone Simulator! Протестируйте его и на настоящем iPhone. Это симулятор, а не эмулятор, поэтому есть небольшие различия, такие как производительность, время и архитектура (i386 против ARM).

Запуск приложения на iPhone/iPad

• Запуск приложения на iPhone/iPad
• Запуск приложения на iPhone осуществляется, по сути, так же, как и запуск в iPhone Simulator. Предварительно вам потребуется выполнить несколько шагов, но после этого вот как вы запустите свое приложение:

Сначала откройте проект iOS в Xcode.

• Затем подключите iPhone к Mac через USB и выберите Trust on your iPhone, когда появится запрос
• Затем в левом верхнем углу Xcode выберите устройство iPhone.
• Наконец, нажмите кнопку Run/Play или нажмите Command + R.
• Прежде чем использовать iPhone для отладки приложения, необходимо создать бесплатную учетную запись разработчика Apple. Начиная с Xcode 7, вы можете загружать собственные приложения без платной учетной записи разработчика. Все, что вам нужно, – это Apple ID! В этом руководстве объясняется, как именно это сделать.

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

Сначала откройте Xcode и подключите iPhone к Mac через USB.

Затем откройте панель “Устройства” в Xcode с помощью меню “Окно → Устройства и симуляторы”.

Затем найдите свой iPhone в списке слева, нажмите Enable for Development и убедитесь, что установлен флажок Show as run destination.

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

• Большинство функций iPhone доступны через меню “Оборудование”. Полезно запомнить сочетание клавиш Shift + Command + H, чтобы нажать кнопку Home.
• /Library/Developer/Xcode/DerivedData/ на вашем Mac.
• Как кодировать Swift с помощью Xcode
• Давайте двигаться дальше и выясним, как вы можете запустить свое приложение на настоящем iPhone!

Вот что мы собираемся создать:

Давайте начнем! Мы создадим новый проект в Xcode. Сначала убедитесь, что вы запустили Xcode, а затем сделайте следующее:

• Выберите File → New → New Project…
• В появившемся диалоговом окне найдите шаблон Single View App в категории iOS Application и нажмите Next.
• В следующем диалоговом окне выберите следующие параметры, затем нажмите Далее
• Название продукта: Anything! Я назвал проект HelloWorld

Команда: Выберите личную команду~Название организации: Любое! Я использую LearnAppMaking

Идентификатор организации: Что-то вроде com.learnappmaking

Язык: Swift, конечно же!

Интерфейс: Storyboard

Жизненный цикл: UIKit App Delegate

1. Не ставьте галочку ни в одном из чекбоксов.
2. Наконец, сохраните проект в удобном месте и нажмите кнопку Создать.
3. Отлично! Ваш проект в Xcode создан. Теперь вы увидите экран Build Settings в Xcode, который мы обсудим позже в этом руководстве. Давайте сначала что-нибудь построим.
   • Откройте файл Main.storyboard. Появится Interface Builder. Перед вами контроллер представления. Мы собираемся добавить ярлык к этому “VC”. Вот как:
   • Нажмите кнопку + в правом верхнем углу IB, чтобы открыть библиотеку.
   • ОК, теперь переместите ярлык так, чтобы он находился прямо в центре контроллера представления. Затем дважды щелкните по ярлыку, чтобы изменить его текст. Лично мне не нравится надпись “Hello, world!”. – поэтому выберите текст, который вам нравится. Некоторые идеи:
   • “Мой корабль на воздушной подушке полон угрей!”.
   • “BOOYAH!”
   • “Элвис покинул здание”.
   • Отлично! Теперь мы добавим кнопку в контроллер представления. Вот как:
   • Нажмите на кнопку +, чтобы открыть библиотеку
4. Затем переместите метку так, чтобы она была по центру прямо под меткой. Дважды щелкните по кнопке и измените ее заголовок на что-то вроде “OK!”.

Вы уже знакомы с ограничениями? Не стесняйтесь добавить ограничения Horizontally in Container и Vertically in Container для метки, Horizontal Centers для кнопки и метки (сначала выберите оба!), а также верхнее поле 8 для кнопки. Используйте кнопки Pin и Alignment в правом нижнем углу Xcode. Отлично!

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

Во-первых, обязательно откройте в Xcode файл ViewController.swift. Этот файл включает класс ViewController, который связан с контроллером представления в Storyboard – тем, который мы только что редактировали. Мы собираемся добавить выход и действие в этот контроллер представления.

В верхней части класса, внутри первой открывающейся фигурной скобки

• @IBOutlet weak var textLabel:UILabel? Это свойство аутлета. Когда мы позже подключим его к раскадровке, мы сможем изменить текст внутри метки с помощью кода Swift. Для этого и нужен аутлет.
• Вы можете обозначить свойство ключевым словом @IBOutlet, чтобы сделать его выходным. Помните, что элемент пользовательского интерфейса, к которому вы хотите подключиться, и тип свойства должны быть одинаковыми. В данном случае это UILabel. (Свойство является необязательным, что является важной концепцией в Swift).
• Хорошо, далее добавьте в класс следующую функцию:

@IBAction func onButtonTap() let titles = [“Мой корабль на воздушной подушке полон угрей!”, “BOOYAH!”, “Элвис покинул здание” ].

Куда вы добавляете эту функцию? Убедитесь, что добавили ее внутрь класса ViewController, то есть в его фигурные скобки

. Также добавьте функцию под функцией viewDidLoad(), но не внутри нее. Используйте скриншот ниже, чтобы проверить свою работу.

Что происходит в этой функции onButtonTap()? Вот что:

Мы объявили функцию под названием onButtonTap(). Она использует ключевое слово @IBAction, что означает, что мы можем позже связать эту функцию с действием в Interface Builder – действием “нажатие кнопки”.

Внутри функции мы создали массив строк под названием titles. Мы присваиваем константе titles литерал массива. Массив содержит 3 элемента типа String, разделенные запятыми. Тип массива titles – [String].

С помощью кода titles.randomElement() мы получаем случайную строку из массива titles. Выбирается любая из трех строк.

Затем эта случайная строка присваивается свойству text свойства textLabel. Эта метка – точно такая же метка, какую мы добавили в Interface Builder – которую нам еще нужно будет подключить. По-другому говоря, мы назначаем случайную строку для отображения в текстовой метке!

Хорошо, давайте теперь подключим этот аутлет и экшен. Сначала переключитесь на Main.storyboard в Xcode. Снова откроется Interface Builder.

Найдите и щелкните элемент View Controller в контуре документа слева.

Теперь вы увидите нечто похожее на скриншот ниже. Обратите внимание на два элемента – выход и действие – в инспекторе соединений, textLabel и onButtonTap. Также обратите внимание на маленькие кружочки рядом со всеми этими элементами в инспекторе. Далее мы подключим их к пользовательскому интерфейсу.

textLabel?.text = titles.randomElement() >Сначала мы подключим свойство textLabel outlet к элементу пользовательского интерфейса label. Это создаст связь с выходом. Вот что нужно сделать:< >Найдите элемент textLabel в инспекторе подключений.

Перетащите его из круга справа на UI-элемент label.

• Далее мы сделаем то же самое для действия. Вот как:
• Найдите элемент onButtonTap в инспекторе соединений.
• Перетащите его из круга справа на элемент пользовательского интерфейса кнопки
• Обязательно нажмите на элемент Touch Up Inside!

Пункт Touch Up Inside соответствует нажатию кнопки, поэтому очень важно выбрать именно этот пункт.

Теперь вы готовы запустить свое приложение. Сначала выберите iPhone Simulator в левом верхнем углу Xcode, а затем нажмите кнопку Run или нажмите Command + R. Ваше приложение запустится на iPhone Simulator. Что происходит, когда вы нажимаете на кнопку? Все работает нормально? Потрясающе!

Играйте с кодом: Игровые площадки в Xcodey

Что, если вы не хотите создавать приложение? Не волнуйтесь! В Xcode можно писать и на обычном Swift. Для этого у вас есть 2 альтернативы:

• С помощью приложения Swift Playgrounds для Mac и iPad.
• Swift Playgrounds – это приложение для iPad и macOS, которое в игровой, практической форме учит вас кодировать на Swift.

Вы решаете всевозможные задачи, изучая функции, циклы, условия и многое другое. Вы также можете подключить к приложению датчики, LEGO и дроны и использовать их для игры и кодирования. И Swift Playgrounds – это не только для детей!

• Другой подход – создание игровой площадки в Xcode. Игровая площадка – это, по сути, файл Swift с несколькими полезными инструментами для кодирования. Почему бы вам не попробовать?
• Откройте Xcode, затем выберите Файл → Новый → Игровая площадка….
• Перед вами появится пустой Swift-файл с некоторым кодом по умолчанию.

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

Скопируйте и вставьте в редактор следующий фрагмент:

Int if i Пакеты Swift. Но как насчет их версий?

Вы можете ясно видеть, что мы находимся на версии 5.5.2 SDWebImage, и что мы хотим автоматически обновляться до новых версий вплоть до следующих основных версий. Это означает, что Xcode обновится до таких версий, как 5.5.3 и 5.6.0, но не до 6.0.0. Отлично!

Популярные инструменты для Xcode

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

Вот несколько моих любимых из них:

Fork, бесплатный клиент/интерфейс Git с открытым исходным кодом.

Fastlane, целый набор инструментов для автоматизации приложений

Balsamiq для создания проволочных схем/макетов и Sketch для векторной графики и дизайна пользовательского интерфейса

Reveal, инструмент отладки представлений для iOS

SimPholders, инструмент повышения производительности и пусковая установка для iPhone Simulator

func fibonacci(_ i: Int) ->xScope, инструмент визуального инспектора для приложений

Bugsnag, инструмент отчетности об ошибках и контроля качества для производственных приложений.

Что дальше?

Pfew! Мы прошли долгий путь изучения Xcode в этом учебнике. Вот что мы обсудили: