您的位置:首页 > 产品设计 > UI/UE

UITabBarController来管理多个UIViewController以及导航栏的加入

2016-01-22 18:43 447 查看
1导航控制器
//AppDelegate.m 中 -(BOOL)application:(UIApplication *)application didFinishLaunchingWidthOption:(NSDictionary *)launchOptions
//第一个视图作为根视图控制器
FirstViewController *fvc = [[FirstViewController alloc] init];
//导航控制器用来管理多个界面
//结构: 多个界面放到导航控制器中实现切换
//创建的时候放上第一个界面
UINavigationController *nc = [[UINavigationController alloc] initWithRootViewController:fvc];
//把导航控制器作为根视图控制器
self.window.rootViewController = nc;
self.window.backgroundColor = [UIColor whiteColor];
[self.window makeKeyAndVisible];

//ViewController的页面里面写前往下一个页面监听事件,和返回前一个页面的监听事件
-(void)nextButtonClick
{
SecondViewController *svc = [[SecondViewController alloc] init];
//如何利用导航控制器切换
//拿到导航控制器的指针
//这是属性表示视图控制器是那个导航控制器管理的
[self.navigationController pushViewController:svc animated:YES];
}

-(void)backButtonClick
{
//从当前界面直接跳转到根视图控制器
[self.navigationController popToRootViewControllerAnimated:YES];

//如何从当前界面切换到前面的任意界面
//第一个参数: 传入要切换的视图控制器
//数组为导航控制器管理的所有界面
NSArray *array = self.navigationController.viewControllers;
[self.navigationController popToViewController:array[1] animated:YES];

//需求: 手动的返回上一个界面
[self.navigationController popViewControllerAnimated:YES];
}

2.标签控制器
//标签控制器主要管理个个导航控制器,每一个导航控制器对应一个主页面,
//一个导航控制器管理一个主界面,以及其下面的页面(进入页面,返回页面)

//显示第一个界面, 加入导航控制器
MainViewController *mvc = [[MainViewController alloc] init];
//设置title显示导航条上
mvc.title = @"主界面";
mvc.tabBarItem.image = [UIImage imageNamed:@"tab_0.png"];
//创建导航控制器, 让导航控制器管理mvc
//  设置一个普通视图控制器作为根视图控制器
UINavigationController *nc1 = [[UINavigationController alloc] initWithRootViewController:mvc];

//创建第二个界面
ContactsViewController *cvc = [[ContactsViewController alloc] init];
cvc.title = @"联系人";
cvc.tabBarItem.image = [UIImage imageNamed:@"tab_1.png"];
UINavigationController *nc2 = [[UINavigationController alloc] initWithRootViewController:cvc];

//第三个界面
DynamicViewController *dvc = [[DynamicViewController alloc] init];
dvc.title = @"动态";
dvc.tabBarItem.image = [UIImage imageNamed:@"tab_2.png"];
UINavigationController *nc3 = [[UINavigationController alloc] initWithRootViewController:dvc];

//第四个界面
SettingViewController *svc = [[SettingViewController alloc] init];
svc.title = @"设置";
svc.tabBarItem.image = [UIImage imageNamed:@"tab_3.png"];
UINavigationController *nc4 = [[UINavigationController alloc] initWithRootViewController:svc];

//创建标签栏
UITabBarController *tbc = [[UITabBarController alloc] init];
tbc.viewControllers = @[nc1,nc2,nc3,nc4];

self.window.rootViewController = tbc;
//标签栏默认高度49
[tbc.tabBar setBackgroundImage:[UIImage imageNamed:@"tabbar.png"]];
//设置选中的颜色
tbc.tabBar.tintColor = [UIColor redColor];

self.window.backgroundColor = [UIColor whiteColor];
return YES;

3.导航控制器和标签控制器核心内容
//导航控制器和标签控制器只一个应用的整体布局,一般写在AppDelegate.m
1 每一个UINavigationController都有一个navigationBar这是一个导航条的整体背景和布局,如果改变了,导航控制器下面所有页面的导航条都会改变

2 每一个页面里面都会有navigationItem,leftBarButtonItem和rightBarButtonItem属性,导航控制器的navigationBar布局时候,会自动调用每个页面里面这些属性,进行布局.所有导致如果使用系统的,很难修改布局.

3 每一个UITabBarController都有一个tabBar这个功能与导航控制器很像,是对这个标签控制器下面的页面整体背景和布局

4 每个页面都会有一个tabBarItem的属性,标签控制器用tabBar布局时候,会自动调用当前页面里面这个属性,布局,而且tabBarItem里面图片属性,这个标签控制器在获取时候,只获取图片形状,不获取图片色彩

//设置导航条
//  self表示当前界面
//  self.navigationController 当前界面所在导航控制器
//参数2: 表示导航条状态(横屏, 竖屏)
//注意: 图片两种大小
//  如果高度44, 只显示在导航栏区域
//  如果高度64, 扩展到状态栏
//状态栏: 20点, 导航栏: 44个点
//ios7特别注意
//  图片大小最好是320x44, 这样正好覆盖了导航条, 或者320x64, 这样覆盖状态栏和导航条, 其他有可能平铺
//4.4 隐藏导航条
//注意: 以后导航条的显示和隐藏放在viewWillAppear中
//self.navigationController.navigationBar.hidden = YES;
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"header_bg.png"] forBarMetrics:UIBarMetricsDefault];
//设置导航条上的控件
//注意: 每个视图控制器有属性  self.navigationItem
//每个界面self.navigationItem, 导航条显示item中数据
//设置标题
self.title = @"Main界面";
self.navigationItem.title = @"主界面";
//注意: 添加不同颜色, 不同字体的title
//创建Label设置为self.navigationItem.titleView
//设置标题为为图片
//  类型: UIView *
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 60, 35)];
imageView.image = [UIImage imageNamed:@"logo_title.png"];
self.navigationItem.titleView = imageView;
//导航条左侧添加按钮
//UIBarButtonItem常见3种(系统样式,自定义,文本)
//UIBarButtonItem *textItem = [[UIBarButtonItem alloc] initWithTitle:@"分类" style:UIBarButtonItemStylePlain target:self action:@selector(dealConfig:)];
//UIBarButtonItem *systemItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemAdd target:self action:@selector(dealConfig:)];
//自定义按钮
UIButton *configButton = [UIButton buttonWithType:UIButtonTypeCustom];
configButton.frame = CGRectMake(0, 0, 45, 30);
[configButton setBackgroundImage:[UIImage imageNamed:@"main_left_nav.png"] forState:UIControlStateNormal];
[configButton addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *custumItem = [[UIBarButtonItem alloc] initWithCustomView:configButton];
self.navigationItem.leftBarButtonItem = custumItem;

UIButton *photoButton = [UIButton buttonWithType:UIButtonTypeCustom];
photoButton.frame = CGRectMake(0, 0, 45, 30);
[photoButton setBackgroundImage:[UIImage imageNamed:@"main_right_nav.png"] forState:UIControlStateNormal];
[photoButton addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *rightItem = [[UIBarButtonItem alloc] initWithCustomView:photoButton];
self.navigationItem.rightBarButtonItem = rightItem;

//显示工具栏
//导航控制器默认有一个工具栏, 默认隐藏
self.navigationController.toolbarHidden = NO;

//设置标签控制器
//利用标签栏控制器在4个界面之间进行切换
FirstViewController *first = [[FirstViewController alloc] init];
first.title = @"First";
//如何设置标签项上的文本
//tabBarItem不是标签栏控制器的, 而是每个界面的的
//标签栏显示一个视图的标签的时候,从该视图控制器的tabBarItem拿到所需数据
first.tabBarItem.title = @"消息";
//设置标签项的图片
first.tabBarItem.image = [UIImage imageNamed:@"tab_0.png"];
//设置标签项的提示文本
first.tabBarItem.badgeValue = @"999";
first.tabBarItem.image = [[UIImage imageNamed:@"tab_0.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
//自己创建tabBarItem,设置进去
//UITabBarItem *item = [UITabBarItem alloc] initWithTitle:(NSString *) image:(UIImage *) selectedImage:(UIImage *);
//系统样式的tabBarItem不能改变它的文本和图片
//UITabBarItem *item = [[UITabBarItem alloc] initWithTabBarSystemItem:UITabBarSystemItemContacts tag:100];

SecondViewController *second = [[SecondViewController alloc] init];
second.title = @"second";
second.tabBarItem.image = [UIImage imageNamed:@"tab_1.png"];

ThirdViewController *third = [[ThirdViewController alloc] init];
third.title = @"third";
third.tabBarItem.image = [UIImage imageNamed:@"tab_2.png"];

ForthViewController *forth  =[[ForthViewController alloc] init];
forth.title = @"forth";
forth.tabBarItem.image = [UIImage imageNamed:@"tab_3.png"];
//标签栏的使用
UITabBarController *tbc = [[UITabBarController alloc] init];
//标签栏管理或切换这几个界面
//  NSArray *类型
//注意: 界面的个数, 如果是5个或5个一下, 正好能放下, 大于5个, 第5个标签项变为More
tbc.viewControllers = @[first,second,third,forth,fifth,sixth];
self.window.rootViewController = tbc;

//标签栏的设置, 大小默认是320x49高度
//注意: 标签栏背景图的高度应该为59,小的话平铺
// 类型: UITabBar,
//设置色调,  理解: 会和底色混合
tbc.tabBar.barTintColor = [UIColor yellowColor];
//设置背景图片,这个不显示图片原有颜色,只是图片的一种投影
tbc.tabBar.backgroundImage = [UIImage imageNamed:@"header_bg.png"];
//设置背景图片相对位置,
vc.navigationController.tabBarItem.imageInsets = UIEdgeInsetsMake(5, 0, -5, 0);

//设置选择项的图片
tbc.tabBar.selectionIndicatorImage = [UIImage imageNamed:@"tab_s.png"];
//通过代理获取标签栏控制器的事件
//协议: UITabBarControllerDelegate
tbc.delegate = self;

//作用: 点击了某一个标签项之后执行
//返回: 返回YES表示可以选择, 返回NO不能选择
- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController NS_AVAILABLE_IOS(3_0)
{
//也可以写点击后一些操作
int index = [tabBarController.viewControllers indexOfObject:viewController];
//NSLog(@"%u", index);
//不让用户选择第二个界面
if(index == 1)
{
return NO;
}
return YES;
}

4 标签控制器重写
//标签控制器图片,位置都有所限制,所以我们可以去重写标签控制器
@interface MyTabBarController : UITabBarController
@end

@implementation MyTabBarController

- (void)viewDidLoad {
[super viewDidLoad];

self.tabBar.hidden = YES;
double height = 49*2;
UIView *myTabBar = [[UIView alloc] initWithFrame:CGRectMake(0, self.view.frame.size.height - height, self.view.frame.size.width, height)];
myTabBar.backgroundColor = [UIColor orangeColor];
[self.view addSubview:myTabBar];
int count = 8;
NSArray *images = @[@"tab_0.png",
@"tab_1.png",
@"tab_2.png",
@"tab_3.png",
@"tab_0.png",
@"tab_1.png",
@"tab_2.png",
@"tab_3.png",];
double w = self.view.frame.size.width / (count/2);
double h = height/2;
double x = 0;
double y = 0;
for (int i=0; i<8; i++) {
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.frame = CGRectMake(x, y, w, h);
[button setImage:[UIImage imageNamed:images[i]] forState:UIControlStateNormal];
[myTabBar addSubview:button];
button.tag = i;
[button addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
i%4!=3?(x+=w):(x=0,y+=h);
}
}

-(void)btnClick:(UIButton *)button
{
long index = button.tag;
//标签栏应该显示哪个界面
self.selectedIndex = index;
}








内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: