1. 程式人生 > >OC 自定義tabBar實現tabBar上帶有圓形按鈕

OC 自定義tabBar實現tabBar上帶有圓形按鈕

1.建立繼承自UITabBar控制元件的類CustomTabBar,程式碼如下:

#import "CustomTabBar.h"
@interface CustomTabBar ()
@property (nonatomic, strong)UIButton *roundButton;
@end
@implementation CustomTabBar
-(instancetype)initWithFrame:(CGRect)frame{
    if (self = [super initWithFrame:frame]) {
        self.roundButton.backgroundColor = [UIColor redColor];
        self.roundButton.layer.cornerRadius = 30;
        [self.roundButton addTarget:self action:@selector(roundButtonClicked) forControlEvents:UIControlEventTouchUpInside];
        [self addSubview:self.roundButton];
    };
    return self;
}
- (UIButton *)roundButton{
    if (!_roundButton) {
        _roundButton = [[UIButton alloc]init];
    }
    return _roundButton;
}
//點選了圓形按鈕
- (void)roundButtonClicked {
    
}
- (void)layoutSubviews {
    [super layoutSubviews];
    CGFloat centerx = self.bounds.size.width * 0.5;
    CGFloat centery = self.bounds.size.height * 0.5;
    //根據情況設定中間按鈕相對於tabBar的位置
    self.roundButton.frame = CGRectMake(centerx - 30, centery - 55, 60, 60);
    
    Class class = NSClassFromString(@"UITabBarButton");
    int index = 0;
    //獲取每個UITabBarButton 的寬度,根據專案所有的tabBarButton+圓形按鈕數目來計算
    int tabWidth = self.bounds.size.width / 3;
    for (UIView *view in self.subviews) {
        //找到UITabBarButton型別子控制元件
        if ([view isKindOfClass:class]) {
            CGRect rect = view.frame;
            rect.origin.x = index * tabWidth;
            rect.size.width = tabWidth;
            view.frame = rect;
            index++;
            //留出位置放置中間凸出按鈕
            if (index == 1) {
                index++;
            }
        }
    }
}

//響應觸控事件,如果觸控位置位於圓形按鈕控制元件上,則由圓形按鈕處理觸控訊息
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event{
    //判斷tabbar是否隱藏
    if (self.hidden == NO) {
        if ([self touchPointInsideCircle:self.roundButton.center radius:30 targetPoint:point]) {
            //如果位於圓形按鈕上,則由圓形按鈕處理觸控訊息
            return self.roundButton;
        }
        else{
            //否則系統預設處理
            return [super hitTest:point withEvent:event];
        }
    }
    return [super hitTest:point withEvent:event];
}

- (BOOL)touchPointInsideCircle:(CGPoint)center radius:(CGFloat)radius targetPoint:(CGPoint)point
{
    CGFloat dist = sqrtf((point.x - center.x) * (point.x - center.x) +
                         (point.y - center.y) * (point.y - center.y));
    return (dist <= radius);
}

2.建立繼承自UITabBarController的類BaseTabBarController,通過kvc的方法替換掉原始的tabbar:

#import "BaseTabBarViewController.h"
#import "CustomTabBar.h"
@interface BaseTabBarViewController ()

@end

@implementation BaseTabBarViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    [self setValue:[CustomTabBar new] forKey:@"tabBar"];
}```
3.在AppDelegate.h和AppDelegate.m檔案中進行專案配置:

#import <UIKit/UIKit.h>
#import “BaseTabBarViewController.h”
@interface AppDelegate : UIResponder

@property (strong, nonatomic) UIWindow *window;
@property (nonatomic, strong) BaseTabBarViewController *tabBarController;
@end


#import “AppDelegate.h”
@interface AppDelegate ()

@end

@implementation AppDelegate

  • (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Override point for customization after application launch.
    UIViewController *v1 = [[UIViewController alloc]init];
    v1.view.backgroundColor = [UIColor whiteColor];
    UINavigationController *n1 = [[UINavigationController alloc]initWithRootViewController:v1];
    UIViewController *v3 = [[UIViewController alloc]init];
    v3.view.backgroundColor = [UIColor whiteColor];
    UINavigationController *n2 = [[UINavigationController alloc]initWithRootViewController:v3];

    self.tabBarController = [[BaseTabBarViewController alloc]init];
    self.tabBarController.viewControllers = @[n1,n2];

    UITabBar *tabBar = self.tabBarController.tabBar;

    UITabBarItem *item1 = [tabBar.items objectAtIndex:0];
    item1.title = @“item1”;

    UITabBarItem *item2 = [tabBar.items objectAtIndex:1];
    item2.title = @“item2”;

    self.window.rootViewController = self.tabBarController;

    return YES;
    }