IOS app中有两个UITabBarController,即在第一个页面有4个按钮,进入子页面底部也有几个按钮

对于一个app中有两个TabBar,大部分 认为该UI不够友好,也不符合苹果的人机交互,在这有该讨论的
我们先看下效果图
这里写图片描述

事实上我们有两种解决方案
1.在子页面底部的tabbar我们可以用按钮代替,跟之前博客说在导航栏上UISegmentedControl,切换显示不同的VC,

2、在app中添加2个tabbar。

方案1,在此不再赘述,可参考之前的那片博客,直接看下方案2

1)、新建一个VC继承UITabBarController,然后在该VC中初始化tabbar

/*
 初始化Tabbar
 */
- (void)initTabBar{

    HomeOneViewController *h1 = [[HomeOneViewController alloc] init];
    HomeTwoViewController *h2 = [[HomeTwoViewController alloc] init];
    HomeThreeViewController *h3 = [[HomeThreeViewController alloc] init];
    HomeFourViewController *h4 = [[HomeFourViewController alloc] init];


    NSArray *rootArray = [NSArray arrayWithObjects:h1,h2,h3,h4, nil];

    NSArray *nameArray = [NSArray arrayWithObjects:@"首页",@"签到",@"日报",@"我的", nil];

    h1.title = nameArray[0];
    h2.title = nameArray[1];
    h3.title = nameArray[2];
    h4.title = nameArray[3];

    NSMutableArray *vcArray = [NSMutableArray array];


    for (int index = 0; index < rootArray.count; index++) {

        UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:rootArray[index]];
        //tabBar未选中的image
        UIImage *normalImg = [[UIImage imageNamed:[NSString stringWithFormat:@"tabBar%d_no.png",index + 1]] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

        //tabBar已选中的image
        UIImage *selectImg = [[UIImage imageNamed:[NSString stringWithFormat:@"tabBar%d_yes.png",index+1]] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

        //设置tabBar显示的文字
        nav.tabBarItem = [[UITabBarItem alloc] initWithTitle:nameArray[index] image:normalImg selectedImage:selectImg];

        nav.tabBarItem.tag = index +1;
        nav.tabBarItem.title = nameArray[index];
        [vcArray addObject:nav];

    }

    //tabbar未选中时文字的颜色,字体大小
    [[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor lightGrayColor],NSForegroundColorAttributeName,[UIFont systemFontOfSize:14.0],NSFontAttributeName, nil] forState:UIControlStateNormal];

    [[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:RColor,NSForegroundColorAttributeName,[UIFont systemFontOfSize:14.0],NSFontAttributeName, nil] forState:UIControlStateSelected];

    self.viewControllers = vcArray;

    self.view.backgroundColor = [UIColor whiteColor];
}

2)、我们在HomeOneViewController中的cell点击事件中添加如下代码,即进入第二个tabbar

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{

    flag = 0;
    OneSubViewController *ycf = [[OneSubViewController alloc] init];
    ycf.hidesBottomBarWhenPushed=YES;// 进入后隐藏tabbar
    [self.navigationController pushViewController:ycf animated:YES];

}

3)、OneSubViewController就是第二个tabbar,也是继承自UITabBarController,里面初始化tabbar 方式一样。代码不再贴了

然后运行代码后就会发现一个问题SubOneViewController和SubTwoViewController有两个导航条,因为在第一个tabbar有导航条,第二个tabbar也有。看下上面的代码中有flag,看下作用,就是是否需要隐藏第一个tabbar的navigationController,在进入第二个tabbar是需要隐藏,

- (void)viewWillAppear:(BOOL)animated{
    [super viewWillAppear:animated];
    self.navigationController.navigationBar.hidden= NO;

}

- (void)viewWillDisappear:(BOOL)animated{
    [super viewWillDisappear:animated];
    if (flag==0) {
        self.navigationController.navigationBar.hidden= YES;

    }
}

4)、现在看下返回按钮的事件,一搬的子页面回到父VC,直接

[self.navigationController popViewControllerAnimated:YES];

但是在第二个tabbar回到上个tabbar,该如何回去呢,如下方式才能回去

 [self.tabBarController.navigationController popViewControllerAnimated:YES];

需要注意的是我这边的子VC都继承了一个BaseViewController,里面有对导航栏和页面样式的配置,在之前一篇已经说过translucent

 self.navigationController.navigationBar.translucent = NO;//1、导航栏不模糊,2、view的高度从导航栏底部开始
    self.edgesForExtendedLayout = UIRectEdgeNone;//指定边缘要延伸的方向,它的默认值很自然地是UIRectEdgeAll,四周边缘均延伸,就是说,如果即使视图中上有navigationBar,下有tabBar,那么视图仍会延伸覆盖到四周的区域。将属性设置为UIRectEdgeNone  被上面两个属性坑死了
    self.extendedLayoutIncludesOpaqueBars = NO;
    self.modalPresentationCapturesStatusBarAppearance = NO;

写这个demo时,我没有设置self.edgesForExtendedLayout,默认值时UIRectEdgeAll,底部tabor会遮挡子VC的底部49高度。仅此谨记!!!

对于这个2个tabbar还有中实现方式,在AppDelegate中,先初始化2个tabbar,默认rootViewControoler = 第一个tabbar。在点击cell跳转到第二个tabbar时,再将rootViewControoler=第二个tabbar,从第二个tabbar回到第一个tabbar时,也是重新设置rootViewControoler。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值