Titanium Mobileのツールバー拡張モジュール
今週はGLシリーズから離れて、小ネタです。
Titanium MobileでiOSツールバーのボタン背景色をどうやら変更できないということが判明。
仕方がないので、モジュールを作成することに。
モジュールプロジェクトを作成後、View・ViewProxyを追加。
ComCflatToolbarView.h
#import "TiUIView.h" #import "TiUIiOSToolbar.h" @interface ComCflatToolbarView : TiUIiOSToolbar { } @end
ComCflatToolbarView.m
#import "ComCflatToolbarView.h" @implementation ComCflatToolbarView - (void)layoutSubviews { [super layoutSubviews]; NSMutableArray* tintColors = [self.proxy valueForKey:@"itemsBackgroundColor"]; for ( size_t i = 0 ; i < [toolBar items].count ; ++i ) { if ( i > tintColors.count ) continue; UIBarButtonItem* item = [[toolBar items] objectAtIndex:i]; NSString* color = [tintColors objectAtIndex:i]; if ( color == nil || [color isEqual:[NSNull null]] ) continue; item.tintColor = [[TiUtils colorValue:color] _color]; } } @end
ComCflatToolbarViewProxy.h
#import "TiViewProxy.h" #import "TiUIiOSToolBarProxy.h" @interface ComCflatToolbarViewProxy : TiUIiOSToolbarProxy { } @end
ComCflatToolbarViewProxy.m
#import "ComCflatToolbarViewProxy.h" #import "TiUtils.h" @implementation ComCflatToolbarViewProxy @end
app.js
var win = Ti.UI.createWindow({ backgroundColor:'white' }); var bt1 = Ti.UI.createButton({ title:'button1', style: Titanium.UI.iPhone.SystemButtonStyle.BORDERED, }); var bt2 = Ti.UI.createButton({ title:'button2', style: Titanium.UI.iPhone.SystemButtonStyle.BORDERED, }); var bt3 = Ti.UI.createButton({ title:'button3', style: Titanium.UI.iPhone.SystemButtonStyle.BORDERED, }); var flexSpace = Ti.UI.createButton({ systemButton:Ti.UI.iPhone.SystemButton.FLEXIBLE_SPACE }); var toolbar = require('com.cflat.toolbar'); Ti.API.info("module is => " + toolbar); var toolbar = toolbar.createView({ items:[bt1, flexSpace, bt2, flexSpace, bt3], itemsBackgroundColor:['#00ff00',null,null,null,'red'], //! setting button's background color bottom:0, borderTop:true, borderBottom:false, translucent:true, }); win.add(toolbar); win.open();
フレームワーク側で対応してほしいところです。
以上。