IMG_0081.PNG
如上圖是本文將要實現(xiàn)的界面。
沒有文字帶大按鈕的tabbar。
創(chuàng)建一個UITabBarController
#import "ICETabBarController.h"
#import "ICETabbar.h"
@interface ICETabBarController ()
@end
@implementation ICETabBarController
- (void)viewDidLoad {
[super viewDidLoad];
UIViewController *vc1 = [[UIViewController alloc]init];
vc1.view.backgroundColor = [UIColor orangeColor];
UIViewController *vc2 = [[UIViewController alloc]init];
vc2.view.backgroundColor = [UIColor whiteColor];
[self loadDefaultData:vc1 image:@"btn_index_home_selected"];
[self loadDefaultData:vc2 image:@"btn_index_wd_selected"];
//利用kvc將系統(tǒng)的tabbar替換成ICETabbar
ICETabbar *tabbar = [[ICETabbar alloc]init];
[self setValue:tabbar forKey:@"tabBar"];
[tabbar setBtnClickBlock:^{
NSLog(@"click Center");
}];
}
/**
加載vc和圖片
@param vc vc
@param img img
*/
- (void)loadDefaultData:(UIViewController *)vc image:(NSString *)img {
UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:vc];
[self addChildViewController:nav];
vc.tabBarItem.image = [UIImage imageNamed:img];
vc.tabBarItem.imageInsets = UIEdgeInsetsMake(4.5, 0, -4.5, 0);
//UIOffsetMake(CGFloat horizontal, CGFloat vertical)
//將verical設(shè)置為MAXFLOAT的時候沒有title
vc.tabBarItem.titlePositionAdjustment = UIOffsetMake(0, MAXFLOAT);
}
@end
#import <UIKit/UIKit.h>
typedef void(^ICETabBarClickBlock)();
@interface ICETabbar : UITabBar
- (void)setBtnClickBlock:(ICETabBarClickBlock)block;
@end
#import "ICETabbar.h"
#import "UIView+HKExtension.h"
@interface ICETabbar ()
@property (nonatomic, strong) UIButton *centerBtn;
@property (nonatomic, copy ) ICETabBarClickBlock block;
@end
@implementation ICETabbar
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.backgroundColor = [UIColor blueColor];
[self setBackgroundImage:[UIImage new]];
[self setShadowImage:[UIImage new]];
self.centerBtn = [[UIButton alloc]init];
[self.centerBtn setBackgroundImage:[UIImage imageNamed:@"tab_launch"]
forState:UIControlStateNormal];
[self.centerBtn setBackgroundImage:[UIImage imageNamed:@"tab_launch"]
forState:UIControlStateHighlighted];
self.centerBtn.size = self.centerBtn.currentBackgroundImage.size;
[self.centerBtn addTarget:self action:@selector(centerBtnDidClick) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:self.centerBtn];
}
return self;
}
- (void)centerBtnDidClick {
if (self.block) {
self.block();
}
}
- (void)setBtnClickBlock:(ICETabBarClickBlock)block {
self.block = block;
}
- (void)layoutSubviews {
[super layoutSubviews];
//系統(tǒng)自帶的按鈕類型是UITabBarButton，找出這些類型的按鈕，然后重新排布位置，空出中間的位置
Class class = NSClassFromString(@"UITabBarButton");
self.centerBtn.centerX = self.centerX;
//調(diào)整中間按鈕的中線點Y值
self.centerBtn.centerY = (self.height - (self.centerBtn.height - self.height)) * 0.5;
NSInteger btnIndex = 0;
for (UIView *btn in self.subviews) {//遍歷tabbar的子控件
if ([btn isKindOfClass:class]) {//如果是系統(tǒng)的UITabBarButton，那么就調(diào)整子控件位置，空出中間位置
//按鈕寬度為TabBar寬度減去中間按鈕寬度的一半
btn.width = (self.width - self.centerBtn.width) * 0.5;
//中間按鈕前的寬度,這里就3個按鈕，中間按鈕Index為1
if (btnIndex < 1) {
btn.x = btn.width * btnIndex;
} else { //中間按鈕后的寬度
btn.x = btn.width * btnIndex + self.centerBtn.width;
}
btnIndex++;
//如果是索引是0(從0開始的)，直接讓索引++，目的就是讓消息按鈕的位置向右移動，空出來中間按鈕的位置
if (btnIndex == 0) {
btnIndex++;
}
}
}
[self bringSubviewToFront:self.centerBtn];
}
/**
重寫hitTest方法，去監(jiān)聽中間按鈕的點擊，目的是為了讓凸出的部分點擊也有反應(yīng)
@param point 點擊point
@param event 事件
@return view
*/
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
//判斷當(dāng)前手指是否點擊到中間按鈕上，如果是，則響應(yīng)按鈕點擊，其他則系統(tǒng)處理
//首先判斷當(dāng)前View是否被隱藏了，隱藏了就不需要處理了
if (self.isHidden == NO) {
//將當(dāng)前tabbar的觸摸點轉(zhuǎn)換坐標(biāo)系，轉(zhuǎn)換到中間按鈕的身上，生成一個新的點
CGPoint newP = [self convertPoint:point toView:self.centerBtn];
//判斷如果這個新的點是在中間按鈕身上，那么處理點擊事件最合適的view就是中間按鈕
if ( [self.centerBtn pointInside:newP withEvent:event]) {
return self.centerBtn;
}
}
return [super hitTest:point withEvent:event];
}
Category
#import <UIKit/UIKit.h>
@interface UIView (HKExtension)
@property (nonatomic, assign) CGFloat x;
@property (nonatomic, assign) CGFloat y;
@property (nonatomic, assign) CGFloat width;
@property (nonatomic, assign) CGFloat height;
@property (nonatomic, assign) CGFloat centerX;
@property (nonatomic, assign) CGFloat centerY;
@property (nonatomic, assign) CGSize size;
@end
#import "UIView+HKExtension.h"
@implementation UIView (HKExtension)
- (void)setX:(CGFloat)x {
CGRect frame = self.frame;
frame.origin.x = x;
self.frame = frame;
}
- (CGFloat)x {
return self.frame.origin.x;
}
- (void)setY:(CGFloat)y {
CGRect frame = self.frame;
frame.origin.y = y;
self.frame = frame;
}
- (CGFloat)y {
return self.frame.origin.y;
}
- (void)setWidth:(CGFloat)width {
CGRect frame = self.frame;
frame.size.width = width;
self.frame = frame;
}
- (CGFloat)width {
return self.frame.size.width;
}
- (void)setHeight:(CGFloat)height {
CGRect frame = self.frame;
frame.size.height = height;
self.frame= frame;
}
- (CGFloat)height {
return self.frame.size.height;
}
- (void)setSize:(CGSize)size {
CGRect frame = self.frame;
frame.size = size;
self.frame = frame;
}
- (CGSize)size {
return self.frame.size;
}
- (void)setCenterX:(CGFloat)centerX {
CGPoint center = self.center;
center.x = centerX;
self.center = center;
}
- (CGFloat)centerX {
return self.center.x;
}
- (void)setCenterY:(CGFloat)centerY {
CGPoint center = self.center;
center.y = centerY;
self.center = center;
}
- (CGFloat)centerY {
return self.center.y;
}
利用kvc替換系統(tǒng)自帶tabbar
[self setValue:tabbar forKey:@"tabBar"];ICETabbar 大的點擊按鈕超出tabbar范圍重寫- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event ; 方法，使超出范圍可以點擊。
