2012年12月4日火曜日

[Titanium奮闘記6日目]ウィンドウを切り替える(画面遷移) #TitaniumJP

○今さら画面遷移について考える

そういえば画面遷移について全く考えてなかったので考えてみます。

現状は、最初app.jsが読み込まれたときに位置情報が取られるボタンが表示されて、それを押すと位置取得&マップと緯度経度が表示される(find.js)。

窓が下からニュッと出てきて(モーダルウィンドウって言うらしいです)find.jsを取ってきてるんですが、僕の小さな脳みそでは階層が増えるだけでとたんにややこしくなりそうだったので、ワンウェイな作りにしてみようと思います。こんな言い方していいのかな…というか伝わってるのかな…。
どうせいつか画面遷移は勉強しないといけないので、たくさんウィンドウを作っていきます(もちろん階層が増えた場合のも勉強しないといけないんですが)



■first.js
次の窓に飛ぶと位置情報が取られるため、そのクッションとしての窓。

■find.js
位置情報を取得、自分の現在地が分かったらボタンを押す。

□table.js
現在地から半径○キロ以内のスポットをテーブル表示。
その内の一つを選択するとスポットデータが表示される。

□spotwin.js
スポットデータが表示される(名前などは伏せられている)。
ヒントはタップすると表示される。

□success.js
スポット近くまで行くとボタンが表示され、ポイントが加算される。

(■:実装済 □:未実装)



これを実装するには、TabGroupを使う方法と、NavigationGroupを使う方法の2パターンのやり方があるそうな。

参考→http://bowz.info/3555

自分もTabGroupを採用しました。こっちを使ってる人が結構多そうだったので。



○ここでもAndroid特有のエラー

で、サンプルコードを参考にして早速起動してみると、iOSではうまくいきましたが、Androidではエラーが出ます。
どうやらhideTabBar()がAndroidでは対応していないみたいですね。なんでやねん。

代わりにcreateWindow()のプロパティでtabBarHiddenというのを使えば良さそうです。

var win1 = Ti.UI.createWindow({
     url: "first.js",
     tabBarHidden: true
});

しかし、これでエラーは出ないんですが、最初の画面で謎の灰色のバーが出てきました。

ただ問題は残っていて、Androidの方でtabBarHiddenが動作せず、タブが1つ表示されてしまって微妙です。なんとかならないのと調べてみると、公式フォーラムに解答がありました。
まず(app-project-dir)/platform/android/res/layout/というディレクトリを作成して、その中にtitanium_tabgroup.xmlというファイル名で下記を追加すればタブバーを消す事ができます。
http://taichino.com/programming/javascript-programming/titanium/3568

なんだかなぁ。
Androidのこと嫌いなんじゃないかって思うくらい面倒なことさせるよね、Titaniumって。

とりあえず言われた通りにxmlファイルを入れるとタブバーが消えてすっきりしました。よかったよかった。

(追記)
ほかにもダミーウィンドウを使う回避の仕方もあるようです。
AndroidでのTabGroupはTabBarが消せないなどの問題もあって使い勝手がよくありません。(中略)かなり汚い実装になりますが,Tiatnium側で改善されるまでは仕方がなさそうです。
http://gihyo.jp/dev/serial/01/titanium/0014



○口ではヤバいと言ってるものの

画面遷移をしっかり決めたせいで、Ti.App.を使った変数を入れた途端エラーが出たりして、バグ取ってたらやる気が底をついちゃいました。

結局なんでうまくいったかは分からずじまいで、今日はそのままふて寝することに。
あぁ…明日はテーブルビューの実装だ…。

0 件のコメント:

コメントを投稿