常常看到各種 iPhone App 擁有非原本 iOS SDK 的官方 UI 外觀。在自己要硬寫的時候發現,自己寫 TabBarController 的成本好像划不來,因此想到一個小撇步,直接用自己設計的 TabBar 蓋掉原本 TabBar
的 View,因此某天便花了半小時想說動手做看看。以下記錄自定 TabBar View 蓋過原本 TabBar 但又不失 TabBarController 功能的方法。
在 UIApplication 中加入:
[self.tabBarController.tabBar.superview.addSubview: fakeTabBG];
[self.tabBarController.tabBar.superview addSubview: fakeTab];
[self.tabBarController.tabBar.superview addSubview: fakeNavBar];
在自製的 fakeTabItem (TabBar 下面的 Tab,其實是以 UIButton 實作)
[fakeTabItem4 addTarget:self action:@selector(tabItemPressed:) forControlEvents:UIControlEventTouchUpInside];
每個 Tab Button trigger 原生 tabBarController- (void)tabItemPressed: (UIButton *) sender
{
nowTabIndex = [[[NSNumber alloc] initWithInteger: sender.tag] intValue] -1;
self.tabBarController.selectedIndex = nowTabIndex;
[self chkPressed];
}
大致即可完成,如圖:
Customized UI影片
By DK Tai-Wei Kan
這邊順便 bookmark 一下一個不錯的 iOS UI Patterns 網站,他蒐集了不少自定義 iOS UI 的案例:http://pttrns.com/