Studioが発表されました(プレビュー版ですが⁠)⁠。今までのTitaniumはエディタを除いたコンパイラ環境でしたが、Aptanaと統合されることによってJSの補完機能のついた統合開発環境として利用することが可能です。デバッグ機能も充実しておりブレークポイントを設定してウォッチしながらのデバッグも可能となっています。こちらで公開されていますので、興味のある方は導入してみてはいかがでしょう?今回のターゲット今回のターゲットデバイスですが、iPhoneに絞って行いたいと思います(iOSのバージョンは4.3とします⁠)⁠。アプリの構成PC版と同様に、動画選択画面と動画再生画面の2画面構成で考えています。動画選択画面は、iPhoneのおなじみのスタイルであるテーブルビューを用いてリスト表示を行います。あたりのコメント数を表示させます。テーブルビューのリストをタップすると、その動画の再生画面へと遷移します。動画選択画面と動画再生画面のイメージ図まずは上のような単純な構成で作成してみたいと思います。Titaniumでの基本的な作り方Titaniumで新規プロジェクトの作成を行います。プロジェクト名はjikyouとしました。Titaniumは初期ファイルの生成が終わりましたら、さっそくソースの編集を行いましょう。プロジェクトのディレクトリに移動すると、Resourcesbuildというディレクトリとmanifesttiapp.xmlというファイルがあります。ResourcesがTitaniumで作成するアプリケーションのルートディレクトリとなり、アプリケーションの起点となるのが、app.jsというJavaScriptのファイルとなります。buildディレクトリはiphoneやandroidのコンパイルを行ったときにネイティブコードが生成されます。ソースの編集&コンパイルを繰り返していると、よくわからないところでエラーになったりします。そんなときはbuild/*をすべて削除してしまうという乱暴な解決方法があるようです。基本的にソースとして触るのはResources/以下のファイル群になります。それではapp.jsを見てみます。デフォルトで生成されるapp.jsは2つのタブを持つウィンドウが立ち上がります。ここではわかりやすいように1つのタブにだけ着目します。//タブグループをオープンするタブグループ<タブ<ウィンドウ(<ラベルなど)という関係を構築し、最終的にタブグループをオープンすることでUIの構築ができています。非常に簡潔で、直感的にもわかりやすいと思います。それではこれを改造してwin1にテーブルビューを表示させてみましょう。動画選択画面の作成ウィンドウの内容を変更させたい場合は、createWindow()にurlパラメータを与えます。“movie_list.js”});こうすることで、このウィンドウが開いたタイミングでurlのjsファイルが実行されます。app.jsにUIの記述を行ったように、movie_list.jsにテーブルビューのUIを構築させればよいというわけです。取得したデータをテーブルビューに展開する↓テーブルビューを表示するまずはここまでを実装してみます。自分自身のウィンドウを取得する。HTTPClientのステータスが変わったら。//テーブルの行データを作成する。//上で生成したオブジェクトを行に貼り付ける。//テーブルの行データの集合として与える。//自分自身にテーブルビューを貼り付ける。}}HTTPClientなど出てきていますが、XMLHttpRequestとほぼ同じような関数です。jsを使用したことがある人であればすんなり理解できるモノと思います。これだけで、外部APIを使用してネイティブアプリとして動作するわけです。APIから取得した行数が多いと(1画面に収まらないと⁠)⁠、スクロールでその行がアクティブになった時点でアイコン画像を取得しにいきます。ネイティブアプリらしい動作と、なによりスクロールが気持ちいいですね。このテーブルビューでは1回しかAPIを叩かないため、リストの更新ができません。すべてのリストを返すというのも動画が増えてきた場合に現実的ではありませんね。次回はこの辺を踏まえて、動画選択画面の使い勝手を改善していきます。最後にlist.cgiが返すJSONを載せておきます。Ltd.ページ内容の全部あるいは一部を無断で利用することを禁止します⁠。個別にライセンスが設定されている記事等はそのライセンスに従います。