2015-12-29 6 views
1

Я создаю приложение на Ionic и интегрировал API ngcordova. Мне интересно, есть ли способ выбрать изображение из галереи в моем приложении, а затем открыть камеру и наложение, положение, изменение размера, скриншот и т. Д. Изображение поверх обзора камеры?ngcordova camera image overlay

ответ

0

Да, это возможно.

Вы можете обернуть <video> элемент и <canvas> элемента в <div> контейнере, а затем прикрепить камеру к видео (использование getUserMedia() API).

Вы можете записывать снимки с камеры: используйте drawImage API из холста/контекста (см., Например, http://appcropolis.com/blog/web-technology/using-html5-canvas-to-capture-frames-from-a-video/).

Контейнер <div> может использоваться для хранения (через CSS) видео и элементов холста вместе и правильного изменения размера/положения.

Элемент <canvas> может использоваться для рисования изображений, наложенных на видео (с использованием значения непрозрачности CSS).

API GetUserMedia (и другие API WebRTC) доступны на Android благодаря Crosswalk, который является альтернативой WebView в проекте Ionic/Cordova.

+0

У меня создалось впечатление, что getusermedia не работает на мобильных устройствах? Является ли это решение действительно жизнеспособной стратегией для выполнения наложения изображений на потоке живой камеры с ионным как для дроидов, так и для ios? – galactictourist

+0

Я должен добавить, что на Android это возможно благодаря [Crosswalk] (https://crosswalk-project.org/), который является альтернативой WebView в проекте Ionic/Cordova. Существует также проект Crosswalk для iOS (см. Https://crosswalk-project.org/documentation/ios.html), но я еще не использовал его. – beaver