iOS之UI TabBarcontroller----自定义tabBar／改变tabBar中间按钮的样式(一)

 

 

 //  取消tabber的背景色

    [[UITabBarappearance] setShadowImage:[[UIImagealloc]init]];

    [[UITabBarappearance] setBackgroundImage:[[UIImagealloc]init]];

    //改变tabBar的背景颜色

    [tabC.tabBarinsertSubview:[selfdrawTabbarBgImageView] atIndex:0];

tabC.tabBar.opaque =YES;//透明

======================

#import

@interface UIView (Frame)

@property (nonatomic,assign) CGFloat x;

@property (nonatomic,assign) CGFloat y;

@property (nonatomic,assign) CGFloat width;

@property (nonatomic,assign) CGFloat height;

@end

=============

#import "UIView+Frame.h"

@implementation UIView (Frame)

//重写getter方法

- (CGFloat)x {

    returnself.frame.origin.x;

}

//重写setter方法

- (void)setX:(CGFloat)x {

    CGRect frame =self.frame;

    frame.origin.x = x;

    self.frame = frame;

}

- (CGFloat)y {

    returnself.frame.origin.y;

}

- (void)setY:(CGFloat)y {

    CGRect frame =self.frame;

    frame.origin.y = y;

    self.frame = frame;

}

- (CGFloat)width {

    returnself.bounds.size.width;

}

- (void)setWidth:(CGFloat)width {

    CGRect bounds =self.bounds;

    bounds.size.width = width;

    self.bounds = bounds;

}

- (CGFloat)height {

    returnself.bounds.size.height;

}

- (void)setHeight:(CGFloat)height {

    CGRect bounds =self.bounds;

    bounds.size.height = height;

    self.bounds = bounds;

}

@end

=============

1.完全自定义tabBar

#import

@interface CZTabBarButton : UIButton

@end

============

#import "CZTabBarButton.h"

@implementation CZTabBarButton

//让按钮不具有高亮状态

- (void)setHighlighted:(BOOL)highlighted {

}

@end

============

#import

@class CZTabBar;

@protocol CZTabBarDelegate <NSObject>

- (void)tabBarDidClickedButton:(CZTabBar *)tabBar selectedIndex:(NSInteger)selectedIndex;

@end

@interface CZTabBar : UIView

//1 初始化tabBAr的对象

+ (instancetype)tabBarWithSBNames:(NSArray *)sbNames;

@property (nonatomic,weak) id<CZTabBarDelegate> delegate;

@end

====================

/*

 自定义tabBAr的步骤

    1 创建自定义类继承自UIView-写类方法,初始化tabBar对象

    2 创建按钮-设置图片和大小

    3 设置按钮的位置--创建了UIView的分类, x,y,width,height

    4 给按钮注册点击事件--设置当前按钮选中-上一个按钮不选中

    5 第一个按钮默认选中

    6 自定义按钮,去掉高亮状态. 把事件换成touchDown

    7 点击按钮切换控制器. 记录当前按钮的索引 代理通知控制器切换

 */

#import "CZTabBar.h"

#import "UIView+Frame.h"

#import "CZTabBarButton.h"

@interface CZTabBar ()

//记录上一次点击的按钮

@property (nonatomic,weak) UIButton *preButton;

@end

@implementation CZTabBar

//1 初始化tabBAr的对象 并且生成对应子控制器的按钮

+ (instancetype)tabBarWithSBNames:(NSArray *)sbNames {

    CZTabBar *tabBar = [[selfalloc] init];

    //1.1 生成对应子控制器的按钮

       for (NSString *sbNamein sbNames) {

        CZTabBarButton *btn = [CZTabBarButtonbuttonWithType:UIButtonTypeCustom];

        //让按钮记录下来.按钮的索引

        btn.tag = tabBar.subviews.count;

        [tabBar addSubview:btn];

        //设置图片

        NSString *imgName = [NSStringstringWithFormat:@"TabBar_%@_new",sbName];

        NSString *selImgName = [NSStringstringWithFormat:@"TabBar_%@_selected_new",sbName];

        [btn setImage:[UIImageimageNamed:imgName] forState:UIControlStateNormal];

        [btn setImage:[UIImageimageNamed:selImgName] forState:UIControlStateSelected];

        //设置按钮的大小-让按钮的大小和内容的大小一致

        [btn sizeToFit];

        //1.2 注册事件,点击的时候高亮显示

        [btn addTarget:tabBaraction:@selector(btnClick:)forControlEvents:UIControlEventTouchDown];

    }

    //让第一个按钮选中

    UIButton *first = [tabBar.subviewsfirstObject];

    [tabBar btnClick:first];

    return tabBar;

}

//1.2 注册事件,点击的时候高亮显示

- (void)btnClick:(UIButton *)sender {

    //让上一次按钮不选中

    self.preButton.selected =NO;

    //让当前按钮选中

    sender.selected =YES;

    //记录上一次点击的按钮

    self.preButton = sender;

    //点击按钮切换控制器

    if ([self.delegaterespondsToSelector:@selector(tabBarDidClickedButton:selectedIndex:)]) {

        [self.delegatetabBarDidClickedButton:selfselectedIndex:sender.tag];

    }

}

- (void)layoutSubviews {

    [superlayoutSubviews];

    //设置按钮的位置

    int i =0;

    for (UIButton *btnin self.subviews) {

        btn.y =0;

        btn.x = btn.width * i;

        i++;

    }

}

@end

==================

#import

@interface CZTabBarController :UITabBarController

@end

===============

#import "CZTabBarController.h"

#import "CZTabBar.h"

@interface CZTabBarController () <CZTabBarDelegate>

@end

@implementation CZTabBarController

- (void)viewDidLoad {

    [superviewDidLoad];

    // Do any additional setup after loading the view.

    //存储sb名字

    NSArray *sbNames =@[@"LotteryHall",@"Arena",@"Discovery",@"History",@"MyLottery"];

    //1 加载tabBarController的子控制器

    [selfaddChildControllers:sbNames];

    //2 添加自定义tabBar

    CZTabBar *tabBar = [CZTabBartabBarWithSBNames:sbNames];

    tabBar.frame =self.tabBar.bounds;

    tabBar.delegate =self;

    //把自定义tabBAr添加到系统的tabBar中

    [self.tabBaraddSubview:tabBar];

}

//实现代理方法

- (void)tabBarDidClickedButton:(CZTabBar *)tabBar selectedIndex:(NSInteger)selectedIndex {

    //切换子控制器，UITabBarController的selectedIndex决定显示那一个控制器。

    self.selectedIndex = selectedIndex;

}

//1 加载tabBarController的子控制器

- (void)addChildControllers:(NSArray *)sbNames {

    //存放子控制器的数组

    NSMutableArray *mArray = [NSMutableArrayarray];

    for (NSString *sbNamein sbNames) {

        //1.1 加载sb中的控制器

        UIStoryboard *sb = [UIStoryboardstoryboardWithName:sbNamebundle:nil];

        //加载箭头指向的控制器

        UINavigationController *navC = [sbinstantiateInitialViewController];

        [mArray addObject:navC];

    }

    //当设置完子控制器之后,会立即添加对应的tabBarButton

    self.viewControllers = mArray;

}

@end

==================

2.改变ta bBar 中间按钮的样式-------直接修改图片的偏移，不设置item的标题

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

    //设置UINavigationBar的外观属性

    [[UINavigationBarappearance] setBarTintColor:[UIColorcolorWithRed:0.435green:0.427blue:0.533alpha:1.000]];

        UINavigationController *Personal_NV = [[UINavigationControlleralloc]initWithRootViewController:[[Personal_VCalloc]init]];

    NSArray *views =@[[[HomePage_VCalloc]init], [[Center_VCalloc]init], Personal_NV];

    //  取消tabber的背景色

    [[UITabBarappearance] setShadowImage:[[UIImagealloc]init]];

    [[UITabBarappearance] setBackgroundImage:[[UIImagealloc]init]];

    //  初始化菜单栏

    UITabBarController *tabC = [[UITabBarControlleralloc]init];

    //改变tabBar的背景颜色

    [tabC.tabBarinsertSubview:[selfdrawTabbarBgImageView] atIndex:0];

    tabC.tabBar.opaque =YES;

    NSLog(@"ScreenW:  %f",ScreenW);

    tabC.viewControllers = views;

    tabC.selectedIndex =0;

    NSArray *itemName =@[@"首页",@"",@"个人中心"];

    NSArray *defaultImage =@[@"home-page", @"tabcyq", @"grzx"];

    NSArray *selectImage =@[@"point home-page",@"point-cyq", @"point-grzx"];

    for(int numb =0 ; numb < itemName.count; numb ++)

    {

        UITabBarItem *tabBarItem = (UITabBarItem *)tabC.tabBar.items[numb];

        //  设置通知

         if (numb==1)

        {／／直接修改图片的偏移，

            [tabBarItem setImageInsets:UIEdgeInsetsMake(-12/3.8,0, 12/3.8,0)];

        }

        else

        {

        }

        tabBarItem.image = [[UIImageimageNamed:defaultImage[numb]]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

        tabBarItem.selectedImage = [[UIImageimageNamed:selectImage[numb]]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

        [tabBarItem setTitle:itemName[numb]];

    }

    self.window.rootViewController = tabC;

    [self.windowmakeKeyAndVisible];

    returnYES;

}

================================

 

3.自定义按钮添加到UI tabBar中间，其余按钮都用原生的；

============自定义AutoTabBar继承自UITabBar

@class AutoTabBar;

@protocol MYTabBarDelegate 

@optional

- (void)tabBarDidClickPlusButton:(AutoTabBar *)tabBar;

@end

@interface AutoTabBar : UITabBar

@property (strong,nonatomic)UIButton *plusBtn;

@property (nonatomic,weak) id tabBarDelegate;

@end

 

#import "AutoTabBar.h"

@implementation AutoTabBar

- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
   if (self) {
        // 添加一个按钮到tabbar中
        UIButton *plusBtn = [[UIButton alloc] init];
  [plusBtn setImage:[UIImage imageNamed:@"jia"]forState:UIControlStateNormal];
         CGRect temp = plusBtn.frame;
 temp.size=plusBtn.currentImage.size;//必须给button设置frame，否则不显示
     plusBtn.frame=temp;
      [plusBtn addTarget:self action:@selector(plusClick)forControlEvents:UIControlEventTouchUpInside];
        [self addSubview:plusBtn];
   self.plusBtn = plusBtn;
  NSLog(@"tab初始化");
   }
 return self;
    
}

-(void)plusClick{
 // 通知代理
if([self.tabBarDelegate respondsToSelector:@selector(tabBarDidClickPlusButton:)]) {
  [self.tabBarDelegate tabBarDidClickPlusButton:self];
  }
 
}

- (void)layoutSubviews
{
    [super layoutSubviews];
    NSLog(@"重新布局");
// 1.设置加号按钮的位置
CGPoint temp =self.plusBtn.center;
temp.x=self.frame.size.width/2;
  temp.y=self.frame.size.height/2;
  self.plusBtn.center=temp;
// 2.设置其它UITabBarButton的位置和尺寸
 CGFloat tabbarButtonW =self.frame.size.width /3;
 CGFloat tabbarButtonIndex =0;
 for (UIView *child in self.subviews) {
  Class class = NSClassFromString(@"UITabBarButton");
  if ([child isKindOfClass:class]) {
   // 设置宽度
   CGRect temp1=child.frame;
      temp1.size.width=tabbarButtonW;
   temp1.origin.x=tabbarButtonIndex * tabbarButtonW;
     child.frame=temp1;
     // 增加索引
    tabbarButtonIndex++;
   if (tabbarButtonIndex ==1) {//如果底部有5个按钮这里就是2
     tabbarButtonIndex++;
         }
      NSLog(@"frame----%f",child.frame.origin.x);
           }
    }
    
}

@end

 

 

#import 

NS_ASSUME_NONNULL_BEGIN

@interface LYBTabBarVC : UITabBarController

@end

NS_ASSUME_NONNULL_END

#import "LYBTabBarVC.h"
#import "AutoTabBar.h"
#import "LYBMyVC.h"
#import "QMWNBasenav.h"
#import "HomeVC.h"
#import "MyVC.h"
#import "Worddancevc.h"
#import "ImageTovideovc.h"
@interface LYBTabBarVC ()

@end

@implementation LYBTabBarVC

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setTabBar];
    [self addChildVC];
}
-(void)setTabBar{
    AutoTabBar *autoTab=[[AutoTabBar alloc]init];
    autoTab.tabBarDelegate=self;
    [self setValue:autoTab forKeyPath:@"tabBar"];
    
    UIView *customBackgroundView = [[UIView alloc] initWithFrame:CGRectMake(self.tabBar.bounds.origin.x, self.tabBar.bounds.origin.y, self.tabBar.bounds.size.width, self.tabBar.bounds.size.height+BottomHeight)];
    customBackgroundView.backgroundColor = [UIColor whiteColor];
    [[UITabBar appearance] insertSubview:customBackgroundView atIndex:0];
}

//tabbar中间按钮的点击事件
-(void)tabBarDidClickPlusButton:(AutoTabBar *)tabBa{
    NSLog(@"click");
    //这里面要present出来
    Worddancevc *worddancevc=[[Worddancevc alloc]init];
    [self presentViewController:worddancevc animated:NO completion:nil];
}

-(void)addChildVC{
    HomeVC *homevc=[[HomeVC alloc]init];
    [self setupChildVc:homevc title:@"首页" image:@"" selectedImage:@""];
     MyVC*myVC = [MyVC new];
    [self setupChildVc:myVC title:@"我的" image:@"icon_tab_mine_nor" selectedImage:@"icon_tab_mine_sel"];
   
}

- (void)setupChildVc:(UIViewController *)vc title:(NSString *)title image:(NSString *)image selectedImage:(NSString *)selectedImage
{
    vc.navigationItem.title = title;
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:vc];
    nav.tabBarItem.title=title;
    [nav.tabBarItem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor grayColor]}forState:UIControlStateNormal];//未选中
    [nav.tabBarItem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor blueColor]}forState:UIControlStateSelected];//未选中
    [self addChildViewController:nav];
}
@end

*********TabBarvc简单封装

#import "LYBTabBarVC.h"
#import "LYBMyVC.h"
@interface LYBTabBarVC ()

@end

@implementation LYBTabBarVC

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setTabBar];//更改tabbar的背景色，
    [self addChildVC];//添加子控制器
}
-(void)setTabBar{
    //    方法一,是通过插入一层view实现的
    UIView *customBackgroundView = [[UIView alloc] initWithFrame:CGRectMake(self.tabBar.bounds.origin.x, self.tabBar.bounds.origin.y, self.tabBar.bounds.size.width, self.tabBar.bounds.size.height+32)];
    customBackgroundView.backgroundColor = [UIColor whiteColor];
    [[UITabBar appearance] insertSubview:customBackgroundView atIndex:0];
}
//tabbar中间按钮的点击事件
-(void)centerBarClick{
    NSLog(@"click");
    //这里面要present出来
}
-(void)addChildVC{
    
  
    //个人中心
    LYBMyVC *myVC = [LYBMyVC new];
    [self setupChildVc:myVC title:@"我的" image:@"icon_tab_mine_nor" selectedImage:@"icon_tab_mine_sel"];
}
/**
 * 初始化子控制器
 */
- (void)setupChildVc:(UIViewController *)vc title:(NSString *)title image:(NSString *)image selectedImage:(NSString *)selectedImage
{
    // 设置文字和图片
    vc.navigationItem.title = title;
    
//    vc.tabBarItem.image = [[UIImage imageNamed:image] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
//    vc.tabBarItem.selectedImage = [[UIImage imageNamed:selectedImage] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    
    
    // 包装一个导航控制器, 添加导航控制器为tabbarcontroller的子控制器
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:vc];
    nav.tabBarItem.title=title;
    [nav.tabBarItem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor grayColor]}forState:UIControlStateNormal];//未选中
    [nav.tabBarItem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15],NSForegroundColorAttributeName:[UIColor blueColor]}forState:UIControlStateSelected];//未选中
    [self addChildViewController:nav];
}
@end


******appdelegate中
self.window=[[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
    self.window.backgroundColor=[UIColor whiteColor];
    LYBTabBarVC *tabbarvc=[[LYBTabBarVC alloc]init];
    self.window.rootViewController=tabbarvc;
    
    [self.window makeKeyAndVisible];