HTML+JavaScriptなAdobe AIRで練習として時計を作ってみました。
http://www.hazimu.com/okonatch/
↑この辺で公開してます! ソース丸見えだよ!(
練習でサクサクっとできるかと思ったら、よくわからないことが多くて、
Google先生に質問する時間がすごいことに……!
Adobeてんてー、もうちょっとリファレンスどうにかなりませんかね(
というわけで作ってる時に、悩んだこととかをメモしとくのです。
デバッグには「AIRIntrospector.js」を使う
どっかでエラー吐いて止まってるっぽいんだけどどこだかわからねー!
すると、SDKの中にAIRIntrospector.jsという
デバッグツールが使えるファイルがありました……。
これをHTMLから読み込んであげると、デバッグ中にF12を押すだけで
Firebugとかでおなじみのあの画面が! 便利やわー。
ローカルファイル読み込むときはnativePathよりurl
ファイル読込するときのファイルパスにnativePathを使ってたのですが、
全然画像が表示されない、というかパスのバックスラッシュが全部消されたりと
よくわかんないことに。うわーん!
と思ったら、どうもnativePathじゃなくてurlを使わないとだめだそうで。
まぁ確かにHTML中に入れるんだからURLですよね。
var img_dir = air.File.applicationDirectory.resolvePath('img'); var img_dir_files = img_dir.getDirectoryListing(); for(var i = 0; i < img_dir_files.length; i++){ // var path = img_dir_files[i].nativePath; ←これはだめ var path = img_dir_files[i].url; if (path.match(/\.(bmp|png|gif|jpg|jpeg)$/)){ (略) } }
タスクバーに表示させないためにメインをダミーに
ウィジェットなのにタスクバーに表示されたら邪魔ー!
ということで、どうやって消すのかに悩む。
application.xmlのvisibleをfalseにしたらウィンドウも無くなっちゃうし……
調べると、メインの画面はvisibleをfalseにして非表示のまま、
別のウィンドウを開けばいいよ、とのことだったのですが、
JavaScriptでどう書くのかがよくわからーん!
と思ったらAdobeてんてーのリファレンスに書いてありました……(
var options = new air.NativeWindowInitOptions(); options.systemChrome = 'none'; options.type = 'lightweight'; // ←これを付けるとタスクバーに表示されないっぽい? options.transparent = true; var window_bounds = new air.Rectangle(X座標, Y座標, ウィンドウ幅, ウィンドウ高さ); newHTMLLoader = air.HTMLLoader.createRootWindow(true, options, true, window_bounds); newHTMLLoader.load(new air.URLRequest(air.File.applicationDirectory.resolvePath(読み込むファイルのパス).url)); nativeWindow.close();
メインのファイルでこんな感じの処理をさせると、
タスクバーに表示されないウィンドウを作って自分が消えるみたい?です。
公開方法
実は一番悩んだのはここだったり。
ブラウザ上でぽちっとボタン押したらインストールできるあれです!
「AdobeAIRSDK/samples/badge」の中にある「default_badge.html」を
使おうとしたんですが、なんかうまくいかなくて、
結局、ここのやつをダウンロードしてきて、少しいじって使いました。
うーん、あとでちゃんと調べておこう……
作ってみて
それにしてもAdobe AIR便利ですね!
ちょっとJavaScriptいじるだけで作れるなんて、いい時代になったものです?
今後こまかいもの作るときはコレでやろうかなー
ゲーム用のJavaScriptライブラリもあるしネ!