Titanium:メニュー系の項目作成

Titaniumではメニューの作成はAPIが用意されており、作成自体は非常に簡単に行えます。

ネイティブメニューの作成

アプリケーションのメニューに関してはまずcreateMenu()で大元のメニューコンポーネントを用意します。そこに子をぶら下げて行くイメージになります。

//メニューの作成
var menu1 = Titanium.UI.createMenu();

//メニューの親項目の作成
var item1 = Titanium.UI.createMenuItem("ファイル");
var item2 = Titanium.UI.createMenuItem("編集");

//メニューの子項目の作成
item1.addItem("終了", function(){
 alert("selected: exit");
     });

item2.addItem("設定", function(){
 alert("selected: config");
     });

//項目の登録
menu1.appendItem(item1);
menu1.appendItem(item2);

//メニューの登録
Titanium.UI.setMenu(menu1);

コンテキストメニュー

いわゆる右クリックで表示するコンテキストメニューも同じような要領で実装できます。

//コンテキストメニューの作成

//メニューの作成
var contextmenu1 = Titanium.UI.createMenu();

//項目の作成
var contitem1 = Titanium.UI.createMenuItem("コンテキスト1", function(){
      alert("context1 clicked");
  });
var contitem2 = Titanium.UI.createMenuItem("コンテキスト2", function(){
      alert("context2 clicked");
  });

//項目の登録
contextmenu1.appendItem(contitem1);
contextmenu1.appendItem(contitem2);

Titanium.UI.setContextMenu(contextmenu1);


実際にアプリケーションに実装する場合ではネイティブメニューは使いどころが難しい気がします。理由としては、MacOSXはデスクトップ上部にメニューが独立しているのに対して、Windows及びLinux系ではアプリケーションウィンドウ内にメニューがあるため、全体のレイアウトの差異をどこかで吸収しなくてはなりません。この差を細かく調整するぐらいならメニューなんてなくてもいいじゃない!という選択肢もありえる、ということですね。