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

воскресенье, 28 ноября 2010 г.

Поездка в Челябинск на RAFPUG

Ровно неделю назад я со своим коллегой Виталием приехали с Челябинска, куда ездил на очередной RAFPUG проводимый компанией iHeroes. Написать отчет о поездке сразу не получилось, как всегда было много работы. И сегодня таки появилось несколько свободных минут.

Прямых поездов или самолетов на 19-20 ноября из Казани в Челябинск не оказалось. Решено было ехать на машине. 1000 км туда - 1000 км обратно. Поэтому поездку можно даже назвать маленьким путешествием :)

Приехали мы в Челябинск с опозданием, минут на 40 и все-таки успели на первый доклад.

Первым выступал Роман Куликов, он представлял своё издательство i-Jet Media.



Доклад получился очень насыщенным и интересным. Например было интересно узнать, что:
  • «Счастливый фермер» заработал за 2009 год 20 000 000 долларов.
  • Cредняя продолжительность игрового проекта в социальных сетях - это около 6 месяцев.
  • Азиаты - одни из самых платежеспособных наций.
  • И многое другое...
Следующим выступал Илья Алябушев из компании Flexis.



Его доклад был посвящен методу организации работы с помощью технологии Scrum. Доклад получился больше технический, с кучей новых терминов и непонятных слов :) Тем не менее у Ильи получилось в общих чертах истолковать идею Scrum, за что ему огромное спасибо.

Следующей темой собрания была «Инди-разработка». Ею с нами поделился Алексей Давыдов из компании Flazm.



Он повествовал, что же это такое «инди». Немного запутал конечно, но суть ясна: "Инди-разработчик - это тот, который работает только на себя" :) Рассказал о плюсах и минусах этого направления. В общем было что послушать.

Следующей вышла Анна Сенина, организатор встречи и представитель компании iHeroes.



Анна рассказала о том:
  • что такое Аква3D, над которым они работают уже около года, 
  • как устроена организация работы в их команде, 
  • как они используют для этого Scrum, о котором рассказывал Илья Алябушев.
Ну и самый ожидаемый доклад Антона Волкова - отца 3D-движка Alternativa3D.


Лет пять назад, изучая Flash мне часто попадались его исходники, и именно его доклад вызывал у меня больший интерес. Мне хотелось увидеть его живьем :) Кстати когда я зашел в зал из AlternativaPlatform я узнал только Александра Карповича, и в какой-то момент даже испугался что Волкова сегодня не будет. Но мои сомнения развеялись, чуть позже Антон приехал вместе с Владимиром Бабушкиным.

Доклад Антона получился конкретно по делу, ничего лишнего. Он рассказал о том как становилась компания AlternativaPlatform, как развивалось 3D во FlashPlayer, как они попали на Adobe Max, какое они имеют отношению к новому плееру под кодовым именем "Molehill", как придется работать с 3D API во нем, когда он будет доступен в релизе. Показал готовые демки на новом плеере, а также повествовал о планах компании. В общем рассказал всё, что было интересно публике.

Из его доклада я выдели две важные вещи:
  • Ожидать новый плеер в бете можно весной 2011 года, в релизе - не раньше лета 2012.
  • Сейчас можно без опасений на будущее использовать 7 версию движка, т.к. AlternativaPlatform обещают безболезненный переход на 8 версию.
После доклада Антона, нам пришлось уехать чтобы успеть на ночлег в Уфе. И мы пропустили доклад Владимира Бабушкина с Евгением Сушковым и блиц-доклад Максима Фирсова, а также выпивания в ближайшем кафе, о чем сильно жалеем :(

Кстати еще больше мы пожалели об этом, когда выехали из Челябинска и уже спустя час на трассе началась настоящая пурга. Дорога превратилась каток, дальше пяти метров ничего не видно. Плюс сотрудники гибдд перекрывают трассу, до приезда дорожных служб. В какой-то момент даже приходила мысль переночевать в машине на обочине. Но спустя пару часов, мы дождались дорожную службу, которая полила дорогу специальным составом и легковые машины пустили. Так при скорости 30-60 км./ч. часов за шесть часов мы все-таки добрались до окрестностей Уфы. Переночевали, и снова в дорогу :) Вечером были в Казани.

Также смотрите отчет и фотки от Анны Сениной. Организаторам встречи огромное спасибо :)
       

воскресенье, 24 октября 2010 г.

Отладка AS3-приложений с помощью FireFlash

Что такое FireFlash?

FireFlash - это плагин для FireBug'а, с помощью которого можно легко и удобно отлаживать свои приложения.

Что такое FireBug?

FireBug - это расширение для браузера Mozilla Firefox. Используется он для отладки web-приложений и пожалуй является самым сильным инструментом в этой области. Попробовав раз, отказаться от него уже не сможешь :)

Что умеет FireFlash?

FireFlash предоставляет .swf-файлам на странице доступ к консоли FireBug'a. С возможностями добавлять в консоль и окно Output используемого редактора ActionScript 3.0 записи разных типов:
  • Записи журнала
  • Информационные сообщения
  • Сообщения об опасности
  • Деревья объектов
  • ...
Как установить FireFlash?

Первым делом нужно установить Mozilla Firefox, если такого не имеется. Скачать его можно с официального сайта http://www.mozilla.com/.

Во-вторых, нужно поставить плагин FireBug не ниже версии 1.4.5. Установить его можно на соответствующей странице https://addons.mozilla.org/en-US/firefox/addon/1843/. После установки в правом нижнем углу браузера появится соответствующая иконка для открытия окна FireBug'a.



В-третьих нужно поставить сам FireFlash. Сделать это можно также со страницы дополнений к Mozilla Firefox по адресу https://addons.mozilla.org/en-US/firefox/addon/55979/. В правом верхнем углу содержимого FireBug'a вы увидите вот такую иконку.



Как обращаться к FireFlash из ActionScript 3.0?

Для этого имеется библиотека классов com.actionscript_flash_guru.* В ней имеется единственный необходимый нам класс com.actionscript_flash_guru.fireflashlite.Console.as, который содержит в себе различные методы для работы с FireFlash. Скачать архив с библиотекой можно с официальной страницы. А также можно подписаться на уведомления об обновлении библиотеки в Twitter.

А можно по-подробнее?
/**
 * 
 */
/**
 * Блокирует вывод сообщений в окно Output внутри используемого FrameWork
 * Другими словами класс консоли не регистриует свои сообщения при помощи фунции trace();
 */
Console.disableIdeTrace();
/**
 * 
 */
/**
 * Метод выводит в консоли FireBug'a содержимое объекта в виде дерева,
 * а также дублирует его в окне Output
 * 
 * @param Ссылка на объект
 * @param Количество вложенностей дерева
 * @param Сопутствующее сообщений
 */
Console.dir(obj, 3, "Custom message");
/**
 * 
 */
/**
 * Метод выводит в консоли FireBug'a содержимое xml-строки,
 * а также дублирует его в окне Output
 * 
 * @param Строка xml-узла
 * @param Сопутствующее сообщений
 */
Console.dirxml(xml, "Custom message");
/**
 * 
 */
/**
 * Метод выводит в окно Output сообщение с меткой ошибки, 
 * ссылкой на класс и метод инициализировавший ошибку
 * 
 * @param Строка с сообщением об ошибке
 */
Console.error("Error message");
/**
 * 
 */
/**
 * Метод созает таймер с заданным идентификатором и начинает отсчет.
 * Для того чтобы, остановить таймер необходимо 
 * использовать метод timeEnd();
 * 
 * @param Идентификатор таймера
 */
Console.time("your_id");
/**
 * 
 */
/**
 * Метод останавливает таймер c заданым идентификатором.
 * Выводит информационное сообщение в консоль FireBug'a
 * с указанием имени .swf-файла, идентикатора таймера и его значения.
 * А также дублирует сообщение в окно Output с соответвующей меткой
 */
Console.timeEnd("your_id");
/**
 * 
 */
/**
 * Метод проверяет условие, и если оно ложное 
 * выводит указанное сообщение в окно Output
 * 
 * @param Условие
 * @param Сообщение для ложного значения
 */
Console.assert(false, "Messages for the false values");
/**
 * 
 */
/**
 * Метод выводит в окно Output сообщение с
 * ссылкой на класс и метод инициализировавший вызов
 * 
 * @param Строка с сообщением об ошибке
 */
Console.stackTrace();
/**
 * 
 */
/**
 * Метод выводит простое сообщение в консоль FireBug'a, 
 * а также дублирует его в окно Output с соответствующей меткой
 * 
 * @param Текстовое сообщение
 */
Console.log("Simple message");
/**
 * 
 */
/**
 * Метод выводит информационное сообщение в консоль 
 * FireBug'a с соответствующей иконкой, а также дублирует 
 * его в окно Output с соответствующей меткой
 * 
 * @param Информационное сообщение
 */
Console.info("Information message");
/**
 * 
 */
/**
 * Метод выводит сообщение об опасности в консоль 
 * FireBug'a с соответствующей иконкой, а также дублирует 
 * его в окно Output с соответствующей меткой
 * 
 * @param Cообщение об опасности
 */
Console.warn("Warning message!");
/**
 * 
 */
/**
 * Метод дублирует поведение метода log();
 */
Console.debug("Simple message");
/**
 * 
 */
/**
 * Метод добавляет в консоли FireBug'а блок для группы
 * с заданным названием, а также дублирует соответсвующую 
 * запись в окне Output
 * 
 * @param Названия для группы
 */
Console.group("Group name");
/**
 * 
 */
/**
 * Метод дублирует поведение метода Console.group();
 * только блок будет иметь закрытое состояние
 */
Console.groupCollapsed("Group name");
/**
 * 
 */
/**
 * Метод закрывает блок, открытый ранее
 * Используется только после вызова методов 
 * Console.group(); и Console.groupCollapsed();
 */
Console.groupEnd();

А как-же пример?

Откройте консоль FireBug'a и понажимайте на кнопки из примера. Вы должны увидеть результат примеров.



Дополнительно

Более подробно ознакомиться с FireFlash можно на его официальной странице

Огромное спасибо за новый инструмент Nicholas Dunbar, надеюсь его работа прижевется в руках разработчиков ActionScript-приложений. А также спасибо Flastar'у за информацию о существовании инструмента.
        

среда, 6 октября 2010 г.

Проверка орфографии в ActionScript 3.0

24 сентября 2010 года на сайте лаборатории Adobe обновился проект "Squiggly". Обновили проект до 4-ой пререлизной версии. О нем я услышал впервые, и очень им заинтересовался. Теперь хочу подделиться с вами.

Что такое проект "Squiggly"?

Это набор .swc-библиотек для работы с орфографией во Flash, Flex и AIR проектах. Название переводится как "волнистые" с намеком на то, что неправильные слова подчеркиваются именно этой линией.

Что он дает?

Возможности анализа текста в ActionScript 3.0.

Какие возможности?

Проверка орфографии и правил языка, варианты исправления неправильных слов.

На чем основан проект?

За основу взят проект "Hunspell".

Что это означает?

Это означает, что нам можно использовать уже готовые словари из других программ, основанных на этой же основе. Таких как: OpenOffice, Mozilla FireFox, Opera и многих других. Например, словари от Mozill'ы можно найти здесь. Но прежде чем использовать словари сторонних программ, пожалуйста ознакомьтесь с лицензионными соглашениями.

Как это работает?

Рассмотрим по-подробнее чистый ActionScript 3.0 проект. Загружаем архив с библиотеками. Нам понадобиться только одна из них: AdobeSpellingEngine.swc (Остальные предназначены для Flex-проектов). Подключаем её у нашему проекту.

Первым делом нужно загрузить словари с орфографией и правилами.

//
// Создаем экземпляр словаря
dictionary = new HunSpellDictionary();
//
// Добавляем обработчик события загрузки библиотек
dictionary.addEventListener(Event.COMPLETE, onDictanionaryComplete, false, 0, true);
//
// Грузим библиотеки
dictionary.load("dictionaries/en_US/en_US.aff", "dictionaries/en_US/en_US.dic");

После того, как словари загружены, в обработчике нужно создать объект который будет проверять орфографию слов.

/**
 * Метод обрабатывает событие успешной загрузки библиотек для словаря
 * Создает экземпляр объекта для проверки слов
 */
private function onDictanionaryComplete (e:Event):void
{
  //
  // Создаем экземпляр объекта для проверки слов, в параметре указываем ссылку на словарь
  spell_checker = new SpellChecker(dictionary);
}

Чтобы проверить какое-то слов нужно вызвать у проверяющего объекта метод checkWord();

spell_checker.checkWord("heloo");

Чтобы получить список возможных исправлений для слова имеется метод getSuggestions();

spell_checker.getSuggestions("heloo");

А как проверить содержимое текстового поля и подчеркнуть неправильные слова?

Алгоритм примерно такой:
  1. Разбиваем строку содержимого на список слов (В элементах списка нужно иметь значение слова, индекс первого символа и последнего).
  2. В цикле пробежаться по списку.
  3. Определить ошибочное слово.
  4. Зная индексы крайних символов с помощью метода TextField.getCharBoundaries() вычислить координаты слова
  5. Наложить на текстовое поле новый слой, в котором нарисовать волниcтые линии.

А пример?



Дополнительная информация

пятница, 17 сентября 2010 г.

Разработка приложений для iPhone на ActionScript 3.0 во FlashDevelop (Packager for iPhone)

Немного истории

За несколько дней до выхода последней на текущий момент среды разработки Flash-приложений Adobe Flash CS5, компания Apple выпустила запрет на разработку приложений для телефонов iPhone, используя сторонние технологии. А это означало то, что самая ожидаемая возможность новой платформы - портирование Flash-приложений на iOS (операционная система телефонов iPhone и планшетов iPad) использоваться не может. Для сообщества Flash-разработчиков это было настоящим ударом. Вокруг того события было много шума и обсуждений...

Adobe ничего не оставалось и пришлось смириться с этим. Они заявили, что прекращают все инвестиции в разработку Packager for iPhone и сконцентрируют своё внимание на мобильной платформе Android. Кстати у них это неплохо получилось: AIR и FlashPlayer уже есть на Android.

9 сентября 2010 года компания Apple заявляет об отмене ограничений на разработку приложений для iOS используя сторонние технологии. Для разработчиков Flash-платформы это стало радостной новостью. Adobe видимо тоже это обрадовало, и на забытой странице Packager for iPhone появилось специальное сообщение от 9 сентября о том, что Adobe возобнавляет работы над проектом Packager for iPhone. Я попробовал перевести его:

Недавнее заявление Apple о том, что он снял ограничения на принципы разработки третьими сторонами имеет прямые последствия для Packager для iPhone. Функция доступна для использования разработчиками уже сегодня и сейчас мы возобновим работу по развитию этой функции в будущих выпусках. Это отличная новость для разработчиков, и мы слышим от них, что новые приложения AIR для устройств iOS уже утверждены на Apple App Store. Мы хотим отметить, что ограничения на работу Flash содержимого в браузерах iOS устройств остается в силе.



Packager for iPhone

Из названия видно, что это упаковщик. Что же именно он упаковывает? А упаковывает он AIR-приложения. Т.е. мы будем разрабатывать AIR-приложения, после чего портировать их в родные для iOS инсталяторы приложения IPA файлы. Естественно нам будут доступны не все возмодности AIR. Именно поэтому Adobe собрал отдельную версию AIR SDK и назвал её «Packager for iPhone», который также умеет конвертировать приложения AIR в IPA.

Использование упаковщика доступно нам в двух вариантах:
  • Встроенные функции во Flash CS5
  • Отлельная библиотека AIR SDK
В данном посте я хочу показать пример разработки AIR-приложений для iPhone, используя FlashDevelop совместно с AIR SDK

Настроим FlashDevelop

О том, что такое FlashDevelop, как его установить и настроить, я говорить не буду. Если у вас его еще нету, то смотрите пост "FlashDevelop: установка и настройка". Кроме того, во избежания ошибок компилятора, советую обновить Flex SDK до версии 4.0.1. Найти последнюю версию сборки можно на сайте проекта.

Первым делом нужно скачать Packager for iPhone. Ссылку можно найти на официальной странице проекта. После загрузки нужно распаковать данный архив в постоянную директорию. Например у меня он лежит по адресу: C:\Program Files\Adobe\Adobe Packager for iPhone

Теперь открываем FlashDevelop и в Tools > Custom Arguments... заводим новый аргумент с именем PackagerForiPhonePath. В значении указываем выше выбранный путь до библиотеки нашего упаковщика.



Загружаем подготовленный мной образ проекта. Кладем его в Tools > Application Data... > Projects. Если всё сделано правильно, должен появиться новый типа проекта "Packager for iPhone Projector"



Это и есть наш проект для разработки AIR-приложений, которые впоследствии можно будет портировать в IPA-файлы. В следующих постах я буду обновлять образ проекта. На данный момент он имеет только те функции, которые необходимы в рамках данного поста.




Создадим новый проект

Идем в Project > New Project, называем наш проект "My first application for iPhone", выбираем тип проекта "Packager for iPhone Projector", жмем "OK". Получаем новый проект.



Сразу пробуем. Нажимаем F5. И видим окно нашего приложения с размерами для iPhone.



Здесь мы можем даже проэмулировать поворот девайса. Для этого выбираем Device > Rotate Left или Rotate Right. Окно приложения изменит размеры соотвественно.



Теперь подробнее расмотрим файлы проекта.



Так как это AIR-приложение мы имеем всё тоже что и в обычном AIR-проекте. Остановимся только на application.xml. Он имеет небольшие дополнения к стандартным дескрипторам.
<?xml version='1.0' encoding='UTF-8'?>
<application xmlns='http://ns.adobe.com/air/application/2.0'>
    <!--  -->
    <!-- The application ID uniquely identifies your application. 
         The recommended form is a dot-delimited, 
         reverse-DNS-style string, such as 'com.company.AppName'. 
         The compiler uses this value as the bundle ID for the iPhone application. -->
    <id>TestProject</id>
    <!--  -->
    <!-- The name used for the iPhone installer file. 
                     Do not include a plus sign (+) character in the filename. -->
    <filename>TestProject</filename>
    <!--  -->
    <!-- The name of the application displayed in the iTunes application and in the iPhone. 
         Do not include a plus sign (+) character in the name -->
    <name>Test Project</name>
    <!--  -->
    <!-- Helps users to determine which version of your application they are installing. 
         The version is used as the CFBundleVersion of the iPhone application. 
         It must be in a format similar to nnnnn[.nn[.nn]] 
                                 where n is a digit 0-9 and brackets indicate optional components, 
         such as 1, 1.0, or 1.0.1. iPhone versions must contain only digits and decimal points. 
         iPhone versions can contain up to two decimal points. -->
    <version>1.0</version>
    <!--  -->
    <!-- The element contains the following child elements to specify the properties 
                     for of the initial appearance of the application -->
    <initialWindow>
      <!--  -->
      <!-- The rendering mode used by the application. There are three possible settings:
            - cpu—The application uses the CPU to render all display objects. 
                                                  No hardware acceleration is used.
            - gpu—The application uses the iPhone GPU to composite bitmaps.
            - auto—This feature has not been implemented. -->
      <renderMode>gpu</renderMode>
      <!--  -->
      <!-- Identifies the root SWF file to compile into the iPhone application -->
      <content>TestProject.swf</content>
      <!--  -->
      <!-- Specifies that the application uses the entire screen of the iPhone -->
      <fullScreen>false</fullScreen>
      <!--  -->
      <!-- Specifies that the initial aspect ratio of the application 
                             is in portrait mode (rather than landscape). 
           Note the Default.png file used to define the initial window of the application 
                                         should be 320 pixels wide and 480 pixels high, 
           regardless of this setting. -->
      <aspectRatio>portrait</aspectRatio>
      <!--  -->
      <!-- Specifies whether the orientation of content in the application automatically 
                             reorients as the device itself changes physical orientation -->
      <autoOrients>true</autoOrients>
    </initialWindow>
</application>


На данный момент в нем не полный список дескрипторов, а только необходимый для разработки и отладки.

В следующих версиях образа проекта я буду добавлять их по необходимости. Ну если не втерпеж, полный список можно найти в официальном справочнике "Setting iPhone application properties in the application descriptor file"




Пробуем что-нибудь написать

Я написал вот такой небольшой код:
package 
{
  import flash.display.StageAlign;
  import flash.display.StageScaleMode;
  import flash.display.Stage;
  import flash.display.Sprite;
  import flash.events.Event;
  import flash.events.StageOrientationEvent;
  import flash.text.TextField;
  import flash.text.TextFieldAutoSize;
  import flash.text.TextFormatAlign;
  import flash.text.TextFormat;
  /**
   * ...
   * @author AS3Coder
   */
  public class Main extends Sprite 
  {
    private var message_txt:TextField;
    //
    function Main():void 
    {
      addEventListener(Event.ADDED_TO_STAGE, onAddToStage, false, 0, true);
    }
    //
    private function create ():void
    {
      message_txt = new TextField();
      message_txt.autoSize = TextFieldAutoSize.LEFT;
      message_txt.defaultTextFormat = new TextFormat("Tahoma", 11, 0, false, false, false, null, null, TextFormatAlign.CENTER);
      stage.addChild(message_txt);
      stage.dispatchEvent(new StageOrientationEvent(StageOrientationEvent.ORIENTATION_CHANGE));
    }
    //
    private function onAddToStage (e:Event):void
    {
      removeEventListener(Event.ADDED_TO_STAGE, onAddToStage, false);
      //
      stage.align = StageAlign.TOP_LEFT;
      stage.scaleMode = StageScaleMode.NO_SCALE;
      stage.addEventListener(StageOrientationEvent.ORIENTATION_CHANGE, onStageOrientationChange, false, 0, true);
      //
      create();
    }
    //
    private function onStageOrientationChange (e:StageOrientationEvent):void
    {
      message_txt.text = "My first application for iPhone\nStage orientation: " + stage.orientation;
      message_txt.x = stage.stageWidth * .5 - message_txt.width * .5;
      message_txt.y = stage.stageHeight * .5 - message_txt.height * .5;
    }
  }
}
Результат получился такой:



Попробуем повернуть:



Работает :)

Если вы еще не имели опыт разработки AIR-приложений, то вам сюда "Создание AIR-приложения во FlashDevelop".

Компиляция IPA-файлов

Упаковка IPA-файлов - это отдельная задача, которая требует реального устройства и получения сертификатов от Apple. Поэтому я отпущу пока эту тему. Как только у меня будет весь необходимый материал, я обязательно опишу по шагам всё решение этой задачи.




О чем еще стоит сказать

А сказать еще стоит о многом. Так как тема новая и не достаточно изученная, материала много. И рамках одного поста рассказать обо всем не получится. Пока только могу предложить пищу для размышлений, которую мы разберем позже:
В довесок хочу сказать, что Apple также обещала в скором времени выпустить свод правил для приложений, публикуемых в App Store. Так что ждем. А пока читаем публикацию Роста на эту тему: «Flash на iPad и "таблетках": о чем надо знать разработчикам».
           

Смотрите также:

понедельник, 6 сентября 2010 г.

Как очистить информацию, накопленную FlashPlayer'ом

Очень часто мы используем возможности SharedObject для хранения какой-то временной информации на компьютере пользователя, так называемый кэш FlashPlayer'a. Иногда возникают ситуации, когда что-то сохранилось и это нужно очистить.

Я, как разработчик, пойду в директорию \AppData\Roaming\Macromedia\Flash Player\#SharedObjects\, найду соответсвующую папку и потеру её. Но если такую же операцию необходимо будет выполнить клиенту, то такие действия могут показаться ему «дикими».

Так вот для этих целей у Adobe имеется специальный менеджер настроек Adobe Flash Player, который доступен по адресу http://www.macromedia.com/support/documentation/ru/flashplayer/help/settings_manager07.html. Кстати в последних версиях плеера, по-моему с 10 версии, в контекстном меню появилась ссылка на эту страницу под названием «Глобальные настройки», раньше её не было.



Для управления хранимой информации посредством SharedObject нам необходимо открыть вкладку "Параметры хранения веб-сайтов"



Здесь мы можем увидеть:
  • Какие сайты хранят информацию на вашем компьютере.
  • Сколько можно и сколько уже использует дискового пространства тот или иной сайт
Здесь же можно и удалить всю информацию для отдельного домена или для всех сразу. Мне кажется, такой способ очистки информации клиентам понравится больше.
        

пятница, 27 августа 2010 г.

Распознавание лиц на изображении в ActionScript 3.0


На многих фотоаппаратах, даже самых простых "мыльницах" появилась такая функция, как распознавание лиц. Иногда, это действительно удобно и даже необходимо.

А ведь и мы имеем доступ к Web-камере во FlashPlayer, почему бы и нам не реализовать такой механизм?

Первый над этим вопросом видимо задумался Ohtsuka Masakazu, и портировал библиотеку компьютерного зрения OpenCV написанную на C++ на ActionScript 3.0 и опубликовал её на Spark project.

Работает механизм следующим образом: ему подсовывают .xml-файлы, в которых описываются необходимые свойства для распознавания тех или иных объектов, после чего идет поиск на изображении. Размер такого .xml-файла для распознавания лиц составляет что-то около 1 Мб и загружать его по сети не очень корректно. Тогда Ohtsuka Masakazu запаковал его в .zip-архив, который получился в 100 Кб. И уже загрузив архив, использую библиотеку FZip, он его распаковывал внутри FlashPlayer.

Казалось, всё прекрасно работает и можно с радостью использовать

Но не тут-то было. Лишний запрос на запакованный .xml-файл, лишний код для его распаковки - всё это не понравилось Mario Klingemann. Он избавился от загрузки внешнего .xml-файла переписав его содержимое в отдельный класс сократив его размер до 50 Кб. Также он провел некоторые оптимизации внутренних алгоритмов библиотеки.

Еще глубже в алгоритмы этого механизма окунулся Eugene Zatepyakin. Он добавил распознавание глаз, носа и губ. Подробнее смотрите здесь.

Как всем эти пользоваться?

Больше всего мне понравился вариант от Mario Klingemann. Для примера я буду использовать исходники библиотеки после его оптимизации.

Импортируем пакет классов jp.maaash. Создаем экземпляр класса ObjectDetector и подписываемся на событие ObjectDetectorEvent.DETECTION_COMPLETE.

import jp.maaash.*;
...
var detector:ObjectDetector = new ObjectDetector();
detector.addEventListener(ObjectDetectorEvent.DETECTION_COMPLETE, onDetectorComplete);

Теперь мы можем попросить наш детектор распознать лица на заданном изображении. Вызываем у него метод detect c единственным параметром - ссылкой на данные изображения типа flash.bitmap.BitmapData.

detector.detect(bitmapData) // bitmapData - данные изображения, на котором следует которое следует распознать лица

После того, как распознавание закончится, детектор отправит соответствующее событие ObjectDetectorEvent.DETECTION_COMPLETE, в теле которого будет список распознанных областей.

private function onDetectorComplete (e:ObjectDetectorEvent):void
{
  var arr:Array = e.rects; // Список распознаных областей
  ...
}



Смотрите также:       

среда, 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
      
Смотрите также:

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

Обо мне



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

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

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

Рассылка

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