ios定製中間突出的tabBar
阿新 • • 發佈:2019-01-06
先展示效果圖:
這個tabBar糾結了我好久,最後通過查詢資料各種百度谷歌終於找到一個比較符合我們需求的案例,下面展示出程式碼供各位參考
@interface BaseTabBarViewController ()<UITabBarControllerDelegate> @property (nonatomic,strong)UIButton *button; @end @implementation BaseTabBarViewController @synthesize button; #pragma mark- setup -(void)setup { // 新增突出按鈕 [self addCenterButtonWithImage:[UIImage imageNamed:@"我的錢"] selectedImage:[UIImage imageNamed:@"我的錢"]]; // UITabBarControllerDelegate 指定為自己 self.delegate=self; // 指定當前頁——中間頁 //self.selectedIndex=0; // 設點button狀態 //button.selected=YES; // 設定其他item點選選中顏色 } #pragma mark - addCenterButton // Create a custom UIButton and add it to the center of our tab bar -(void) addCenterButtonWithImage:(UIImage*)buttonImage selectedImage:(UIImage*)selectedImage { button = [UIButton buttonWithType:UIButtonTypeCustom]; [button addTarget:self action:@selector(pressChange:) forControlEvents:UIControlEventTouchUpInside]; button.autoresizingMask = UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleTopMargin; // 設定button大小為適應圖片 button.frame = CGRectMake(0.0, 0.0, buttonImage.size.width, buttonImage.size.height); [button setImage:buttonImage forState:UIControlStateNormal]; [button setImage:selectedImage forState:UIControlStateSelected]; // 這個比較噁心 去掉選中button時候的陰影 button.adjustsImageWhenHighlighted=NO; /* * 核心程式碼:設定button的center 和 tabBar的 center 做對齊操作, 同時做出相對的上浮 */ CGPoint center = self.tabBar.center; center.y = center.y - buttonImage.size.height/4; button.center = center; [self.view addSubview:button]; } -(void)pressChange:(id)sender { self.selectedIndex=1; button.selected=YES; } #pragma mark- TabBar Delegate // 換頁和button的狀態關聯上 - (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController { if (self.selectedIndex==1) { button.selected=YES; }else { button.selected=NO; } }
- (void)viewDidLoad { [super viewDidLoad]; [self setTabBarVC]; [self setup]; [self addButtonNotifation]; self.tabBar.barTintColor = [UIColor whiteColor]; } //新增大圓按鈕的通知 -(void)addButtonNotifation{ [[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(buttonHidden) name:@"buttonNotifationCenter" object:nil]; [[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(buttonNotHidden) name:@"buttonNotHidden" object:nil]; } -(void)buttonNotHidden{ button.hidden=NO; } -(void)buttonHidden{ button.hidden=YES; } // 初始化所有子控制器 - (void)setTabBarVC{ [self setTabBarChildController:[[SelectionViewController alloc] init] title:@"每月送" image:@"每月送" selectImage:@"每月送選中"]; [self setTabBarChildController:[[MyMoneyViewController alloc] init] title:@"我的錢" image:@"" selectImage:@""]; [self setTabBarChildController:[[MainViewController alloc] init] title:@"個人中心" image:@"個人中心" selectImage:@"個人中心選中"]; } // 新增tabbar的子viewcontroller - (void)setTabBarChildController:(UIViewController*)controller title:(NSString*)title image:(NSString*)imageStr selectImage:(NSString*)selectImageStr{ UINavigationController* nav = [[UINavigationController alloc] initWithRootViewController:controller]; nav.tabBarItem.title = title; nav.tabBarItem.image = [[UIImage imageNamed:imageStr]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]; nav.tabBarItem.selectedImage = [[UIImage imageNamed:selectImageStr]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]; [nav.tabBarItem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:10],NSForegroundColorAttributeName:RGBA(74, 74, 74, 1.0)} forState:UIControlStateNormal]; [nav.tabBarItem setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:10],NSForegroundColorAttributeName:RGBA(255, 200, 0, 1.0)} forState:UIControlStateSelected]; [self addChildViewController:nav]; }
tabBar的顏色各位可以用一張白色的圖片做背景
關於那個隱藏大圓按鈕的通知,我發現導航推進下一頁的時候那個大圓按鈕不會消失,我就只好用了一個通知控制隱藏和顯示如果各位有更好的方法也希望能夠告知,共同進步