Я создаю приложение на Ionic и интегрировал API ngcordova. Мне интересно, есть ли способ выбрать изображение из галереи в моем приложении, а затем открыть камеру и наложение, положение, изменение размера, скриншот и т. Д. Изображение поверх обзора камеры?ngcordova camera image overlay
ответ
Да, это возможно.
Вы можете обернуть <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.
У меня создалось впечатление, что getusermedia не работает на мобильных устройствах? Является ли это решение действительно жизнеспособной стратегией для выполнения наложения изображений на потоке живой камеры с ионным как для дроидов, так и для ios? – galactictourist
Я должен добавить, что на Android это возможно благодаря [Crosswalk] (https://crosswalk-project.org/), который является альтернативой WebView в проекте Ionic/Cordova. Существует также проект Crosswalk для iOS (см. Https://crosswalk-project.org/documentation/ios.html), но я еще не использовал его. – beaver