The prerelease program “AIR for Android” is still open and very active. Click here if you want to sign-up to participate and test AIR applications on your mobile phone: http://www.adobe.com/go/airbetasignup The new APIs in the lastest build give you a direct access to the camera of your smartphone, which was one of the biggest requests of the community. There are now two ways to play with the camera: using the Camera UI of the phone (while letting the phone capture a picture or a video), or using the classic Flash Camera class. I’ve developed two basic samples that explain how to use these new APIs on Android. I apologize for the quality of this video, I’m using my webcam and it’s always a mess to deal with the automatic brightness feature of my OS.
Android, Adobe AIR and the camera from michael chaize on Vimeo.
The CameraUI
This feature allows you to access Android’s camera application thanks to the new class flash.media.CameraUI. Once you take a picture or a video, the media is automatically saved to camera roll and fires a MediaEvent to your AIR application. You must check that this class is supported on your device. To do so, you can check the CameraUI.isSupported boolean property. Then you just need to create a new CameraUI object, and use the CameraUI.launch method to display the Android interface, and take a picture. You also need to add an event listener on a MediaEvent.COMPLETE event, and get the media transmitted by Android. In this sample, I take a picture using the Android native UI, display the result in the AIR application, and apply a filter to get a black and white picture.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
creationComplete="windowedapplication1_creationCompleteHandler(event)"
xmlns:mx="library://ns.adobe.com/flex/mx" width="480" height="800">
<fx:Script>
<![CDATA[
import flash.filters.ColorMatrixFilter;
import mx.events.FlexEvent;
private var myCam:CameraUI;
protected function button1_clickHandler(event:MouseEvent):void
{
theImage.filters = [];
if (CameraUI.isSupported){
myCam.launch(MediaType.IMAGE);
}
}
protected function windowedapplication1_creationCompleteHandler(event:FlexEvent):void
{
if (CameraUI.isSupported){
myCam = new CameraUI();
myCam.addEventListener(MediaEvent.COMPLETE, onComplete);
}
}
private function onComplete(evt:MediaEvent):void{
theImage.source = evt.data.file.url;
}
private function transformImage():void
{
var matrixArray:Array =[ .33,.33,.33,0,0,
.33,.33,.33,0,0,
.33,.33,.33,0,0,
0,0,0,1,0];
var blackWhiteFilter:ColorMatrixFilter = new ColorMatrixFilter(matrixArray);
theImage.filters = [blackWhiteFilter];
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<s:Button x="10" click="button1_clickHandler(event)" y="17" label="TAKE A PICTURE" width="220" height="93"/>
<s:Button x="250" click="transformImage()" y="17" label="APPLY FILTER" width="220" height="93"/>
<mx:Image id="theImage" height="649" y="124" width="460" x="10"/>
</s:Application>The classic Camera class
It’s also possible to use the classic Camera class, the one we use in Flash to access the webcam of our desktop computers. This application displays the camera after a click on the START button. Nothing fancy…
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="800" height="480">
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
private var cam:Camera;
protected function button1_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
cam = Camera.getCamera();
if(cam){
cam.setMode(546,417,25);
cam.setQuality(0,0);
myLog.text = "ok";
vd.attachCamera(cam);
}else{
myLog.text = "No camera here ";
}
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<mx:VideoDisplay id="vd" x="244" y="15" width="546" height="417" />
<s:Button x="11" y="15" label="START" width="225" click="button1_clickHandler(event)" height="171" fontSize="20"/>
<s:TextInput id="myLog" x="10" y="194" width="226" height="71" text="my log" fontSize="17"/>
</s:Application>Be careful, by default, if you deploy this AIR application on your Android phone, it won’t work. You need to update the XML manifest that describes your application adding these tags:
- First, in the <initialWindow> tag, I specify that I want to launch my app using a landscape mode (by default, the camera will use this mode): <aspectRatio>landscape</aspectRatio>
- Then, I must use the new <android> tag to give specific rights to my application, and authorize the access to the camera. The Android security model requires that each app request permission in order to use features that have security or privacy implications. These permissions must be requested when the app is packaged, and cannot be changed at runtime. In this particular case, I need to add these lines:
<android>
<manifestAdditions>
<manifest>
<data>
<![CDATA[
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera.autofocus"/>
]]>
</data>
</manifest>
</manifestAdditions>
</android>To install the Camera application: http://www.riagora.com/pvt_content/android/android%20Cam.apk
Anne K. Petterøe
Christophe Coenraets
Greg Wilson
James Ward
Ok, seems cool but… does it work on emulator? I tried to make your code run on my froyo emulator using AVD (Android 2.2 API level
and all I have is two buttons “TAKE PICTURE” and “APPLY FILTER” but no picture/video (the emualtor does not use my webcam…). Is it normal?
Can you please test it and tell me if it is me who did things wrong or if it is the an emulator limitation?
thanks for your examples.
what difference of quality between the 2 methods?
I have not a device but i tested the Camera method in desktop and the quality is poor
Is the Camera method use the resolution of the camera of the device?
how the mxml compile to apk? thank you
To discover how it works, go to labs.adobe.com and sign-up for the “AIR for Android” beta program. Then you’ll get an access granted and you’ll be able to download and read the technical documentation.