イマイチよく分かってないんだけど・・・
ActionBarをController上でカスタマイズ(変更)してしまうと、ViewXMLとTSSで定義されたActionBar上のメニューが表示されない・・・っぽい。
<Alloy>
<Window id="window">
<Menu platform="android">
<MenuItem id="menu1" />
<MenuItem id="menu2" />
</Menu>
<Label text="hogehgoe" />
</Window>
</Alloy>
JSON
"#window": {
backgroundColor: '#ccc',
fullscreen: false
},
"MenuItem": {
showAsAction: Ti.Android.SHOW_AS_ACTION_IF_ROOM,
},
'#menu1': {
icon: Ti.Android.R.drawable.ic_menu_send,
title: 'About'
},
'#menu2': {
icon: Ti.Android.R.drawable.ic_menu_send,
title: 'Settings'
},
この状態で、何もしなければちゃんとActionBarとメニューは表示される。
でも以下のControllerのようにイジってしまうと、メニューが表示されなくなる。
$.window.addEventListener('open', function() {
var actionBar = $.window.activity.actionBar;
actionBar.title = 'My App';
actionBar.displayHomeAsUp = true;
actionBar.onHomeIconItemSelected = function() {
Ti.API.info("Home icon clicked!");
};
});
色々試してみての現時点での結論
ViewXMLとTSSでActionBar上のメニューを実装するのを諦めた。Controller上でコードによる実装を行えば、ActionBarの設定変更とメニューの表示が両立できる。
// ViewXMLとTSSからメニューに関する記述を全部消した上で・・・
$.window.activity.onCreateOptionsMenu = function(e) {
var menu = e.menu;
var menuItem1 = menu.add({
title : "Compose",
icon : Ti.Android.R.drawable.ic_menu_send,
showAsAction : Ti.Android.SHOW_AS_ACTION_IF_ROOM
});
menuItem1.addEventListener("click", function(e) {
Ti.API.info("Action Item1 Clicked!");
});
var menuItem2 = menu.add({
title : "Update",
icon : Ti.Android.R.drawable.ic_menu_send,
showAsAction : Ti.Android.SHOW_AS_ACTION_IF_ROOM
});
menuItem2.addEventListener("click", function(e) {
Ti.API.info("Action Item2 Clicked!");
});
$.window.activity.actionBar.displayHomeAsUp = true;
$.window.activity.actionBar.title = 'My App';
};
これならOKだった。よく分からん。