iOS階段學習第33天筆記(自定義標簽欄(tabBar)介紹)

2019-11-14 18:25:37

字體：大中小

來源：轉載

供稿：網友

iOS學習(UI)知識點整理

一、自定義標簽欄

1、方法一單個創建標簽欄

 1 #import "AppDelegate.h" 2 #import "SecondViewController.h" 3 #import "ViewController.h" 4 #import "ThirdViewController.h" 5 #import "ForthViewController.h" 6 #import "ViewController1.h" 7 #import "ViewController2.h" 8 #import "ViewController3.h" 9 #import "ViewController4.h"10 @interface AppDelegate ()<UITabBarControllerDelegate> 11 @end12 13 @implementation AppDelegate 14 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {15     //1.直接設置默認的標簽的屬性16     UINavigationController *navi1 = [[UINavigationController alloc]initWithRootViewController:[ViewController new]];17     //設置navi1所對應的界面的標簽的標題18     navi1.tabBarItem.title = @"home";19     //設置navi1所對應的標簽的圖標20     navi1.tabBarItem.image = [[UIImage imageNamed:@"tabbar_account_PRess"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];21     //2.直接創建一個新的標簽22     UIViewController *vc1 = [ViewController1 new];23     //創建的方式里面包含三個參數:文字標題,普通狀態下的圖片,選中狀態下的圖片24     UITabBarItem *item = [[UITabBarItem alloc]initWithTitle:@"界面二"  image:[UIImage imageNamed:@"tabbar_appfree"] 
       selectedImage:[UIImage imageNamed:@"tabbar_account"]];25     vc1.tabBarItem = item;26     //設置數字徽標,用來提示用戶27     item.badgeValue = @"20";28     //設置系統圖標右上角的數字29     [[UIApplication sharedApplication] setApplicationIconBadgeNumber:55];30 31 32     //3.創建標簽的另一種方式33     UINavigationController *navi2 = [[UINavigationController alloc]initWithRootViewController:[ViewController2 new]];34     //參數:標題和圖片35     UITabBarItem *item2 = [[UITabBarItem alloc]initWithTitle:@"界面三" image:[UIImage imageNamed:@"tabbar_reduceprice"] tag:100];36     item2.selectedImage = [UIImage imageNamed:@"tabbar_subject"];37     navi2.tabBarItem = item2; 38 39 40     //4.他們系統樣式的標簽41     UINavigationController *navi3 = [[UINavigationController alloc]initWithRootViewController:[ViewController3 new]];42     //使用系統的樣式創建標簽,圖片和文字都無法修改43     navi3.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemDownloads tag:200];44     //無法修改45     navi3.tabBarItem.title = @"界面四";46     UINavigationController *navi4 = [[UINavigationController alloc]initWithRootViewController:[ViewController4 new]];47     navi4.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemFeatured tag:101];48     49     //如果創建的標簽數量大于5個,則從第5個開始(包括第5個)都會被放到More標簽中50     UINavigationController *navi5 = [[UINavigationController alloc]initWithRootViewController:[SecondViewController new]];51     navi5.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemHistory tag:101];52     53     //創建標簽欄控制器54     UITabBarController *tabbar = [[UITabBarController alloc]init];55     //設置標簽欄控制器所管理的視圖控制器56     tabbar.viewControllers = @[navi1,vc1,navi2,navi3,navi4,navi5]; 57     NSInteger index = [[[NSUserDefaults standardUserDefaults]valueForKey:@"selectedindex"] integerValue];58      //設置tabbar選中的標簽59     tabbar.selectedIndex = index;60     tabbar.delegate = self;61     self.window.rootViewController = tabbar;62     self.window.backgroundColor = [UIColor whiteColor];63     return YES;64 }65 66 //選中某一個視圖控制器的時候,調用該方法67 - (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController68 {69     [[NSUserDefaults standardUserDefaults]setValue:@(tabBarController.selectedIndex) forKey:@"selectedindex"];70     [[NSUserDefaults standardUserDefaults]synchronize];71     NSLog(@"%@",viewController);72 }73 74 //自定義視圖控制器完成的時候調用75 - (void)tabBarController:(UITabBarController *)tabBarController didEndCustomizingViewControllers:(NSArray *)viewControllers 
     changed:(BOOL)changed76 {77     NSLog(@"%@",viewControllers); 78 }79 @end

2、方法二循環遍歷創建標簽欄

1）創建一個繼承自UIButton的類 MyTabbBarItem 用于創建標簽欄的按鈕

MyTabbBarItem.h 文件中的代碼實現

1 #import <UIKit/UIKit.h>2  @interface MyTabbBarItem : UIButton3  @end

2） MyTabbBarItem.m 文件中的代碼實現

 1 #import "MyTabbBarItem.h" 2 @implementation MyTabbBarItem 3 - (instancetype)initWithFrame:(CGRect)frame 4 { 5     self = [super initWithFrame:frame]; 6     if (self) { 7         self.titleLabel.font = [UIFont systemFontOfSize:12]; 8         self.titleLabel.textAlignment = NSTextAlignmentCenter; 9         [self setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];10         [self setTitleColor:[UIColor whiteColor] forState:UIControlStateSelected];11     }12     return self;13 }14  15 //這個方法返回的cgrect是按鈕上的title部分的位置和大小16 - (CGRect)titleRectForContentRect:(CGRect)contentRect17 {18     return CGRectMake(0, 30, contentRect.size.width, 15);19 }20 21 - (CGRect)imageRectForContentRect:(CGRect)contentRect22 {23     return CGRectMake((contentRect.size.width - 26)/2, 2, 26, 26);24 }

3）自定義標簽欄的類 MyTabBarController.h 代碼實現

1 #import <UIKit/UIKit.h>2 @interface MyTabBarController : UITabBarController3 4 @end

4）自定義標簽欄的類 MyTabBarController.m 代碼實現

  1 #import "MyTabBarController.h"  2 #import "ViewController.h"  3 #import "ViewController1.h"  4 #import "ViewController2.h"  5 #import "ViewController3.h"  6 #import "ViewController4.h"  7 #import "MyTabbBarItem.h"  8   9 @interface MyTabBarController () 10 { 11     UIImageView *_myTabbar; 12 } 13 @end 14  15 @implementation MyTabBarController 16  17 - (void)viewDidLoad { 18     [super viewDidLoad]; 19      20     //配置標簽欄控制器 21     //自定義標簽欄的步驟 22      23     //1.隱藏系統的標簽欄 24     self.tabBar.hidden = YES; 25      26     //3.創建所有的視圖控制器 27     [self createViewControllers]; 28      29     //2.創建一個新標簽欄 30     [self createTabbar]; 31      32     //4.創建所有標簽 33     [self createTabs]; 34      35     //5.標簽和視圖控制器進行關聯      36      37 } 38  39 -(void)createTabbar 40 { 41     CGRect frame = [[UIScreen mainScreen]bounds]; 42     frame.origin.y = frame.size.height - 49; 43     frame.size.height = 49; 44      45     _myTabbar = [[UIImageView alloc]initWithFrame:self.tabBar.bounds]; 46      47     _myTabbar.backgroundColor = [UIColor blueColor]; 48     49     //將自定義標簽欄添加在系統標簽欄上 50     [self.tabBar addSubview:_myTabbar]; 51     _myTabbar.userInteractionEnabled = YES;} 54 -(void)createViewControllers 56 { 57     NSArray *vcArray = @[@"ViewController", 58                          @"ViewController1", 59                          @"ViewController2", 60                          @"ViewController3", 61                          @"ViewController4"]; 62      63     NSMutableArray *vcs = [[NSMutableArray alloc]init]; 64     for (int i = 0; i<vcArray.count; i++) { 65         //反射(將字符串對象轉換成對應的類對象) 66         UIViewController *vc = [[NSClassFromString(vcArray[i]) alloc]init]; 67         vc.navigationItem.title = vcArray[i]; 68         UINavigationController *navi = [[UINavigationController alloc]initWithRootViewController:vc]; 69         [vcs addObject:navi]; 70     } 71     self.viewControllers = vcs; 72 } 73  74 -(void)createTabs 75 { 76     NSArray *titleArray = @[@"首頁",@"社會",@"金融",@"法制",@"教育"]; 77     NSArray *imageArray = @[@"tabbar_account", 78                             @"tabbar_appfree", 79                             @"tabbar_limitfree", 80                             @"tabbar_reduceprice", 81                             @"tabbar_subject"]; 82     NSArray *imageSelectedArray = @[@"tabbar_account_press", 83                             @"tabbar_appfree_press", 84                             @"tabbar_limitfree_press", 85                             @"tabbar_reduceprice_press", 86                             @"tabbar_subject_press"]; 87      88      89     for (int i = 0; i<titleArray.count; i++) { 90         MyTabbBarItem *btn = [MyTabbBarItem buttonWithType:UIButtonTypeCustom]; 91         [btn setTitle:titleArray[i] forState:UIControlStateNormal]; 92         [btn setImage:[UIImage imageNamed:imageArray[i]] forState:UIControlStateNormal]; 93         [btn setImage:[UIImage imageNamed:imageSelectedArray[i]] forState:UIControlStateSelected]; 94         if (i == 0) { 95             btn.selected = YES; 96         } 97         CGFloat width = [[UIScreen mainScreen]bounds].size.width/5; 98         btn.frame = CGRectMake(width * i, 0, width, 49); 99         [_myTabbar addSubview:btn];100         btn.tag = 100 + i;101         [btn addTarget:self action:@selector(selectAction:) forControlEvents:UIControlEventTouchUpInside]; 103     } 105 }106 107 -(void)selectAction:(UIButton *)btn108 {109     NSInteger index = btn.tag - 100;110     self.selectedIndex = index; 112     for (UIButton *btn in _myTabbar.subviews) {113         btn.selected = NO;114     } 116     //設置selected屬性117     btn.selected = YES;118 }119  120 @end

5）AppDelegate.m 文件中的代碼實現

1 //系統自帶的標簽的高度是492 //可以自定義標簽來設置不同高度的標簽欄3 //此處不能指定導航欄否則標簽欄無法顯示，因為后面會指定導航欄4 MyTabBarController *tabbar = [[MyTabBarController alloc]init];5 self.window.rootViewController = tabbar;6 self.window.backgroundColor = [UIColor whiteColor];7 return YES;

3、UITabbarController的視圖層級關系;利用Window 實現QQ右側菜單視圖功能

1）AppDelegate.m 代碼實現

 1  #import "AppDelegate.h" 2  #import "ViewController.h"  3 @interface AppDelegate () 4 { 5     UIWindow *_w; 6 } 7 @end  8 @implementation AppDelegate  9 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {  10     _w = [[UIWindow alloc]initWithFrame:[[UIScreen mainScreen]bounds]];11     _w.backgroundColor = [UIColor purpleColor];          _w.rootViewController = [RootViewController new];     12     [_w makeKeyAndVisible];      13     UITabBarController *tabbar = [[UITabBarController alloc]init]; 14     UINavigationController *navi = [[UINavigationController alloc]initWithRootViewController:[ViewController new]];15     navi.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemContacts tag:100]; 16     tabbar.viewControllers = @[navi];     17     self.window.rootViewController = tabbar;18     self.window.backgroundColor = [UIColor clearColor]; 19     return YES;20 }

2）ViewController.m window切換代碼實現

 1 #import "ViewController.h"  2 @interface ViewController ()  3 @end  4 @implementation ViewController  5 - (void)viewDidLoad { 6     [super viewDidLoad];  7     self.view.backgroundColor = [UIColor blueColor]; 8     self.title = @"首頁";  9     UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 100, 300)];10     label.backgroundColor = [UIColor redColor];11     [self.view addSubview:label];12     13     self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemBookmarks
       target:self action:@selector(testAciton)];14     15 }16 17 -(void)testAciton18 {19     UIView *window = self.navigationController.tabBarController.view.superview;  20     [UIView animateWithDuration:1.0 animations:^{21         window.center = CGPointMake(300, 240);22         window.transform = CGAffineTransformScale(window.transform, 0.8, 0.8);23     }];24     25     //視圖層級關系26     UIView *layoutContainerView = window.subviews[0]; 27     UIView *transitionView = layoutContainerView.subviews[0]; 28     UIView *wrapperView = transitionView.subviews[0]; 29     UIView *layoutView = wrapperView.subviews[0]; 30     UIView *naviTransitionView = layoutView.subviews[0]; 31     UIView *naviWrapperView = naviTransitionView.subviews[0];  32     UIView *uiview = naviWrapperView.subviews[0]; 33     NSLog(@"%@",uiview.subviews); 34     //判斷兩個視圖坐標是否重合或發生碰撞35     //CGRectIntersectsRect(<#CGRect rect1#>, <#CGRect rect2#>);   36 }

3）RootViewController.m 右側展現視圖代碼實現

 1 #import "RootViewController.h" 2 @interface RootViewController () 3 @end 4 @implementation RootViewController 5 - (void)viewDidLoad { 6     [super viewDidLoad];      7     self.view.backgroundColor = [UIColor yellowColor]; 8      9     UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];10     btn.frame = CGRectMake(10, 100, 300, 50);11     btn.backgroundColor = [UIColor whiteColor];12     [self.view addSubview:btn];13     [btn addTarget:self action:@selector(clickAction) forControlEvents:UIControlEventTouchUpInside];14 }15 -(void)clickAction16 {17     NSLog(@"==============");18 }