TitaniumのClassicな開発スタイルでActionBarの設定方法に意外とハマった
タイトルそのままです。Android向けにCraftBeerFanを作っているのですが、UIはAndroidらしいものにしようと思って、ひとまずActionBarを採用したものに取り組んでます。
意外と簡単に設定できるかと思ったのですが、従来の開発スタイルのTitanium Classicなサンプルが意外と見つからずに、公式ドキュメントのAndroid Action Barを見ておおよそ理解できてきました
ハマった要因について振り返ると以下3つかなと思います。
- Ti.UI.createActionBarとかするのかと思い込んでいた
- Ti.Ui.WindowのnavBarHiddenプロパティの設定を見落としていた
- ターゲットとするAndroidSDKのバージョン指定をtiapp.xmlにて行う必要があるのを知らなかった
以下でそれぞれ掘り下げいきます
Ti.UI.createActionBarとかするのかと思い込んでいた
iPhone向けに開発してきたクセなのかもしれませんが、こういうUIに関してはTitaniumのAPI的にはTi.UI.createXXXかなという思い込みがありました。
API Doc見て気づいたのですが、Titanium.Android.ActionBarという形になるんですね。
Ti.Ui.WindowのnavBarHiddenプロパティの設定を見落としていた
Appceleratorの公式ドキュメントのサンプルのコードをそのままコピペしてたらおそらくハマらないかと思いますが、一応どんな状況だったのか書いておきます
使い方がよくわかってない時に、ひとまずサンプルコードをベースにして最低限の処理だけ・・と思って以下の様なものを書いてました
win = Ti.UI.createWindow() win.addEventListener "open", -> if Ti.Platform.osname is "android" unless win.activity Ti.API.error "Can't access action bar on a lightweight window." else actionBar = win.activity.actionBar if actionBar actionBar.backgroundImage = "/bg.png" actionBar.title = "New Title" actionBar.onHomeIconItemSelected = -> Ti.API.info "Home icon clicked!" win.open()
ところが、こうやっても当然のことながらActionBarは表示されません。
ActionBarは、「Bar」という言葉が含まれてるように、navBarとして機能してるみたいで、navBarHiddenプロパティの値を適切に設定してあげないとダメみたいなんですね。
なので、
win = Ti.UI.createWindow navBarHidden:false
みたいにしてあげないとダメでした
ターゲットとするAndroidSDKのバージョン指定をtiapp.xmlにて行う必要があるのを知らなかった
公式ドキュメントのAndroid Action Barから一部引用します
To enable the action bar features, applications must be built with a target SDK version of 11 (Android 3.0/Honeycomb) or later. For expanding and collapsing action items, the target SDK version must be at least 14. To set the target SDK version, add code like this in your tiapp.xml file:
ということで、tiapp.xmlを一部編集する必要あるんですね・・
細かいカスタマイズしたくなったら?
基本的な所が出来たのですが、黒の背景は好みでなかったので背景色を変更したくなりました。
ただ、ドキュメント見る限り、それっぽいプロパティが見つからず、たまたまTitanium Mobile(Android)でActionBarをカスタマイズするという記事をQiitaで見つけて、そこで取り上げられていたAndroid Action Bar Style GeneratorというWebアプリを使うと簡単にできることがわかりました
こんな風に出来るのですが、Android Action Bar Style Generatorの使い方もちょっとハマったので、次回でAndroid Action Bar Style Generatorの使い方について書こうかと思います