Three20研究院之完全自定义TabBar（八）

来源：互联网发布：天津平面设计美工招聘编辑：程序博客网时间：2024/06/02 07:06

今天雨松MOMO给大家讲讲如何在Three20中自定义TabBar，如下图所示，IOS源生的TabBar中的图片必需是这种无彩图，如果添加有色图片时将无法显示。如果要学习源生的TabBar的话大家可以参考我之前的文章： Three20研究院之TabBar与下拉列表访问数据与刷新（五）

下面我们学习如何在Three20中自定义TabBar。代码其实非常非常简单，就是在界面绘制几个自定义按钮，然后当点击按钮后切换TabBar的item。如下图所示，雨松MOMO写了一个简单的例子，“历史”与“主页”按钮，点击后将使用TabBar切换item进入各自的ViewController。

下面就直接上代码，大家仔细看看应该都能懂，核心的代码其实就几行。

AppDelegate.m 这个类没什么说的。

01#import "AppDelegate.h"
02 
03@implementation AppDelegate
04 
05- (void)dealloc
06{
07    [_window release];
08    [super dealloc];
09}
10 
11- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
12{
13 
14    [application setStatusBarOrientation:UIInterfaceOrientationLandscapeRight animated:NO];
15 
16    //创建导航条
17    TTNavigator* navigator = [TTNavigator navigator];
18    navigator.persistenceMode = TTNavigatorPersistenceModeAll;
19    navigator.window = [[[UIWindow alloc] initWithFrame:TTScreenBounds()] autorelease];
20 
21    //TTURLMap 非常重要的一个属性
22    //界面的点击切换完全取决与它的设定
23    TTURLMap* map = navigator.URLMap;
24 
25    //如果须要访问wab页面的话 就必需添加
26    [map from:@"*" toViewController:[TTWebController class]];
27 
28    [map from:@"tt://Tab" toModalViewController:[RootViewController class]];//入口
29    [map from:@"tt://Menu" toModalViewController:[MenuViewController class]];//
30    [map from:@"tt://Test" toModalViewController:[TestViewController class]];//
31 
32    if (![navigator restoreViewControllers])
33    {
34        //打开上面设置的url
35        [navigator openURLAction:[TTURLAction actionWithURLPath:@"tt://Tab"]];
36    }
37 
38    return YES;
39}
40 
41@end

RootViewController.h

1#import <Foundation/Foundation.h>
2#import <Three20/Three20.h>
3 
4//这个头文件一定要写 不然会有警告的错误
5#import "Three20UI/Three20UI+Additions.h"
6 
7@interface RootViewController : UITabBarController
8 
9@end

RootViewController.m

01#import "RootViewController.h"
02 
03@interface RootViewController ()
04 
05@end
06 
07@implementation RootViewController
08 
09- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
10{
11    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
12    if (self)
13    {
14 
15    }
16    return self;
17}
18 
19- (void)viewDidLoad
20{
21    //在这里设置Tab中指向的所有ViewController的URL
22    //数量是任意的，这里我写了两个
23    [self setTabURLs:[NSArray arrayWithObjects:@"tt://Menu",
24                      @"tt://Test",
25                      nil]];
26 
27    //在这里隐藏TabBar 不然会露出黑色的背景。
28    self.tabBar.hidden = YES;
29 
30    //下面是我写的两个普通的自定义图片按钮
31    UIButton *test0 = [UIButton buttonWithType:UIButtonTypeCustom];
32    [test0 setFrame: CGRectMake(15, 200, 256, 49)];
33    [test0 setImage: TTIMAGE(@"bundle://tabbar_history_nomal_1.png")forState:UIControlStateNormal];
34    [test0 setImage:TTIMAGE(@"bundle://tabbar_history_selected_1.png") forState:UIControlStateHighlighted];
35    test0.tag = 0;
36    [test0 addTarget:self action:@selector(testPressed:) forControlEvents:UIControlEventTouchDown];
37    [self.view addSubview:test0];
38 
39    UIButton *test1 = [UIButton buttonWithType:UIButtonTypeCustom];
40    [test1 setFrame: CGRectMake(15, 250, 256, 49)];
41    [test1 setImage: TTIMAGE(@"bundle://tabbar_home_nomal_1.png")forState:UIControlStateNormal];
42    [test1 setImage:TTIMAGE(@"bundle://tabbar_home_selected_1.png") forState:UIControlStateHighlighted];
43    test1.tag = 1;
44    [test1 addTarget:self action:@selector(testPressed:) forControlEvents:UIControlEventTouchDown];
45    [self.view addSubview:test1];
46 
47}
48 
49-(void)testPressed:(id)buttonID
50{
51 
52    UIButton *button = (UIButton *)buttonID;
53 
54    //重要的地方在这里
55    //根据点击按钮的ID来动态切换TabBar的指向，
56 
57    [self setSelectedIndex:button.tag];
58 
59}
60 
61-(void)viewWillAppear:(BOOL)animated
62{
63    [super viewWillAppear:animated];
64    [self.navigationController setNavigationBarHidden:YES animated:NO];
65 
66}
67 
68@end

MenuViewController.m

01#import "MenuViewController.h"
02 
03@interface MenuViewController ()
04 
05@end
06 
07@implementation MenuViewController
08 
09- (void)viewDidLoad
10{
11    [super viewDidLoad];
12 
13    UIImageView *title = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 120, 120)];
14 
15    title.image = TTIMAGE(@"bundle://1.JPG");
16 
17    [self.view addSubview:title];
18 
19    [title release];
20 
21    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(150, 0, 120, 120)];
22    label.text = @"大家好，我是若若娃娃！";
23    [label setBackgroundColor: [UIColor blackColor]];
24    label.textColor = [UIColor whiteColor];
25    label.lineBreakMode = UILineBreakModeWordWrap;
26    label.numberOfLines = 0;
27    [self.view addSubview:label];
28    [label release];
29}
30 
31-(void)viewWillAppear:(BOOL)animated
32{
33    [super viewWillAppear:animated];
34    [self.navigationController setNavigationBarHidden:YES animated:NO];
35 
36}
37 
38@end

TestViewController.m

01#import "TestViewController.h"
02 
03@interface TestViewController ()
04 
05@end
06 
07@implementation TestViewController
08 
09- (void)viewDidLoad
10{
11    [super viewDidLoad];
12 
13    UIImageView *title = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 120, 120)];
14 
15    title.image = TTIMAGE(@"bundle://0.JPG");
16 
17    [self.view addSubview:title];
18 
19    [title release];
20 
21    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(150, 0, 120, 120)];
22    label.text = @"大家好，我是雨松MOMO！";
23    [label setBackgroundColor: [UIColor blackColor]];
24    label.textColor = [UIColor whiteColor];
25    label.lineBreakMode = UILineBreakModeWordWrap;
26    label.numberOfLines = 0;
27    [self.view addSubview:label];
28    [label release];
29 
30}
31 
32-(void)viewWillAppear:(BOOL)animated
33{
34    [super viewWillAppear:animated];
35    [self.navigationController setNavigationBarHidden:YES animated:NO];
36 
37}
38 
39@end

怎么样？挺较简单的吧，嘿嘿！因为比较简单，源码工程我就不放出了，大家仔细看看博文就应该能理解。写完博客趁着家里人睡着了MOMO得开始玩暗黑3啦，嘿嘿。在家里比较受限制，干什么家人都会问一句为什么，很不爽啊。。

上述的方法如果在子viewcontroller中是会被挡住的。如果彻底的想把tabBar隐藏可以使用如下的方法。

01- (void)makeTabBarHidden:(BOOL)hide
02{
03    if ( [self.view.subviews count] < 2 )
04        return;
05 
06    UIView *contentView;
07 
08    if ( [[self.view.subviews objectAtIndex:0] isKindOfClass:[UITabBar class]] )
09        contentView = [self.view.subviews objectAtIndex:1];
10    else
11        contentView = [self.view.subviews objectAtIndex:0];
12 
13    if ( hide )
14    {
15        contentView.frame = self.view.bounds;
16    }
17    else
18    {
19        contentView.frame = CGRectMake(self.view.bounds.origin.x,
20                                       self.view.bounds.origin.y,
21                                       self.view.bounds.size.width,
22                                       self.view.bounds.size.height - self.tabBar.frame.size.height);
23    }
24 
25    self.tabBar.hidden = hide;
26}