Дополненная реальность с NativeScript

В связи с выходом iOS 11 мы с радостью сообщаем о готовящемся функционале дополненной реальности (AR) в NativeScript!

Последние релизы AR SDK от Apple (ARKit) и Google (ARCore) предоставили возможность разработчикам NativeScript создавать захватывающие межплатформенные AR-события. Приложение в видео выше было создано в альфа-версии нашего плагина nativescript-ar. Сегодня этот плагин использует API ARKit, доступные в iOS 11. В ближайшем будущем поддержка будет добавлена ​​для Android через API ARCore.

Вообще устройства должны работать на iOS 11 для полноценной поддержки ARKit, но из-за того, что API-интерфейсы NativeScript загружаются во время выполнения, с плагином nativescript-ar вы можете работать и на более старых версиях iOS.

iOS 11 поддерживает iPhone 6S и более новые устройства.

С ARCore на Android совсем другая история, поскольку Google ограничил поддержку ARCore для Android 8 (Oreo), работающую только на Samsung Galaxy S8 и Google Pixel. Хотя поддержка, безусловно, расширится, производители Android, как известно, медленно обновляются до последней версии Android.

Наиболее правильный способ использования AR — вначале обнаружить поверхность, затем поместить объекты на поверхность (или выше). Объекты могут быть чем угодно: от кубов и сфер до полномасштабных 3D-моделей, используя сотни тысяч полигонов. Объекты могут иметь массу, следовательно, гравитация может также влиять на них.

Ищете бесплатный репозиторий 3D-моделей для вашего следующего AR-проекта? Взгляните на turbosquid.com.

Немного кода

Цель нашего AR-плагина — исключить ненужную путаницу с платформами и предоставить чистый и понятный API. Использовать его очень просто — добавьте элемент в ваше представление и укажите события и свойства для управления его поведением:



С плагином nativescript-ar вы сможете перехватывать события и программно взаимодействовать с потоком с камеры на экране. К примеру, вы можете получить уведомление о том, в какой координатой плоскости произошло какое-то действие:

…затем присвойте событие planeTapped к вашему компоненту, чтобы добавить (в нашем примере) трехмерную модель дерева к этой конкретной точке сцены:

planeTapped(position: ARPosition): void {
this.ar.addModel({
name: "tree.dae",
position: position,
scale: 0.01,
mass: 0.0002,
onLongPress: ((model: ARNode) => {
model.remove();
})
});
}

Когда это будет доступно?

Как только, так сразу 🙂

Сейчас плагин nativescript-ar активно дорабатывается. Первый релиз будет поддерживать только ARKit из-за упомянутых выше нюансов с поддержкой ARCore под Android. Однако API ARKit и ARCore относительно похожи, поэтому во время разработки мы держим в уме общую картину, чтобы сделать по-настоящему кросс-платформенное решение.

Несмотря на это, благодаря большому покрытию API в обоих SDK (и благодаря возможностям NativeScript) разработчики всегда смогут использовать неопубликованные пока API-интерфейсы платформы, даже если они не реализованы в плагине.

Здесь, в Progress, мы очень рады будущему с дополненной реальностью на мобильных устройствах и мы счастливы, что NativeScript может помочь вам с этим.

По материалам Preview of Augmented Reality in NativeScript