【UI初级------连载七】标签控制器-CSDN博客

本文链接：https://blog.csdn.net/Wing_n/article/details/48717831

内容简介：

1、创建标签控制器

2、标签栏（ TabBar ）的设置

3、创建子控制器

4、标签控制器和导航控制器的结合

一、创建标签控制器（.m文件中）

#import "HomeViewController.h"
#import "MessageViewController.h"
#import "SearchViewController.h"

#import "SettingViewController.h"

// 创建几个视图控制器
    HomeViewController *homeVC = [[ HomeViewController alloc ] init ];
    homeVC. title = @"home" ;
    // 最好不要在这里设置视图控制器的 title ，这样会破坏它的封装性，要在它自己的 .m 文件中设置

    MessageViewController *messageVC = [[ MessageViewController alloc ] init ];
    messageVC. title = @"message" ;

    SearchViewController *searchVC = [[ SearchViewController alloc ] init ];
    searchVC. title = @"search" ;

    SettingViewController *settingVC = [[ SettingViewController alloc ] init ];
    settingVC. title = @"setting" ;

    NSMutableArray *mArry = [[ NSMutableArray alloc ] initWithObjects :homeVC, messageVC, searchVC, settingVC, nil ];

    for ( int i = 0 ; i < 5 ; i++) {
        UIViewController *vc = [[ UIViewController alloc ] init ];
        vc. title = [ NSString stringWithFormat : @" 第 %d 个控制器 " ,i+ 5 ];
        vc. view . backgroundColor = [ UIColor colorWithRed : arc4random ()% 10 * 0.1 green :( arc4random ()% 10 * 0.1 ) blue : arc4random ()% 10 * 0.1 alpha : 1 ];

        [mArry addObject :vc];
    }

    // 创建标签控制器
    UITabBarController *tabBarCtrl = [[ UITabBarController alloc ] init ];
    tabBarCtrl. viewControllers = mArry;

    [ self . window setRootViewController :tabBarCtrl];

二、标签栏（TabBar）的设置

- ( BOOL )application:( UIApplication *)application didFinishLaunchingWithOptions:( NSDictionary *)launchOptions {
    // Override point for customization after application launch.

    CGFloat scrrenWidth = [ UIScreen mainScreen ]. bounds . size . width ;
//    CGFloat scrrenHeight = [UIScreen mainScreen].bounds.size.height;

    //=============================================
    [[ UIApplication sharedApplication ] registerUserNotificationSettings :[[ UIUserNotificationSettings alloc ] init ]];

    [ UIApplication sharedApplication ]. applicationIconBadgeNumber = 5 ;
    //=============================================

    //******* 创建 window 窗口 *********************
    // 拿到屏幕的大小
    CGRect rect = [ UIScreen mainScreen ]. bounds ;
    // 创建一个 window
    self . window = [[ UIWindow alloc ] initWithFrame :rect];
    // 设置窗口颜色
    self . window . backgroundColor = [ UIColor whiteColor ];
    // 把当前的 window 作为程序的主 window 显示出来
    [ self . window makeKeyAndVisible ];

    // 创建几个视图控制器
    HomeViewController *homeVC = [[ HomeViewController alloc ] init ];
    MessageViewController *messageVC = [[ MessageViewController alloc ] init ];
    SearchViewController *searchVC = [[ SearchViewController alloc ] init ];
    SettingViewController *settingVC = [[ SettingViewController alloc ] init ];

    // 创建 UITabBarController
    UITabBarController *tabbarCtrl = [[ UITabBarController alloc ] init ];
    tabbarCtrl. viewControllers = @[ homeVC, messageVC, searchVC, settingVC ] ;

    // 使用自定义方式定义 tabBarItem
    UITabBarItem *item1 = [[ UITabBarItem alloc ] initWithTabBarSystemItem : UITabBarSystemItemFavorites tag : 10 ];
    homeVC. tabBarItem = item1;

    UITabBarItem *item2 = [[ UITabBarItem alloc ] initWithTabBarSystemItem : UITabBarSystemItemBookmarks tag : 11 ];
    item2. badgeValue = @"haha" ;
    messageVC. tabBarItem = item2;

    UITabBarItem *item3 = [[ UITabBarItem alloc ] initWithTitle : @" 搜索 " image :[ UIImage imageNamed : @"tabbar_discover.png" ] selectedImage :[ UIImage imageNamed : @"tabbar_discover_highlighted.png" ]];
    searchVC. tabBarItem = item3;

    UITabBarItem *item4 = [[ UITabBarItem alloc ] initWithTitle : @" 联系人 " image :[ UIImage imageNamed : @"tabbar_profile.png" ] selectedImage :[ UIImage imageNamed : @"tabbar_profile_highlighted.png" ]];
    settingVC. tabBarItem = item4;

    // 设置 tabBar 的背景图片
    UIImage *img = [ UIImage imageNamed : @"navbg.png" ];

    UIGraphicsBeginImageContext ( CGSizeMake (scrrenWidth, 49 ));
    [img drawInRect : CGRectMake ( 0 , 0 , scrrenWidth, 49 )];
    img = UIGraphicsGetImageFromCurrentImageContext ();
    UIGraphicsEndImageContext ();

    tabbarCtrl. tabBar . backgroundImage = img;

    // 设置 tabBar 的背景颜色
//    tabbarCtrl.tabBar.barTintColor = [UIColor cyanColor];

    // 设置选中图片的颜色
    tabbarCtrl. tabBar . tintColor = [ UIColor cyanColor ];

    // 设置选中 item 后，显示在此 item 下面的图片
    tabbarCtrl. tabBar . selectionIndicatorImage = [ UIImage imageNamed : @" 选中 .png" ];

    self . window . rootViewController = tabbarCtrl;



    return YES ;
}

三、创建子控制器

}

@end

四、标签控制器和导航控制器的结合

#import "MainTabBarController.h"
#import "HomeViewController.h"
#import "MessageViewController.h"
#import "SearchViewController.h"
#import "SettingViewController.h"
#import "MoreViewController.h"

@interface MainTabBarController ()
{
    CGFloat width;
    CGFloat height;
}
@end

@implementation MainTabBarController

- ( void )viewDidLoad {
    [ super viewDidLoad ];
    // Do any additional setup after loading the view.

    // 隐藏自己的（系统的） tabBarView
    self . tabBar . hidden = YES ;

    // 创建自定义的 tabBarView
    [ self _initViews ];

    // 创建子控制器
    [ self _initViewControllers ];
}

- ( void )_initViews{
    width = [ UIScreen mainScreen ]. bounds . size . width ;
    height = [ UIScreen mainScreen ]. bounds . size . height ;

    _tabBarImgView = [[ UIImageView alloc ] initWithFrame : CGRectMake ( 0 , height - 49 , width , 49 )];
    _tabBarImgView . image = [ UIImage imageNamed : @"navbg.png" ];
    [ self . view addSubview : _tabBarImgView ];

    _tabBarImgView . userInteractionEnabled = true ;


    // 创建选中视图
    UIImageView *selectedImgView = [[ UIImageView alloc ] initWithFrame : CGRectMake ( 0 , 0 , 53 , 45 )];
    selectedImgView. tag = 100 ;
    selectedImgView. image = [ UIImage imageNamed : @" 选中 .png" ];

    // 创建 5 个按钮
    for ( int i = 0 ; i < 5 ; i++) {
        UIButton *btn = [ UIButton buttonWithType : UIButtonTypeCustom ];
        btn. frame = CGRectMake ( width / 5 * i, 0 , width / 5 , 49 );
        btn. tag = 200 + i;
        NSString *imgName = [ NSString stringWithFormat : @"%d" ,i + 1 ];
        [btn setImage :[ UIImage imageNamed :imgName] forState : UIControlStateNormal ];
        [btn addTarget : self action : @selector (buttonClick:) forControlEvents : UIControlEventTouchUpInside ];
        [ _tabBarImgView addSubview :btn];

        if (i == 0 ) {
            selectedImgView. center = btn. center ;
        }
    }
    [ _tabBarImgView addSubview :selectedImgView];
}

- ( void )buttonClick:( UIButton *)btn{
    // 设置选择的控制器
    self . selectedIndex = btn. tag - 200 ;

    UIView *selectedView = [ _tabBarImgView viewWithTag : 100 ];

    [ UIView animateWithDuration : 0.2
                     animations :^{
                         selectedView. center = btn. center ;
                     }];
}

- ( void )_initViewControllers{
    NSLog ( @" 控制器 " );
    // 三级控制器
    HomeViewController *homeVC = [[ HomeViewController alloc ] init ];
    MessageViewController *messageVC =[[ MessageViewController alloc ] init ];
    SearchViewController *searchVC = [[ SearchViewController alloc ] init ];
    SettingViewController *settingVC = [[ SettingViewController alloc ] init ];
    MoreViewController *moreVC = [[ MoreViewController alloc ] init ];

    NSArray *viewCtrls = @[ homeVC, messageVC, searchVC, settingVC, moreVC ] ;

    NSMutableArray *navs = [ NSMutableArray array ];
    // 二级控制器
    for ( int i = 0 ; i < viewCtrls. count ; i ++) {
        UINavigationController *nav = [[ UINavigationController alloc ] initWithRootViewController :viewCtrls[i]];
        nav. delegate = self ;
        [navs addObject :nav];
    }
    // 一级控制器
    self . viewControllers = navs;

}

#pragma mark -<UINavigationControllerDelegate>
- ( void )navigationController:( UINavigationController *)navigationController willShowViewController:( UIViewController *)viewController animated:( BOOL )animated{
    // 当导航控制器的数量等于 2 时，隐藏标签栏
    NSInteger count = navigationController. viewControllers . count ;
    NSLog ( @"%ld" , count);
    if (count == 2 ) {
//        _tabBarImgView.hidden = YES;
        [ UIView animateWithDuration : 0.25 animations :^{
            _tabBarImgView . frame = CGRectMake (- width , height - 49 , width , 49 );
        }];
    } else if (count == 1 ) {
//        tabBarImgView.hidden = NO;
        [ UIView animateWithDuration : 0.25 animations :^{
            _tabBarImgView . frame = CGRectMake ( 0 , height - 49 , width , 49 );
        }];
    }

}

@end