UI控件笔记（九）：UI之UITabBarController

 一、使用系统自带TabBar实例化步骤

1、实例化相应的VC

    RedViewController *red = [[RedViewController alloc] init];

    OrangeViewController *orange = [[OrangeViewController alloc] init];

    YellowViewController *yellow = [[YellowViewController alloc] init];

    GreenViewController *green = [[GreenViewController alloc] init];

    BlueViewController *blue = [[BlueViewController alloc] init];

    BlackViewController *black = [[BlackViewController alloc] init];

    WhiteViewController *white = [[WhiteViewController alloc] init];

    

    2、把VC分别放进导航控制器中

    UINavigationController *redNav = [[UINavigationController alloc] initWithRootViewController:red];

    UINavigationController *orangeNav = [[UINavigationController alloc] initWithRootViewController:orange];

    UINavigationController *yellowNav = [[UINavigationController alloc] initWithRootViewController:yellow];

    UINavigationController *greenNav = [[UINavigationController alloc] initWithRootViewController:green];

    UINavigationController *blueNav = [[UINavigationController alloc] initWithRootViewController:blue];

    UINavigationController *blackNav = [[UINavigationController alloc] initWithRootViewController:black];

    UINavigationController *whiteNav = [[UINavigationController alloc] initWithRootViewController:white];

    

    3、把VCrelease掉

    [red release];

    [orange release];

    [yellow release];

    [green release];

    [blue release];

    [black release];

    [white release];

    

    4、对每一个Nav进行图片和文字的设置

    //redNav.navigationItem.title = @"红";

    redNav.title = @"红";  //设置低栏中标题

    //red.title = @"红";  //可以同时设置导航栏和低栏中的标题

    //red.navigationItem.title = @"红"; //只是设置导航栏中的标题

    //orangeNav.navigationItem.title = @"橙"; //设置导航栏中的标题，但这里不能显示，需要到对应的.m文件中设置，虽然不显示，但这里可以获取导航栏中的标题

    orangeNav.title = @"橙";

    //yellowNav.navigationItem.title = @"黄";

    yellowNav.title = @"黄";

    //greenNav.navigationItem.title = @"绿";

    greenNav.title = @"绿";

    blueNav.title = @"蓝";

    blackNav.title = @"黑";

    white.title = @"白";

    

    特别注意：tabbar或者导航条上面item的图，需要透明图

    redNav.tabBarItem.image = [UIImage imageNamed:@"tab_0.png"];

    orangeNav.tabBarItem.image = [UIImage imageNamed:@"tab_1.png"];

    yellowNav.tabBarItem.image = [UIImage imageNamed:@"tab_2.png"];

    greenNav.tabBarItem.image = [UIImage imageNamed:@"tab_3.png"];

    blueNav.tabBarItem.image = [UIImage imageNamed:@"tab_s.png"];

    blackNav.tabBarItem.image = [UIImage imageNamed:@"tab_0.png"];

    whiteNav.tabBarItem.image = [UIImage imageNamed:@"tab_1.png"];

    

    //设置选中图片

    orangeNav.tabBarItem.selectedImage = [UIImage imageNamed:@"tab_3.png"];

    

    5、把nav们放进一个数组

    NSArray *navArr = @[redNav,orangeNav,yellowNav,greenNav,blueNav,blackNav,whiteNav];

    [redNav release];

    [orangeNav release];

    [yellowNav release];

    [greenNav release];

    [blueNav release];

    [blackNav release];

    [whiteNav release];

    

    6、实例化TabBarController

    UITabBarController *tab = [[UITabBarController alloc] init];

    特别注意：高度默认49

    7、把nav的数组赋值给tab

    tab.viewControllers = navArr;

    

    8、把tab当做window的root

    self.window.rootViewController = tab;

    

    9、tab-1

    [tab release];

二、自定义TabBar步骤

#import "MyTabBarViewController.h"

#import "FirstViewController.h"

#import "SecondViewController.h"

#import "ThirdViewController.h"

#import "FourthViewController.h"

@interface MyTabBarViewController ()

@end

@implementation MyTabBarViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    

    //1、隐藏系统tabbar

    self.tabBar.hidden = YES;//self就是这个TabbarVC的对象，这个对象有自己的一个Tabbar

    //2、制作tabbar上的VC们

    [self makeVC];

    //3、制作自定义tabbar

    [self makeUI];

    // Do any additional setup after loading the view.

}

-(void)makeVC

{

    //1、实例化VC

    FirstViewController *first = [[FirstViewController alloc] init];

    SecondViewController *second = [[SecondViewController alloc] init];

    ThirdViewController *third = [[ThirdViewController alloc] init];

    FourthViewController *fourth = [[FourthViewController alloc] init];

    //2、放进导航

    UINavigationController *firstNav = [[UINavigationController alloc] initWithRootViewController:first];

    UINavigationController *secondNav = [[UINavigationController alloc] initWithRootViewController:second];

    UINavigationController *thirdNav = [[UINavigationController alloc] initWithRootViewController:third];

    UINavigationController *fourthNav = [[UINavigationController alloc] initWithRootViewController:fourth];

    [first release];

    [second release];

    [third release];

    [fourth release];

    //3、导航放进数组

    NSArray *navArr = @[firstNav,secondNav,thirdNav,fourthNav];

    [firstNav release];

    [secondNav release];

    [thirdNav release];

    [fourthNav release];

    

    //4、数组交给self.VCS

    self.viewControllers = navArr;

}

-(void)makeUI

{

    //背景图

    UIImageView *bar = [[UIImageView alloc] initWithFrame:CGRectMake(0, self.view.frame.size.height-49, self.view.frame.size.width, 49)];

    bar.image = [UIImage imageNamed:@"tabbg.png"];

    [self.view addSubview:bar];

    [bar release];

    bar.userInteractionEnabled = YES;

    //背景上的按钮

    //算一下，平分之后宽度是多少

    float seperateWidth = (self.view.frame.size.width-120)/5;

    for(int i =0;i<4;i++)

    {

        UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];

        btn.frame = CGRectMake(seperateWidth+i*(seperateWidth+30), 2, 30, 30);

        [btn setImage:[UIImage imageNamed:[NSString stringWithFormat:@"tab_%d.png",i]] forState:UIControlStateNormal];

        [btn addTarget:self action:@selector(btnDown:) forControlEvents:UIControlEventTouchUpInside];

        [bar addSubview:btn];

        btn.tag = 1000+i;

        if(i == 0)

        {

            [btn setImage:[UIImage imageNamed:@"tab_c0.png"] forState:UIControlStateNormal];

        }

    }

    //文字

    NSArray *titleArr = @[@"one",@"two",@"three",@"four"];

    for(int i =0;i<titleArr.count;i++)

    {

        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(seperateWidth+i*(seperateWidth+30), 33, 30, 13)];

        label.text = titleArr[i];

        label.font = [UIFont systemFontOfSize:12];

        label.textAlignment = NSTextAlignmentCenter;

        label.textColor = [UIColor whiteColor];

        [bar addSubview:label];

        [label release];

        label.tag = 2000+i;

        if(i == 0)

        {

            label.textColor = [UIColor orangeColor];

        }

    }

    

    //选中标示(可选)

    UIView *line = [[UIView alloc] initWithFrame:CGRectMake(seperateWidth, 47, 30, 1)];

    line.backgroundColor = [UIColor orangeColor];

    [bar addSubview:line];

    [line release];

    line.tag = 4000;

}

-(void)btnDown:(UIButton*)btn

{

    //1、切换VC

    self.selectedIndex = btn.tag - 1000;//selectedIndex就表示了对应下标的那个VC

    

    //2、btn图片的切换

    for(int i = 0;i<4;i++)

    {

        UIButton *btn1 = (UIButton*)[self.view viewWithTag:1000+i];

        [btn1 setImage:[UIImage imageNamed:[NSString stringWithFormat:@"tab_%d.png",i]] forState:UIControlStateNormal];

        

        UILabel *lab = (UILabel*)[self.view viewWithTag:2000+i];

        lab.textColor = [UIColor whiteColor];

        if(lab.tag == btn.tag+1000)

        {

            lab.textColor = [UIColor orangeColor];

        }

    }

    [btn setImage:[UIImage imageNamed:[NSString stringWithFormat:@"tab_c%d.png",btn.tag-1000]] forState:UIControlStateNormal];

    

    UIView *view = (UIView*)[self.view viewWithTag:4000];

    view.frame = CGRectMake(btn.frame.origin.x, 47, 30, 1);

}