Создавайте iOS-приложения с дополненной реальностью

Когда я учился использовать Reality Kit, я был рад обнаружить, что Xcode предоставляет вам хороший шаблон дополненной реальности, содержащий «коробку», которую вы можете разместить на плоской поверхности с помощью своего устройства. Легко и круто! Как только я начал играть с ним, один из первых вопросов, который пришел мне в голову, был «как сфотографировать эту коробку (без скриншота устройства)?».

Документации не хватает, и не так много учебных пособий. Здесь я делюсь простым решением, которое я нашел, используя этот готовый образец «коробки» (каламбур), доступный в Xcode.

Создайте свой проект

В Xcode создайте новый проект дополненной реальности: Файл › Создать › Проект. Выберите iOS › Дополненная реальность.

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

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

Теперь мы изменим этот базовый шаблон, чтобы добавить кнопку спуска затвора и сделать снимок вида AR.

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

Во-первых, мы поместим кнопку, которая сделает нашу фотографию. Найдите следующую строку в ContentView:

return ARViewContainer().edgesIgnoringSafeArea(.all)

Замените эту строку следующей:

ZStack(alignment: .bottom){
  ARViewContainer().edgesIgnoringSafeArea(.all)
Button {
  
  // Placeholder: take a snapshot
  
  } label: {
    Image(systemName: "camera")
      .frame(width:60, height:60)
      .font(.title)
      .background(.white.opacity(0.75))
      .cornerRadius(30)
      .padding()
  }
}

Это создает круглую кнопку с соответствующим символом SF. Эта кнопка выполнит снимок позже, запишите строку «Заполнитель», так как мы вернемся к ней позже.

Создайте статическую переменную, чтобы отслеживать представление AR.

В том же файле ContentView.swift создайте новую структуру ARVariables. Это будет содержать ARView.

struct ARVariables{
  static var arView: ARView!
}

Эта статическая переменная позволит нам получить доступ к ARView в других частях нашего кода и, таким образом, сфотографировать его.

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

func makeUIView(context: Context) -> ARView {
  ARVariables.arView = ARView(frame: .zero)
  // Load the "Box" scene from the "Experience" Reality File
  let boxAnchor = try! Experience.loadBox()
  // Add the box anchor to the scene
  ARVariables.arView.scene.anchors.append(boxAnchor)
  return ARVariables.arView
}

Все, что мы делаем выше, — это говорим методу использовать структуру, которую мы создали на предыдущем шаге.

Напишите функцию

Мы почти на месте! Найдите действие «Заполнитель» внутри ранее созданной кнопки и замените его на:

// (Placeholder): Take a snapshot
ARVariables.arView.snapshot(saveToHDR: false) { (image) in
  
  // Compress the image
  let compressedImage = UIImage(data: (image?.pngData())!)
  // Save in the photo album
  UIImageWriteToSavedPhotosAlbum(compressedImage!, nil, nil, nil)
}

В этом фрагменте мы вызвали функцию моментального снимка статической переменной arView и сохранили ее в наш фотоальбом после первого сжатия изображения.

Запрос разрешений на фотоальбом

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

Выберите свой проект (в нашем случае SnapshotExample) и откройте вкладку Информация.

На любом из ключей нажмите кнопку «+», найдите Privacy- Photo Library Usage Description и введите его значение, которое будет понятно конечному пользователю, например «Требуется для сохранения изображений AR в библиотеке фотографий».

Построить и запустить

Мы сделали! Создайте и запустите свой проект, подождите, пока коробка не появится на экране, и сделайте снимок, он будет сохранен в вашей библиотеке фотографий.

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

Полный проект можно найти в приведенном ниже репозитории GitHub: