Блог от AS3Coder'a о JavaScript, HTML, CSS... и немного о Flash.

среда, 25 августа 2010 г.

Сохранение изображения с Web-камеры

1. Обращение к камере

Для работы с web-камерами во FlashPlayer имеется специальный класс flash.media.Camera. Чтобы получить список доступных камер на компьютере необходимо спросить его у статического свойства names.

var list:Array = Camera.names;
Теперь чтобы обратиться к конкретной камере, нужно вызвать статический метод getCamera, где в качестве параметра передается имя камеры из полученного выше списка. Метод вернет экземпляр класса flash.media.Camera.

var camera:Camera = Camera.getCamera(list[0]);
Но как заметил Илья Панин, обращение к камере в ActionScript 3.0 работает не так, как это описано выше. Казалось бы всё правильно и взято из официальной справки. Но это не так. В качестве параметра методу getCamera необходимо передавать индекс камеры, а не её название, причем в виде строки.

var camera:Camera = Camera.getCamera(index.toString()); // index - порядковый номер камеры
2. Вывод изображения с камеры на сцену

Изображение с камеры - это видео-поток, и для его воспроизведения воспользуется классом   flash.media.Video. Создаем экземпляр класса и добавляем его на сцену. В конструкторе указывается ширина и высота видео.

var video:Video = new Video(320, 240);
addChild(video);
Теперь чтобы отобразить в экземпляре полученного видео изображение с камеры необходимо её просто прикрепить. Вызываем метод attachCamera, где в качестве параметра указываем ссылку на камеру.

video.attachCamera(camera);
После того, как мы попытаемся что-нибудь сделать с изображением с камеры (показать его на сцене, отправить на сервер) FlashPlayer попросит разрешение на это действие у пользователя. Появится диалоговое окно с соответствующим вопросом.



После выбора одного из пунктов камера отправляет событие flash.event.StatusEvent типа STATUS. В обработчике этого события можно даже узнать о выборе пользователя. У экземпляра камеры имеется свойство muted, которое говорит запретил ли пользователь использовать соответствующую камеру.

После того, как изображение с камеры разрешено показать на сцене в экземпляре класса flash.media.Video, необходимо некоторое время для активации камеры. После полной активации камеры она отправляет событие flash.event.ActivityEvent типа ACTIVITY.
Еще одной важной особенностью работы с камерой во FlashPlayer является то, что одновременно показать изображение с неё в разных окнах плеера не получится. Попробуйте открыть эту страницу в двух разных браузерах. Во втором изображение с камеры вы не увидите, пока не закроете первое открытое окно.

3. Сохранение изображения со сцены

Экземпляр класса flash.media.Video является потомком класса flash.display.DisplayObject и в любой момент времени, например по нажатию соответствующей кнопки, мы можем преобразовать изображение с камеры в данные класса flash.display.BitmapData.

Для этого необходимо создать экземпляр flash.display.BitmapData. В конструкторе указываем ширину и высоту. Вызываем метод draw, с единственным параметром - ссылкой на экземпляр нашего видео.

var bitmapdata:BitmapData = new BitmapData(video.width, video.height);
bitmapdata.draw(video);
Теперь с помощью любого энкодера мы можем преобразовать полученные данные в бинарный файл изображения. Например используя com.adobe.images.PNGEncoder после преобразования, мы получим экземпляр класса flash.utils.ByteArray

var brr:ByteArray = PNGEncoder.encode(bitmapdata);
Осталось только сохранить полученный файл на диск. Используем для этого класс flash.net.FileReference. Создаем экземпляр и вызываем метод save, с двумя параметрами: бинарные данные файла, имя файла.

var file:FileReference = new FileReference();
file.save(brr, "image.png");
Подробнее о сохранении изображения смотрите в предыдущем посте.

4. Пример



5. Как распознавать лица на изображении?

Об этом я напишу в следующем посте. Хочу только сказать огромное спасибо за реализацию этой возможности Ohtsuka Masakazu и Mario Klingemann, а также Eugene Zatepyakin
      
Смотрите также:

12 комментариев:

  1. Самое интересное в следующей серии... Подождем :)

    ОтветитьУдалить
  2. Да, на удочку Camera.getCamera(hereMustBeCameraName); попадаются многие, а я дважды - в первый раз, когда не знал, а во второй раз -- когда забыл. :)

    ОтветитьУдалить
  3. А существуют ли энкодеры последовательности кадров в видеоформат? например, можно ли ряд картинок сохранить как видео?

    ОтветитьУдалить
  4. Да, существуют. Вот пример. Google Code видел подобный проект.

    ОтветитьУдалить
  5. при сохранении появляется сообщение о краше плеера,браузера, запускаю в flash cs4 тоже не пашет((

    ОтветитьУдалить
  6. Блин, вообщето в таких примерах кроме визуального представления вышесказанного, выкладывают еще и исходные коды!

    ОтветитьУдалить
  7. Да !! если не трудно выложите пример, а то уже пол дня, бьюсь не могу заставить работать эту камеру :((

    ОтветитьУдалить
  8. Аналогично никак не получается реализовать, так как я начинающий очень сильно в этих вопросах, и постоянно что-то не то кажется делаю.

    Заранее благодарен!

    ОтветитьУдалить
  9. Отличный пример. Все понятно расписано.

    ОтветитьУдалить
  10. Ребят может подскажите: когда в скайпе активируешь камеру - тормозов нет, а когда через флеш на сайте - есть небольшие тормоза, как бы при активном движении картинка не успевает за тобой. почему так? заранее спасибо.

    ОтветитьУдалить
  11. Спасибо, интересная статья, но такой вопрос: Работает только встроенная веб-камера. У меня через USB подключена еще одна камера, она определяется как SMI Grabber Device, но при переключении на ее изображение отсутствует. Может подскажите где копать?

    ОтветитьУдалить
  12. Проверьте не выводится ли изображение с камеры в какой-нибудь другой вкладке (включая другие браузеры).
    Одновременно снимать изображение можно только на одной странице.

    ОтветитьУдалить

Можно использовать некоторые HTML-теги, например <b>, <i>, <a>

Поиск по блогу

Обо мне



Farid Shamsutdinov (AS3Coder)
Russia, Tatarstan, Kazan
as3coder@gmail.com

Подробнее...

Постоянные читатели

Рассылка

© 2014 Farid Shamsutdinov. При копировании материалов, ссылка на источник обязательна. Технологии Blogger.