第14回Flex2勉強会

Apollo

Apolloプログラミング

今日のお題
  • 3月19日　
    • ApolloのAlpha版がLabsで出ました。
  • 2007年秋ごろ
    • Apollo正式版が出るようです。
  • ちなみに、
    • Apolloとはコードネームでリリース時には名前が変わる可能性があります。
アジェンダ
  • Apolloって何？
  • Apolloで何ができるのか？
  • ダウンロードして使ってみる。
  • プログラミングしてみる。
  • せっかくの勉強会だし、濃い目のネタも紹介。
Apolloって何？
Apolloランタイム環境
HTMLエンジン
JavaScript
WEBブラウザの制限を越える
  • ローカルファイルアクセル
    • OSの違いはAPIが吸収
  • ウィンドウ操作
  • タスクトレイ常駐（おそらく）
  • ウィンドウ枠自由
Apolloインストール
Apolloアプリの作り方
  • 普通のHTMLをアプリとしてラップ
  • 普通のFlex/Flashアプリをラップ
HTMLをApollo化する
  • ３分クッキング
    • Hello.htmlを作成
<html>
HELLO!!
</html>
  • Apollo用設定ファイルの作成
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<application xmlns="http://ns.adobe.com/apollo/application/1.0.M3" appId="hello1" version=".4">
      <properties>
            <name>hello</name>
            <description/>
            <publisher>FlexCoder</publisher>
            <copyright/>
      </properties>
      <rootContent systemChrome="standard" transparent="false" visible="true">Hello.html</rootContent>
      <icon/>
</application>
  • さぁApolloアプリ実行しよう！
adl.exe Hello-app.xml
  • アプリケーションを配布しよう
adt.exe Hello.air Hello-app.xml Hello.html
  • 配布用AIRファイル完成
  • インストーラの起動
  • 上書きインストールもできる
  • アンインストールオプションも出る
  • かんたんに手が出せます！
FlexをApollo化する
  • プロジェクトの新規作成
  • アプリの設定を記述
    • 後でも設定可能
  • ルートはApolloApplicationタグ
<?xml version="1.0" encoding="utf-8"?>
<mx:ApolloApplication xmlns:mx="http://www.adobe.com/2006/mxml“ layout="absolute">
	＜ここにプログラムを記述＞
</mx:ApolloApplication>
  • 実行
    • いきなり完成
  • ちょっと見た目を変える
    • 設定ファイル
      • HelloApollo1-app.xml
    • ステータスの表示
      • Application.status
<?xml version="1.0" encoding="utf-8"?>
<mx:ApolloApplication xmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute" status="現在のステータス“title="Apolloアプリ">
    <mx:Style>
        Application
        {
            background-image:"";
            background-color:"";
            background-alpha:"0.2";
        }
    </mx:Style>
<mx:Label text="Hello Apollo World." fontSize="20" />
</mx:ApolloApplication>
  • 配布形式にする
    • エクスポートでAIR指定
    • ソースも付けられる
Apolloコンポーネントを使う
  • ローカルファイル
  • HTML
  • ウィンドウ
  • ローカルファイル
    • FileSystemComboBox
      • ローカルファイル
    • FileSystemDataGrid
      • ファイル情報をDataGridで表示する
        • ファイル名、作成日、更新日、タイプ、サイズ
    • FileSystemHistoryButton
    • FileSystemList
    • FileSystemTree
  • HTML
    • HTML表示
    • Spriteのサブクラス
      • フィルタ
      • 透明化
      • 変形
  • ウィンドウ
    • ウィンドウ操作
      • 最大化、最小化、リストア、クローズ
    • ウィンドウの新規作成
    • イベント
      • ACTIVATE / DEACTIVATE
      • CLOSING / CLOSE
      • FOCUS_IN / FOCUS_OUT
      • MOVING / MOVE
      • RESIZING / RESIZE
Apollo File API
  • 機能概要
    • ファイルパスの取得
      • OSに依存しないパスの指定
      • よく知られたパスはショートカット
        • デスクトップ
        • ドキュメントフォルダ
        • テンポラリーファイルとフォルダ
    • ディレクトリー一覧
    • 移動、コピー、削除
    • ファイルの読み書き
      • バイナリ、テキスト
    • 同期、非同期
  • 基本クラス
    • flash.filesystem パッケージ
      • File
      • FileMode
        • ファイルを開く際の読み書きモードの指定
      • FileStream
        • ファイルストリーム
  • パス指定
    • Fileクラスはパスを表します
    • プロパティ
      • nativePath：OS独自のパス
      • url：URL
      • parent：上位パス
    • 操作
      • resolve(‘a/b.txt’) 　　：現在パスから指定
      • resolve(‘..’)　　：上のフォルダを指定
      • relativize(otherFile)　　：現在のパスに追加
      • canonicalize　　：正規化、標準化（Document and Setting　など）
  • カタログ情報
    • ユーザーフォルダ
      • File.userDirectory
      • File.desktopDirectory
      • File.documentsDirectory
    • アプリケーションフォルダ:
      • File.appResourceDirectory
      • File.appStorageDirectory
      • File.createTempDirectory()
    • ファイル情報
      • size
      • creationDate, modificationDate
    • ディレクトリーリスト
      • listDirectory()
  • ファイル操作
    • コピーと移動
      • file.copyTo(destFile)
      • file.moveTo(destFile)
    • 削除
      • file.deleteFile()
      • file.deleteDirectory()
      • file.moveToTrash()
    • アップロードとダウンロード
      • extends flash.net.FileReference
    • ブラウザー
      • open, save, directory
  • ファイルIOFileStreamクラス
    • IDataInput/IDataOutputインタフェースを実装(ByteArrayやSocketと同じように)
    • バイナリデータ
      • read/writeBytes
      • read/writeInt, read/writeDouble, など
    • AMF データ (直列化されたオブジェクト)
      • read/writeObject
    • テキストデータ
      • read/writeMultibyte
      • read/writeUTFBytes
  • 同期/非同期モデル
    • ゴール
      • 同期プログラミングモデルをシンプルで信頼できるようにする
      • Flashイベントモデルの活用
      • 対話的かつ魅力的なユーザー体験を維持する
      • 同期と非同期の違いを最小にするAPI群
    • 同期モデル
      • 例） file.delete(), fileStream.open(…)
      • 戻り値を待ってファイル読込みを完了する。
      • 例外としてエラーをスローする。
    • 非同期モデル
      • 例） file.deleteAsync(), fileSteam.openAsync(…)
      • 完了イベントでファイル読込みを完了する。
      • イベントとして結果とエラーを渡す。
  • 非同期File I/O
    • 同期ファイルI/OはByteArrayのように振舞う
      • “bytesAvailable”プロパティはファイルの最後まで読めることを表している。
    • 非同期ファイルI/OはSocketやURLStreamのように振舞う。
      • “bytesAvailable”はデータがバッファリングされて読み込み可能なことを表している。
      • “progress”イベントは新しいデータが読めることを表している。
      • “complete”イベントが起こればカンタンにファイルを読める。
    • 他の方法
      • readInt(), readDouble(), など、読み込み可能なファイルから読む。
JavaScript連携
<html>
     <body id="link">
       <p id="msg">Test</p>
     </body>
 </html>
  • DOM操作
html.window.document.getElementById(“msg”).innerHTML = "メッセージ";
var link:Object = html.window.document.getElementById("link");
link.onclick = clickHandler;
html.window.alert("Hello from ActionScript");
    • JavaScriptのカスタムメソッド/プロパティ呼び出し
<script>
greeting = "hello";
function reverseStr(str) {
returnStr = "";
for (i = 0; i < str.length; i++) {
returnStr = str.charAt(i) + returnStr;
}
return returnStr;
}
</script>
<html>
<script>
runtime.trace("Hello from JavaScript.");
</script>
</html>
その他の機能
  • ネットワークの検出
    • ネットワークの状態変化を検出できる
Shell.shell.addEventListener(Event.NETWORK_CHANGE,onNetworkChange); 
function onNetworkChange(event:Event)
{ 
  //検出時の処理
}
HelloApollo9.exe aaa bbb ccc
  • アプリケーションの更新
    • 現在インストールされているアプリを、プログラム経由で更新することができる。
    • ローカルにインストールされているバージョンと、サーバーにある最新バージョンを比較すれば、最新版を自動的にインストールできる。


こんなかんじです。


資料はコチラからダウンロードできます。
http://fxug.net/archives/study_mtg_14/apollo_programming.pdf