Androidで複数動画ライブチャット
Flash の Adobe LiveCycle Collaboration Service を使うことによりAndroid端末で複数人での動画ライブチャットをすることができます。
下記画像はPCとGalaxy SとGalaxy Tabの3台で実験しているものです。
動画にメンバーが加わると自動で画像サイズが小さくなりうまくレイアウトさせてくれます。
作成にあたって気になった点は、配布されている Adobe LiveCycle Collaboration ServiceのSDK がFlex3時代のものなので、Flex4で開発をしないといけない Android ではそのまま動かすことはできません。実行時にCanvasがないだのいろいろと言われます。
ですので、Flex3のCanvasなどを使わないFlashOnlyのSDKが別途ありますので、そちらを使って自前で作成します。
年越しを自宅にいながらみんなでわいわいチャットするのもいいかも?
スマートフォンがあれば遊べるので出先の飲み会や複数人による打ち合わせにも使えます。
ソースコードはこちら
view.mxml
<?xml version="1.0" encoding="utf-8"?> <s:View xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:collaboration="com.adobe.rtc.collaboration.*" xmlns:mx="library://ns.adobe.com/flex/mx" actionBarVisible="false" creationComplete="init()" tabBarVisible="false" title="ホーム"> <fx:Script> <![CDATA[ import com.adobe.rtc.authentication.AdobeHSAuthenticator; import com.adobe.rtc.collaboration.AudioPublisher; import com.adobe.rtc.collaboration.AudioSubscriber; import com.adobe.rtc.collaboration.WebcamPublisher; import com.adobe.rtc.collaboration.WebcamSubscriber; import com.adobe.rtc.events.AuthenticationEvent; import com.adobe.rtc.events.SessionEvent; import com.adobe.rtc.events.SharedPropertyEvent; import com.adobe.rtc.events.UserEvent; import com.adobe.rtc.session.ConnectSession; import com.adobe.rtc.sharedModel.SharedProperty; import mx.events.FlexEvent; private var cSession:com.adobe.rtc.session.ConnectSession; private var auth:com.adobe.rtc.authentication.AdobeHSAuthenticator; private var cam:Camera; protected function init():void { auth = new AdobeHSAuthenticator(); auth.userName = "your name"; cSession = new ConnectSession(); cSession.authenticator = auth; cSession.roomURL = "http://connectnow.acrobat.com/youraccount/yourroom"; cSession.addEventListener(SessionEvent.SYNCHRONIZATION_CHANGE , onLogin ); try{ cSession.login(); }catch(e:Error){ trace(e); } } private var webCamPub:WebcamPublisher; private function onLogin(e:Event):void{ trace( "onLogin"); webCamPub = new WebcamPublisher(); webCamPub.connectSession = cSession; webCamPub.subscribe(); webCamPub.publish(); var webCamSub:WebcamSubscriber = new WebcamSubscriber(); webCamSub.connectSession = cSession; webCamSub.webcamPublisher = webCamPub; webCamSub.subscribe(); var audioPub:AudioPublisher = new AudioPublisher(); audioPub.connectSession = cSession; var audioSub:AudioSubscriber = new AudioSubscriber(); audioSub.connectSession = cSession; audioPub.subscribe(); audioPub.publish(); audioSub.subscribe(); webCamSub.width = 800; webCamSub.height = 480; myUI.addChild( webCamSub ); } ]]> </fx:Script> <fx:Declarations></fx:Declarations> <mx:UIComponent id="myUI" width="100%" height="100%"/> </s:View>
参考リンク
- Adobe LiveCycle Collaboration Service | Adobe Developer Connection
- 公式サイト
- LCCS Developer Portal
- アカウントを作成して、ログインするとSDKやドキュメントなどもろもろが手に入ります。
- Flash examples for WebcamPublisher
- WebcamPublisherをActionScriptで書く場合
- 10.1 Building your first application - LiveCycle Collaboration Service - Adobe Learning Resources
- ドキュメント。Flex3向けなので注意です。
その他
作成の経緯でも。
遠くに離れた人と双方向の動画ライブチャットをしてみたい
↓
とりあえず、動画の配信ができる Flash Media Server にしよう。
↓
FMSに対応しているHetemlを借りてみた。無料期間中でもFMSの申請を出せば試用できます。ただし64kbpsと5コネクションまで!!
↓
簡単なプログラムを作ってAndroidでブラウザからいざアクセスしたところ、カメラ機能が使えない・・・(盲点だった)
↓
しかたないのでカメラ機能が使えてActionScriptで開発できるAIR for Android アプリで作る
↓
HetemlのFMSは外部からのアクセスが不可。アプリに向いてないのかも?
↓
あきらめてCocomo(Adobe LiveCycle Collaboration Service)を選択。
↓
AndroidはFlex4での作成。CocomoはFlex3。
↓
FlashOnlySDKを使ってせこせこ作成
↓
無事完成+3G回線でも見れました。
っとまぁ、なんとか1日でできましたとさ。