从0开始架构一个IOS程序 ——04— UITabBarController和自定义TabBar 搭建主页面

从0开始架构一个IOS程序 04 UITabBarController 搭建主页面

Mac OSX 10.11 之后


效果


1 首先创建自定义TabBar

1.1 WISHomeTabBarView.h
#import <UIKit/UIKit.h>


typedef NS_ENUM(NSUInteger,WISHomeItemType){
    WISHomeItemTypeDefault=0
};

@class WISHomeTabBarView;

//定义block回调
//用于TabBarView中Item点击事件回调
typedef void(^WISHomeTabBlock)(WISHomeTabBarView *tabBar,WISHomeItemType idx);

//定义代理协议回调
//用于TabBarView中Item点击事件回调
@protocol WISHomeTabBarDelegate <NSObject>

-(void) tabbar:(WISHomeTabBarView*) tabBar clickButton:(WISHomeItemType) idx;

@end


@interface WISHomeTabBarView : UIView

//代理回调
@property(weak,nonatomic) id<WISHomeTabBarDelegate> delegate;
//block回调
@property(copy,nonatomic) WISHomeTabBlock block;


@end
1.2 WISHomeTabBarView.m

#import "WISHomeTabBarView.h"
#import "WISHomeTabBarModel.h"


@interface WISHomeTabBarView()

//tabBar的背景
@property(nonatomic,strong) UIImageView *tabbarBackgroundImageView;

//tabBar条目数据集合
@property(nonatomic,strong) NSMutableArray *dataList;

//上一个点击的Item
@property(nonatomic,strong) UIView *lastClickUiView ;

@end

@implementation WISHomeTabBarView
//设置tabbar的背景
-(UIImageView *)tabbarBackgroundImageView{
    if (!_tabbarBackgroundImageView) {
        _tabbarBackgroundImageView=[[UIImageView alloc]init];
        [_tabbarBackgroundImageView setBackgroundColor:[UIColor grayColor]];
    }
    return _tabbarBackgroundImageView;
}


//初始化tabbar的条目数据
-(NSMutableArray *)dataList{
    if (!_dataList) {
        _dataList=[NSMutableArray array];

        //首页
        WISHomeTabBarModel *homeItem = [[WISHomeTabBarModel alloc]initWithName:@"首页" andImageNormalName:@"tab_home_normal" andImagePressName:@"tab_home_press"];

        //消息
        WISHomeTabBarModel *msgItem = [[WISHomeTabBarModel alloc]initWithName:@"消息" andImageNormalName:@"home_table_msg_normal" andImagePressName:@"home_table_msg_select"];

        //发现
        WISHomeTabBarModel *findItem = [[WISHomeTabBarModel alloc]initWithName:@"发现" andImageNormalName:@"home_table_topic_normal" andImagePressName:@"home_table_topic_select"];

        //我的
        WISHomeTabBarModel *personItem = [[WISHomeTabBarModel alloc]initWithName:@"我的" andImageNormalName:@"home_table_me_normal" andImagePressName:@"home_table_me_select"];

        [_dataList addObject:homeItem];
        [_dataList addObject:msgItem];
        [_dataList addObject:findItem];
        [_dataList addObject:personItem];
    }
    return _dataList;
}

//创建Item 并将Item添加到 TabBar(其实是自定义的UIView)中
-(instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];

    //循环创建Item
    for (NSInteger i=0; i<self.dataList.count; i++) {
        //取出Item数据
        WISHomeTabBarModel *itemModel = self.dataList[i];
        //构建Item
        UIView *iteView = [[UIView alloc]init];

        //创建 UIImageView
        UIImageView *itemImageView = [[UIImageView alloc]init];
        //创建  UILabel
        UILabel *label = [[UILabel alloc]init];
        //设置显示字体
        label.text = itemModel.name;
        //设置字体显示大小
        label.font=[UIFont italicSystemFontOfSize:12];


        [iteView addSubview:itemImageView];
        [iteView addSubview:label];

        //设置tag
        iteView.tag = WISHomeItemTypeDefault+i;

        //设置手势监听
        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(clickItem:)];
        [tap setNumberOfTapsRequired:1];
        [tap setNumberOfTouchesRequired:1];
        [iteView addGestureRecognizer:tap];


        //设置默认
        if (i==0) {
            self.lastClickUiView = iteView;
            //默认图标
            [itemImageView setImage:[UIImage imageNamed:itemModel.imagePressName]];
            //默认text颜色
            label.textColor=[UIColor blueColor];

        }else{
            [itemImageView setImage:[UIImage imageNamed:itemModel.imageNormalName]];
            label.textColor=[UIColor grayColor];
        }

        [self addSubview:iteView];

    }


    return self;
}
//Item 的点击事件
-(void) clickItem:(UITapGestureRecognizer *) gesture{

    //当前点击的View
    UITapGestureRecognizer *tap = (UITapGestureRecognizer *)gesture;
    //当前点击的View的tag
    NSInteger tag = tap.view.tag;

    //上一次点击的View的tag
    NSInteger lastClickTag = self.lastClickUiView.tag;

    if (tag==lastClickTag) {
        //同一次点击
    }else{


        for (NSInteger i=0; i<[self subviews].count; i++) {
            UIView *itemView =[self subviews][i];
            NSInteger cusTag = itemView.tag;

            if (cusTag==tag) {
                self.lastClickUiView = itemView;

                for (NSInteger j=0; j<[itemView subviews].count; j++) {
                    UIView *child = [itemView subviews][j];
                    if ([child isKindOfClass:[UIImageView class]]) {
                        [((UIImageView *)child) setImage:[UIImage imageNamed:((WISHomeTabBarModel*)self.dataList[tag]).imagePressName]];

                        //设置动画
                        [UIView animateWithDuration:0.2 animations:^{
                            child.transform=CGAffineTransformMakeScale(1.2, 1.2);
                        } completion:^(BOOL finished) {
                            [UIView animateWithDuration:0.2 animations:^{
                                //恢复原始状态
                                child.transform = CGAffineTransformIdentity;
                            }];
                        }];

                        //代理回调
                        if ([self.delegate respondsToSelector:@selector(tabBar)]) {
                            [self.delegate tabbar:self clickButton:tag];
                        }
                        //block回调
                        if(self.block){
                            self.block(self,tag);
                        }


                    }else if([child isKindOfClass:[UILabel class]]){
                        [((UILabel *)child) setTextColor:[UIColor blueColor]];
                    }

                }
            }else{
                for (NSInteger j=0; j<[itemView subviews].count; j++) {
                    UIView *child = [itemView subviews][j];
                    if ([child isKindOfClass:[UIImageView class]]) {
                        [((UIImageView *)child) setImage:[UIImage imageNamed:((WISHomeTabBarModel*)self.dataList[itemView.tag]).imageNormalName]];
                    }else if([child isKindOfClass:[UILabel class]]){
                        [((UILabel *)child) setTextColor:[UIColor grayColor]];
                    }

                }
            }
        }

    }

    NSLog(@"click %i ",tag);
}
//测量设置每一个条目的Frame
-(void)layoutSubviews{
    [super layoutSubviews];
    //设置背景的frame
    self.tabbarBackgroundImageView.frame = self.bounds;

    //每一个item的宽度
    CGFloat itemWidth = self.bounds.size.width/self.dataList.count;
    for (NSInteger i=0; i<[self subviews].count; i++) {
        UIView *view = [self subviews][i];

        NSLog(@"view tag is %i ",view.tag);

        view.frame = CGRectMake((view.tag)*itemWidth, 0, itemWidth, self.frame.size.height);

        for (NSInteger j=0; j<[view subviews].count; j++) {
            UIView *childView = [view subviews][j];
            if([childView isKindOfClass:[UIImageView class]]){
                childView.frame=CGRectMake(view.bounds.size.width/2-10, 8, 22, 22);
            }else if([childView isKindOfClass:[UILabel class]]){
                childView.frame=CGRectMake(view.bounds.size.width/2-11, 29, 42, 22);
            }
        }

    }
}

WISHomeTabBarModel.h文件

#import <Foundation/Foundation.h>

@interface WISHomeTabBarModel : NSObject

//条目的显示文字
@property(nonatomic,copy) NSString *name;
//正常状态下图标(未选中)
@property(nonatomic,copy) NSString *imageNormalName;
//选中状态下的图标
@property(nonatomic,copy) NSString *imagePressName;


-(id) initWithName:(NSString *) name andImageNormalName:(NSString *)imageNormalName andImagePressName:(NSString*) imagePressName;

@end

WISHomeTabBarModel.m文件

#import "WISHomeTabBarModel.h"

@implementation WISHomeTabBarModel

-(id)initWithName:(NSString *)name andImageNormalName:(NSString *)imageNormalName andImagePressName:(NSString *)imagePressName{
    _name = name;
    _imageNormalName = imageNormalName;
    _imagePressName = imagePressName;

    return self;
}
@end

2 创建 WISHomeTabBarViewController (UITabBarController) 来搭建主页面

2.1 WISHomeTabBarViewController.h
@interface WISHomeTabBarViewController : UITabBarController

@end
2.1 WISHomeTabBarViewController.m
#import "WISHomeTabBarViewController.h"
#import "CXBaseNavViewController.h"
#import "WISHomeTabBarView.h"

@interface WISHomeTabBarViewController () <WISHomeTabBarDelegate>

//自定义的TabBar
@property(nonatomic,strong) WISHomeTabBarView *homeTabBarView;

@end

@implementation WISHomeTabBarViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    //加载控制器
    [self configViewController];
    //加载tabBar
    [self.tabBar addSubview:self.homeTabBarView];
}
//创建自定义的TabBar
-(WISHomeTabBarView *)homeTabBarView{
    if (!_homeTabBarView) {
        _homeTabBarView = [[WISHomeTabBarView alloc]init];
        _homeTabBarView.frame=CGRectMake(0, 0, mainW, 49);
        _homeTabBarView.delegate=self;
    }
    return _homeTabBarView;
}
//加载控制器
-(void) configViewController{

    //保存的是已创建好的viewController的名称
    NSMutableArray *array=[NSMutableArray arrayWithArray:@[@"WISHomeViewController",@"WISMsgViewController",@"WISFindViewController",@"WISPersonViewController"]];

    for (NSInteger i=0; i<array.count; i++) {
        //取出新建好的ViewController的名称
        NSString *item = array[i];
        //构建ViewController
        UIViewController *itemController = [[NSClassFromString(item)alloc]init];
        //构建NavViewController
        CXBaseNavViewController *itemNavController =[[CXBaseNavViewController alloc]initWithRootViewController:itemController];
        //添加到集合中
        [array replaceObjectAtIndex:i withObject:itemNavController];

    }
    //将创建好的Controll关联UITabBarController
    self.viewControllers = array;
}

//自定义TabBar中Item的点击事件回调
-(void)tabbar:(WISHomeTabBarView *)tabBar clickButton:(WISHomeItemType)idx{
    //切换对应的UITabBarController中的Controller
    self.selectedIndex=idx-WISHomeItemTypeDefault;

}
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


@end

3 AppDelegate 中设置rootViewController

#import "AppDelegate.h"
#import "WISHomeTabBarViewController.h"

@interface AppDelegate ()

@end

@implementation AppDelegate


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

    //创建首页TabBar
    WISHomeTabBarViewController *controller = [[WISHomeTabBarViewController alloc]init];
    //设置root
    self.window.rootViewController = controller;
    return YES;
}

... ... ... 

@end
早起的年轻人 CSDN认证博客专家 移动开发 项目管理 Java
只要用心去做,每一件事情还是有可能成功的,当然成功是没有界限的,只不过是达到自己心里的那个目标,公众号:我的大前端生涯,一个爱喝茶的程序员,通常会搞搞SpringBoot 、Herbinate、Mybatiys、Android、iOS、Flutter、Vue、小程序等.
©️2020 CSDN 皮肤主题: 代码科技 设计师:Amelia_0503 返回首页