iOS Basics (ix)--Custom Uitabbar

The previous article talked about Uitabbarviewcontroller, and then said Uitabbarviewcontroller how to customize Tabbar.

Today, the copy of the microblog, found that the bottom of the tabbar in the middle of the button and other different, button large and coloring; and we usually work in a lot of similar problems, some apps have a look like standard Tabbarcontroller, but, the Middle of the TabBar is raised or coloured . What can we do to build this realistic effect?

These tab bars appear to be fairly standard in addition to the middle, so we start with a standard containing a tabbar uitabbarcontroller, and looking at the images inside the app, it's clear that the middle tag is a simple custom button, A uitabbar contains an array of Uitabbaritems, Uitabbaritem inherits from Uibaritem. But unlike Uibarbuttonitem, which also inherits from Uibaritem, Apple officially does not provide an API for Uitabbaritem to create custom views.

Our basic solution is to subclass Uitabbarcontroller and then add a custom button to Uitabbar above.

Code Implementation : (Here I use the second picture example)

1 //2 //TABBARVIEWCONTROLLER.M3 //WeiBo4 //5 //Created by Oran Wu on 15-11-18.6 //Copyright (c) 2015 xinxin. All rights reserved.7 //8 9 #import "TabBarViewController.h"Ten #import "ViewAdditions.h" One #import "AddViewController.h" A  - @interfaceTabbarviewcontroller () <UITabBarControllerDelegate>{ -  theUitabbar *TabBar; -Uiimageview *Tabbarview; -UIButton *Lastselectedbutton; -  +UILabel *Titlelabel; -  + } A  at @end -  - @implementationTabbarviewcontroller -  -  -- (void) Viewdidload { in [Super Viewdidload]; -     //Do any additional setup after loading the view. to      +     //hide the original Tabbar -Self.tabBar.hidden =YES; the  *     //Create a Tabbarview alternative to the original Tabbar at the bottom $Tabbarview =[[uiimageview Alloc] initWithFrame: (cgrect) {0, self.view.height- $, Self.view.width, $}];Panax Notoginseng [Self.view Addsubview:tabbarview]; -     //can interact thetabbarview.userinteractionenabled =YES; +      A     //create a common four Tabbarbutton the[Self Creatbuttonwithnormalname:@"Tabbar_home"Andselectedname:@"tabbar_home_selected"Andtitle:@"Home Page"Andindex:0]; +[Self Creatbuttonwithnormalname:@"Tabbar_message_center"Andselectedname:@"tabbar_message_center_selected"Andtitle:@"message"Andindex:1]; -[Self Creatbuttonwithnormalname:@"Tabbar_discover"Andselectedname:@"tabbar_discover_selected"Andtitle:@"found"Andindex:2]; $[Self Creatbuttonwithnormalname:@"Tabbar_profile"Andselectedname:@"tabbar_profile_selected"Andtitle:@"I'm"Andindex:3]; $[Self Creatcenterbutton:@"Jia"]; -      -     //notice is used here to hide Tabbar when switching pages the[[Nsnotificationcenter Defaultcenter] addobserver:self selector: @selector (hidetabbar:) Name:@"Hidetabbar" Object: nil]; -[[Nsnotificationcenter Defaultcenter] addobserver:self selector: @selector (showtabbar) Name:@"Showtapbar" Object: nil];Wuyi } the  -- (void) Hidetabbar: (Nsnotification *) notification{ Wu  //NSNumber *number = notification.object; -      AboutTabbarview.hidden =YES; $ } -  -- (void) showtabbar{ -  ATabbarview.hidden =NO; + } the  - //custom method to set a picture of button two states $- (void) Creatbuttonwithnormalname: (nsstring*) Normal andselectedname: (nsstring*) Selected Andtitle: (nsstring*) Title theAndindex: (int) index{ the  the     //Initialize button theUIButton *button =[UIButton Buttonwithtype:uibuttontypecustom]; -Button.tag = index+ -; in  theCGFloat buttonwidth = tabbarview.width/5; theCGFloat buttonheight =Tabbarview.height; About     //Set the button position and size, note: To leave the position of the middle special button the     if(index<2) { theButton.frame = (cgrect) { -+ -*index,0, buttonwidth,buttonheight}; the}Else +Button.frame = (cgrect) { -+ -* (index+1),0, buttonwidth,buttonheight}; -     the [button Setimage:[uiimage Imagenamed:normal] forstate:uicontrolstatenormal];Bayi [button Setimage:[uiimage imagenamed:selected] forstate:uicontrolstateselected]; the      the     //Set Buttonlabel (tabbar text) -[Button.titlelabel Setfont:[uifont Systemfontofsize:Ten]]; - [button Settitle:title forstate:uicontrolstatenormal]; the[Button Settitlecolor:[uicolor Colorwithwhite:0.5Alpha1] forstate:uicontrolstatenormal]; the [button Settitlecolor:[uicolor Orangecolor] forstate:uicontrolstateselected]; the  the[Button settitleedgeinsets: (uiedgeinsets) { $, - -,0, -}]; -      the     //button Action the [button addtarget:self action: @selector (Changeviewcontroller:) forcontrolevents:uicontroleventtouchupinside]; theButton.imageView.contentMode =Uiviewcontentmodecenter;94 [Tabbarview Addsubview:button]; the      theUIButton *BT = tabbarview.subviews[0]; the [self CHANGEVIEWCONTROLLER:BT];98      About } - 101- (void) Creatcenterbutton: (nsstring*) centerimage{102 103     //Initialize Intermediate Special button104UIButton *centerbutton =[UIButton Buttonwithtype:uibuttontypecustom]; the     //Location and Size106Centerbutton.frame = (cgrect) {148,6, the, tabbarview.height-6};107     //Image108 [Centerbutton setimage:[uiimage imagenamed:centerimage] forstate:uicontrolstatenormal];109     //Action the [Centerbutton addtarget:self Action: @selector (Addviewcontroller) forcontrolevents:uicontroleventtouchupinside ];111     //add to Tabbarview. the [Tabbarview Addsubview:centerbutton];113  the } the  the //Change page and Button's Action Association on117- (void) Changeviewcontroller: (uibutton*) button {118     119     if(Self.selectedindex = = button.tag- -) { -         return;121     }122   123Self.selectedindex = button.tag- -;124      thebutton.selected =YES;126     127     if(Lastselectedbutton! =button) { -lastselectedbutton.selected =NO;129     } theLastselectedbutton =button;131      theSelf.tabBarController.selectedViewController =[Self.tabBarController.viewControllers ObjectAtIndex:self.selectedIndex];133     134 }135 136 //middle button click action137- (void) addviewcontroller{138Addviewcontroller *ADDVC =[[Addviewcontroller alloc] init];139 [self PRESENTVIEWCONTROLLER:ADDVC animated:yes completion:nil]; $ 141}

iOS Basics (ix)--Custom Uitabbar