鑒于評論中的問題,本人又寫已一遍demo,暫時沒有發(fā)現(xiàn)大家提出item順序錯誤與圖片變大等問題.
現(xiàn)已將demo上傳,大家可下載查看.demo鏈接
若有其他問題,可提供demo鏈接供我查看.

------- 前言 ------

現(xiàn)在制作TabBar中間凸出按鈕的方法一般都是自定義一個tabBar,然后在進行其他處理,這方面的文章很多,就不多說.

今天我們介紹一種使用原生UITabBar制作中間凸出Item的方法,個人感覺方便快捷.

先看效果

QQ20180829-153018.gif

第一步:

和普通tabbar一樣,設(shè)置UITabBarViewController的viewControllers和tabBarItem的樣式;

image.png

第二步:

在TabBarViewVController中重寫viewDidLayoutSubviews方法,在此方法中,調(diào)整中間item的imageInsets,這是系統(tǒng)自帶的.

image.png

第二步(修改)

因為發(fā)現(xiàn)在來回切換tabbarItem的時候,Item地址存在變化,原因未明(估計是系統(tǒng)內(nèi)部淺拷貝的原因),故而修改手勢添加的位置.修改為在TabBarViewVController的delegate協(xié)議中的- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController中添加,避免系統(tǒng)內(nèi)部每次拷貝導致手勢響應(yīng)丟失,看下圖;

image.png

第三步:

創(chuàng)建UIBarItem的Category文件,使用KVC獲取View

image.png

image.png

第四步:

創(chuàng)建UITabBarItem的Category文件,獲取系統(tǒng)展示item展示圖片的UIImageView,此處可運行時綁定Item的雙擊事件

image.png

image.png

第五步:

創(chuàng)建UITabBar的Category文件,重寫響應(yīng)鏈

image.png

拓展:

可在手勢響應(yīng)方法中制作旋轉(zhuǎn)等動畫,因為重寫了響應(yīng)鏈,手勢的tap.view就是UIImageView;或者直接使用UITabBarItem的Category定義的方法獲取UIImageView.

附代碼,直接拷貝拿去用吧,代碼少,就不上傳Demo了

• *** UIBarItem的Category文件 ***

 - (UIView *)gs_view {
    return [self valueForKey:@"view"];
}

• *** UITabBarItem的Category文件 ***

/**
 *  雙擊 tabBarItem 時的回調(diào)，默認為 nil箕憾。
 *  @arg tabBarItem 被雙擊的 UITabBarItem
 *  @arg index      被雙擊的 UITabBarItem 的序號
 */
@property(nonatomic, copy) void (^gs_doubleTapBlock)(UITabBarItem *tabBarItem, NSInteger index);

/**
 * 獲取一個UITabBarItem內(nèi)顯示圖標的UIImageView铝宵，如果找不到則返回nil
 * @warning 需要對nil的返回值做保護
 */
- (UIImageView *)gs_imageView;

+ (UIImageView *)gs_imageViewInTabBarButton:(UIView *)tabBarButton;

- (UIImageView *)gs_imageView {
    return [self.class gs_imageViewInTabBarButton:self.gs_view];
}

+ (UIImageView *)gs_imageViewInTabBarButton:(UIView *)tabBarButton {
    
    if (!tabBarButton) {
        return nil;
    }
    
    for (UIView *subview in tabBarButton.subviews) {
        // iOS10及以后竹习，imageView都是用UITabBarSwappableImageView實現(xiàn)的蝇摸，所以遇到這個class就直接拿
        if ([NSStringFromClass([subview class]) isEqualToString:@"UITabBarSwappableImageView"]) {
            return (UIImageView *)subview;
        }
        
        if (IOS_VERSION < 10) {
            // iOS10以前，選中的item的高亮是用UITabBarSelectionIndicatorView實現(xiàn)的校哎，所以要屏蔽掉
            if ([subview isKindOfClass:[UIImageView class]] && ![NSStringFromClass([subview class]) isEqualToString:@"UITabBarSelectionIndicatorView"]) {
                return (UIImageView *)subview;
            }
        }
    }
    return nil;
}

static char kAssociatedObjectKey_doubleTapBlock;

- (void)setGs_doubleTapBlock:(void (^)(UITabBarItem *, NSInteger))gs_doubleTapBlock {
    objc_setAssociatedObject(self, &kAssociatedObjectKey_doubleTapBlock, gs_doubleTapBlock, OBJC_ASSOCIATION_COPY_NONATOMIC);
}

- (void (^)(UITabBarItem *, NSInteger))gs_doubleTapBlock {
    return (void (^)(UITabBarItem *, NSInteger))objc_getAssociatedObject(self, &kAssociatedObjectKey_doubleTapBlock);
}

• *** UITabBar的Category文件 ***

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
    if (!self.isUserInteractionEnabled || self.isHidden || self.alpha <= 0.01) {
        return nil;
    }
    
    if (self.items.count < 2) {
        return [super hitTest:point withEvent:event];
    }
    
    UITabBarItem *item = self.items[2];
    UIImageView *itemImageView  = [item gs_imageView];
    
    if (!itemImageView) {
        return [super hitTest:point withEvent:event];
    }
    
    UIView *view = [super hitTest:point withEvent:event];
    if (view == nil){
        //轉(zhuǎn)換坐標
        CGPoint tempPoint = [itemImageView convertPoint:point fromView:self];
        //判斷點擊的點是否在按鈕區(qū)域內(nèi)
        if (CGRectContainsPoint(itemImageView.bounds, tempPoint)){
            //返回按鈕
            return itemImageView;
        }
        
        //******************    或者使用這個方法     ****************
        
        //判斷如果這個新的點是在發(fā)布按鈕身上薄辅，那么處理點擊事件最合適的view就是發(fā)布按鈕
        if ([itemImageView pointInside:point withEvent:event]) {
            return itemImageView;
        }else{//如果點不在發(fā)布按鈕身上，直接讓系統(tǒng)處理就可以了
            return [super hitTest:point withEvent:event];
        }
    }
    return view;
}