На WWDC 2018 компания Apple выпустила ARKit 2.0 с множеством новых API и функций для расширенной разработки дополненной реальности. Одна из этих функций была дополнением к их API Quick Look. Если вы не знакомы с тем, что такое Quick Look, это в основном инфраструктура, которая позволяет пользователям просматривать весь спектр форматов файлов, таких как PDF-файлы, изображения и многое другое! Например, приложение Mail в iOS использует Quick Look для предварительного просмотра вложений.

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

В этом году для iOS 12 Apple представила Quick Look для объектов Augmented Reality. Это означает, что вы можете делиться .usdz файлами в Mail, Messages или любом приложении, поддерживающем Quick Look. Получатель может открыть его и просмотреть объект, не загружая дополнительное приложение.

 

Быстрый просмотр AR в iOS 12

 

На приведенном выше рисунке вы можете увидеть, как чайник просматривается в AR без помощи отдельного приложения. Однако AR Quick Look не ограничивается просто приложениями. Вы также можете интегрировать AR Quick Look в веб-сайты! Дальше, мы расскажем вам об интеграции AR Quick Look в приложении iOS.

 

Примечание. Для этого урока мы будем использовать Xcode 10, который все еще находится в бета-версии на момент написания. Чтобы увидеть AR Quick Look в действии, вам нужно запустить приложение на устройстве под управлением iOS 12. Имейте это в виду во время разработки вашего приложения.

 

Что такое USDZ?

Прежде чем мы начнем кодирование, важно понять, что такое USDZ. Так же, как и многие форматы файлов, одним из них является USDZ. Это означает Universal Scene Description Zip . Если вы работали с 3D — моделями, вы знакомы с  .OBJ.DAE, или .sketchup. USDZ — это файл, созданный в сотрудничестве с Pixar и Apple.

По своей сути, файл USDZ представляет собой не что иное, как .zip архив, он упаковывает модель и ее текстуры в один файл. Вот почему файлы USDZ используются для Quick Look.

Теперь вам, наверное, интересно: «Как мне создать файл USDZ?» Вы создаете свою собственную трехмерную модель с помощью своего любимого программного обеспечения для 3D-моделирования (AutoCAD, Blender, Maya и т. Д.), А затем используйте инструменты командной строки Xcode для преобразования этого файла в .usdzформат файла.

Попробуем преобразовать нашу собственную модель в формат файла USDZ!

 

Преобразование 3D-модели в формат файла USDZ

Преобразование модели в USDZ довольно просто и требует только одной строки кода! Мы будем преобразовывать 3D-модель объекта, которое я создал. Вы можете скачать модель здесь .

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

 

 

Это все! Вот как выглядит мой терминал:

 

Быстрый просмотр AR в iOS 12

 

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

 

Быстрый просмотр AR в iOS 12

 

Не беспокойтесь, если он черный. Теперь, когда у нас есть собственный USDZ файл, давайте начнем его интегрировать в наш проект.

 

Добавление AR Quick Look в приложениях

 

Быстрый просмотр AR в iOS 12

 

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

 

Быстрый просмотр AR в iOS 12

 

Во-первых, давайте добавим нашу модель Egg в Models папку. Перетащите egg.usdz в папку моделей.

 

Быстрый просмотр AR в iOS 12

 

Затем ViewController.swift перейдите egg к models массиву и добавьте его . Таким образом, когда мы запустим наше приложение, модель появится в списке. Чтобы быть уверенным, запустите приложение снова.

 

Быстрый просмотр AR в iOS 12

 

Оно работает! Теперь все, что осталось, — это добавление кода для быстрого просмотра этих моделей. Сначала начните с импорта QuickLook пакета. Когда мы создаем UICollectionView , мы также добавляем протоколы Data Source и Delegate, чтобы предоставить доступ к методам, необходимым для добавления данных в наш просмотр коллекции. То же самое мы делаем для Quick Look. Измените свой код, чтобы он выглядел как показано ниже.

 

 

Есть два метода, которые нам нужно добавить для настройки к добавляемым нами протоколам: numberOfPreviewItems() и previewController(previewItemAt). Это вы знаете, если вы работали с UITableViews или UICollectionViews. Добавьте следующий код в конец нижеприведенного класса collectionView(didSelectItemAt).

 

func numberOfPreviewItems(in controller: QLPreviewController) -> Int {
    return 1
}
    
func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
    let url = Bundle.main.url(forResource: models[thumbnailIndex], withExtension: «usdz»)!
    return url as QLPreviewItem
}

 

 

  1. В первой функции нам задают вопрос, сколько элементов разрешено предварительно просматривать за раз. Поскольку мы хотим предварительно просмотреть одну 3D-модель за раз, мы возвращаем 1 в код.
  2. Вторая функция спрашивает, какой файл следует просмотреть, когда элемент кликается на конкретном index. Мы определяем константу, называемую url контуром наших .usdz файлов. Затем мы возвращаем файл как a QLPreviewItem.

 

Если вы сейчас запустите код, ничего не произойдет. Это потому, что мы не добавляли логику для QLPreviewController. Перейдите к collectionView(didSelectItemAt) методу и измените его так, чтобы он выглядел следующим образом:

 

Быстрый просмотр AR в iOS 12

 

Обязательно попробуйте приложение на реальном устройстве под управлением iOS 12.

Приложение работает, как ожидалось! Теперь вы знаете, как интегрировать AR Quick Look в свои приложения.

Пролистать наверх