WindowsプログラマのWebアプリへの挑戦日記。あとパンとか。

Archive for the ‘Flash’ Category

AIR Business Community ワークショップに参加してきました

日曜日, 10月 5th, 2008 Posted in AIR, Flash | 4 Comments »

福岡のAIR CommunityのAIR Business Communityのワークショップに参加してきました。

AIR Business Communityは発足したばかりで、ワークショップも今回が一回目ということでした。

ステキな参加者のみなさん

はじめに１時間くらいの時間をとって、自己紹介と名刺交換を行いました。プログラマ、デザイナ、学生などいろんな人種の方々が参加していて、普段接することのないような方々とのコミュニケーションがとれました。

自己紹介の後に、参加者の方が作成したAIRアプリの紹介がありました。

  • soraさん

    Windows/Mac/Linuxそれぞれの言語によるHello, Worldアプリがどんだけめんどくさいかってことを説明したあと、AIRだと簡単にWindows/Mac/Linuxで動くHello, Worldが作れますよっていうプレゼン。AIRというより、今回のためにWindows/Mac/LinuxそれぞれでHello, World作るのがすごい。

  • Shikajiroさん

    Mashup Awardsに応募したというEdBrowserのデモ。なんというかさすがAIRという感じ。ActionScriptの3Dライブラリを使うと簡単に（？）3D表現が実現できるようです。3Dやってみたいね。

  • 最後にKagasawaさん

    RSSリーダーのデモと、実装方法なんかの解説。AIRからデータベースを使っていたり、かなり本格的なアプリに仕上がってました。AIRではポップアップしたモーダルダイアログがアプリの境界内でしか表示できない現象を回避する方法が聞けなかったのが残念。

開発環境の構築について

今回のワークショップの内容はAIRを開発するための開発環境の構築がメインでした。ボクはAIRの開発はFlashDevelopというフリーのツールを使っていますが、ワークショップではeclipse + AIR GEARで進めていました。

普段FlashDevelopを使っているボクがeclipse + AIR GEARをさわってみて感じたことをちょっと書きます。

  • GUIエディターはスゴイ！と思ったけど・・・

    最初はやっぱりGUIでコントロールとか配置できるのは便利だなぁとか思ったけど、FlashDevelopはMXMLもコード補完してくれるからなくても別に困らないと思います。

  • コード補完してくれない！？

    どうやら今のバージョンではAS3やMXMLのコード補完やってくれないみたいです。これは結構痛いかも。

  • FlashDevelopに比べるとインストールが楽

    eclipse + AIR GEARをインストールするには、eclipse / pleiades / GEF / AIR SDK / Flex3 SDK / AIR GEARをインストールする必要があって、ぱっと見はめんどくさそうなんだけど、eclipseは解凍するだけだし、pleiades / GEF / AIR GEARは解凍したファイルをeclipseのフォルダにコピーするだけ。なので意外にさくさく進みます。FlashDevelopは、Java runtime / .NET Framework runtime / FlashDevelop / Flex3 SDKを入れる必要があります。数は少ないですが、一つ一つが入れるのめんどくさいです。

感想

このようなコミュニティに参加したのは初めてで、最初は不安でしたがみなさん良い人ばっかりで、すぐになじめたと思います。たぶん。２０数名の参加だったと思いますが、ほとんどの方々と名刺交換をさせていただいて、少しの時間ですがお話しできて刺激になりました。

人が作っているものをみるとやる気になりますね。ワタクシもAIRでなんか作ろうかな。

WindowsアプリケーションのUIとしてFLASHを使う方法

木曜日, 8月 21st, 2008 Posted in C++, Flash | 3 Comments »

最近はAIRなんかが出てきて、デスクトップアプリのUIをFLASHで表現することが簡単になりました。

が、AIRではセキュリティに考慮してか、いろいろと制限があります。例えばレジストリがいじれないとか、デバイスが使えないとか。

まあそれはいいとして、WindowsのアプリケーションのUIとしてFLASHを使えれば、裏ではごりごりめんどくさいことやりつつも、UIはFLASHでステキな感じにできたりしますよね。

そんなわけで、WindowsアプリケーションのUIとしてFLASHを使う方法を解説します。

環境

開発環境は、VC6を想定しています。ボクの環境がVC6なので・・・。

Flash Playerは6以上で動くことを確認しています。今のバージョンが9とか10なので、まあ問題ないと思います。ActionScriptは2で確認しています。3もたぶん大丈夫だと思います。

WindowsアプリケーションとFlashの連携イメージ

わかりにくい絵で申し訳ないですが、以下がWindowsアプリケーションとFlashの連携イメージです。

win_flash.png

CWnd派生のCShockwaveFlashというクラスにFlashを貼り付けます。このCShockwaveFlashは、後で説明するFlashのOCXを挿入すると勝手に作られるクラスです。このクラスがFlash(SWF)と通信します。

FlashからWindowsへの通信は、ActionScriptで

code
< view plain text >
  1. fscommand( param1, param2 );

をコールします。するとWindowsアプリケーション側の指定したコールバック関数に飛んできます。このコールバック関数には、command=param1、args=param2という引数がくるので、commandごとに処理を分けることができます。

WindowsからFlashへの通信は、CShockwaveFlashの関数をコールすることによりFlashを制御できます。しかし細かい制御は難しいと思います。FlashとWidnowsアプリケーションで担当する役割をうまいことわけて実装する必要があります。

Windowsアプリケーション側からFlashの文字列を変更するために、

code
< view plain text >
  1. SetVariable("v_text1", "テスト");

が使えます。v_text1というのはActionScriptの変数です。文字列以外のクラスやArray、MovieClipなどを直接制御したり、値を設定したりなどはできないようなので、SetVariableをうまく使って制御することになります。

VC6のプロジェクトにFlashを埋め込む方法

  1. テキトウにVCのプロジェクトを作ります。
  2. メニュー-[ﾌﾟﾛｼﾞｪｸﾄ]-[ﾌﾟﾛｼﾞｪｸﾄへ追加]-[ｺﾝﾎﾟｰﾈﾝﾄおよびｺﾝﾄﾛｰﾙ]より、[ｺﾝﾎﾟｰﾈﾝﾄおよびｺﾝﾄﾛｰﾙ ｷｬﾗﾘ]ダイアログが開くので、[Registered ActiveX Controls]を開きます。
  3. [Shockwave Flash Object]を選択して[挿入]ボタンをクリックします。
  4. [このｺﾝﾎﾟｰﾈﾝﾄを挿入しますか?]で[OK]をクリックします。
  5. [ｸﾗｽの確認]ダイアログで、ファイル名など問題なければ[OK]ボタンをクリックします。
  6. [ｺﾝﾎﾟｰﾈﾝﾄおよびｺﾝﾄﾛｰﾙ ｷｬﾗﾘ]ダイアログを閉じます。

この段階で、CShockwaveFlashクラスがプロジェクトに追加されています。

Flashを貼り付けるCWnd派生のクラスを作成します。ここでは仮にCFlashWndとしておきます。CFlashWndに次のような関数を作ります。

code
< view plain text >
  1. BOOL CFlashWnd::AddFlashWindow(CString strSwfPath)
  2. {
  3.     //初期化
  4.     ::OleInitialize(NULL);
  5.  
  6.     //---- Flash Ctrlを作成します
  7.     DWORD   dwStyle = WS_CHILD|WS_VISIBLE;
  8.     UINT    nID     = IDC_SAMPLEWND;
  9.     CRect rc;
  10.     rc.SetRect(/*Flashの表示位置・サイズを指定する*/);
  11.     if( m_flashWnd.Create( NULL, NULL, dwStyle, rc, this, nID ) == FALSE ){
  12.         return FALSE;
  13.     }
  14.  
  15.     //FlashCtrlウインドウにSWFを読み込む
  16.     if( !strSwfPath.IsEmpty() ){
  17.         m_flashWnd.SetMovie( strSwfPath );
  18.         m_flashWnd.Play();
  19.         m_flashWnd.SetMenu( false );        //右クリックメニューを抑制
  20.     }
  21.  
  22.     //FlashCtrlウインドウをwindowにFitさせる
  23.     if( IsWindow( m_flashWnd.GetSafeHwnd() ) ){
  24.         CRect   rcClient;
  25.         GetClientRect( rcClient );
  26.         m_flashWnd.MoveWindow( rcClient );
  27.     }
  28.  
  29.     return TRUE;
  30. }

CFlashWnd.hには次のメンバを定義します。

code
< view plain text >
  1. private:
  2.     CShockwaveFlash     m_flashWnd;

これで、CFlashWndを

code
< view plain text >
  1. ShowWindow( SW_SHOW );

してやればFlashが表示されるはずです。

WindowsアプリケーションとFlashの通信

Flashに文字列を渡すときは、次のように書きます。

code
< view plain text >
  1. m_flashNews.SetVariable( "key", "value" );

Flash側で”key”という変数を用意しておくと、keyの値が”value”となります。Flash側のEnterFrameで”key”を監視しておくと、値がセットされたことがすぐにわかります。

Flashからのイベントを受け取るには、コールバック関数を指定します。

code
< view plain text >
  1. BEGIN_EVENTSINK_MAP(CFlashNewsWnd, CWnd)
  2.     //{{AFX_EVENTSINK_MAP(CFlashNewsWnd)
  3.     ON_EVENT(CFlashNewsWnd, IDC_NEWSWND, 150, OnFSCommandShockwaveflash, VTS_BSTR VTS_BSTR)
  4.     //}}AFX_EVENTSINK_MAP
  5. END_EVENTSINK_MAP()

ここでは、OnFSCommandShockwaveflashという関数にコールバックが飛んでくるようにしています。

code
< view plain text >
  1. void CFlashNewsWnd::OnFSCommandShockwaveflash(LPCTSTR command, LPCTSTR args)
  2. {
  3.     CString com = command;
  4.     CString arg = args;
  5.  
  6.     switch( com ){
  7.     case "key1":
  8.         // key1の時の処理
  9.         break;
  10.    
  11.     case "key2":
  12.         // key1の時の処理
  13.         break;
  14.  
  15.     default:
  16.         break;
  17.     }
  18. }

たぶんこれで動くと思いますが、もし動かなければコメントなどください。