如何通过工具栏按钮替换容器视图?

时间:2014-04-04 17:58:16

标签: ios objective-c uitabbarcontroller uitoolbar

我想创建一个用户界面,其中有一个导航栏及其按钮,下方有一个工具栏,两者始终可见。然后我会想要一个底部的工具栏,当你点击一个按钮时,它会取代屏幕中间可见的内容。我会使用UITabBarController,但我不想要下面的文字标签或图标的图像 - 按钮将是一个unicode角色。它们应该是灰色的,然后在选择一个时用色调填充。我在想这样做的方法是在按下按钮时应用色调,但是因为没有粘性的选择状态"对于一个条形按钮,我不知道该怎么做。

我也不确定如何替换中间的内容。我在想我应该创建一个容器,然后只需从每个按钮创建一个动作方法performSegueWithIdentifier到另一个包含不同内容的容器。但是只能嵌入一个视图控制器 - 我无法从容器中创建多个segue。我基本上试图使用较小的按钮模拟标签栏控制器,没有标签,而且点击按钮后屏幕上的整个内容都不会被替换。

我该怎么做呢?我想在Interface Builder中完成基本布局,但当然需要一些代码。谢谢!

这基本上是我想要实现的目标: enter image description here

3 个答案:

答案 0 :(得分:1)

这是我过去做过这种方式的方式。代码位于自定义容器控制器中,该控制器是嵌入在故事板中的容器视图中的控制器。所以,在viewDidAppear:中,我将第一个控制器添加为子节点,并在单击按钮时调用switchToNewView:。

@implementation ContainerController


- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear:animated];
    UIViewController *initial = [self.storyboard instantiateViewControllerWithIdentifier:@"InitialVC"];
    [self addChildViewController:initial];
    [self.view addSubview:initial.view];
    self.currentController = initial;
    [self constrainViewEqual:self.currentController];
}

-(IBAction)switchToNewView {
    UIViewController *sub = [self.storyboard instantiateViewControllerWithIdentifier:@"SubstituteVC"];
    [self addChildViewController:sub];
    sub.view.frame = self.view.bounds;
    [self moveToNewController:sub];
}

-(void)moveToNewController:(UIViewController *) newController {
    [self.currentController willMoveToParentViewController:nil];
    [self transitionFromViewController:self.currentController toViewController:newController duration:.6 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{}
         completion:^(BOOL finished) {
             [self.currentController removeFromParentViewController];
             [newController didMoveToParentViewController:self];
             self.currentController = newController;
             [self constrainViewEqual:self.currentController];
         }];
}

constrainViewEqual是我用于向控制器视图添加约束的类别方法。它看起来像这样,

-(void)constrainViewEqual:(UIViewController *) vc {
    [vc.view setTranslatesAutoresizingMaskIntoConstraints:NO];
    NSLayoutConstraint *con1 = [NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeCenterX relatedBy:0 toItem:vc.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0];
    NSLayoutConstraint *con2 = [NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeCenterY relatedBy:0 toItem:vc.view attribute:NSLayoutAttributeCenterY multiplier:1 constant:0];
    NSLayoutConstraint *con3 = [NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeWidth relatedBy:0 toItem:vc.view attribute:NSLayoutAttributeWidth multiplier:1 constant:0];
    NSLayoutConstraint *con4 = [NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeHeight relatedBy:0 toItem:vc.view attribute:NSLayoutAttributeHeight multiplier:1 constant:0];
    NSArray *constraints = @[con1,con2,con3,con4];
    [self.view addConstraints:constraints];
}

答案 1 :(得分:1)

我实现了我想要的行为。

这不是一个特别干净的解决方案,但它确实提供了额外的好处:能够在底部的标签之间滑动。

本质:

  1. 我创建了一个填充整个屏幕的容器视图,其中包含一个页面视图控制器
  2. 我删除了页面控件(没有实现委托方法,所以你看不到点)
  3. 这些页面是来自可重复使用的View Controller的5个集合视图
  4. 我实现了在页面完全转换时调用的委托方法,然后在此时我更改了底部相应条形按钮的色调颜色(默认为灰色),循环显示其他方法后将色调重置为灰色
  5. 如果用户点击一个条形按钮而不是轻扫,我会为页面视图控制器设置视图控制器,然后更新色调。
  6. 这很好用,但代码不是很好。

    我可能做的另一件事是覆盖条形按钮高亮状态 当用户突出显示标签栏按钮时,标签栏按钮不应变亮。

    有趣的是,只需删除页面视图控制器数据源方法,就不容易在页面之间滑动。然后它就像一个真正的标签界面。我非常喜欢使用滑动和敲击的灵活性。

答案 2 :(得分:0)

这不是一个完整的答案,我可以帮助解决当前


您可以使用UIButton customView作为UIBarButtonItem对象,然后使用UIButton对象的highlighted和/或{ {1}}州 另外......如果你计划使用Unicode代替图像,那么selected真的很重要。
您也可以简单地更改按钮tintColor的{​​{1}}(取决于textColor

实施例

titleLabel

关于重新创建tabBar,我只能这样想:

  1. UIControlStateNormal - 视图放在底部
  2. 使用空- (void)testMethod { UIToolbar *tbTest = [[UIToolbar alloc] init]; [tbTest setFrame:CGRectMake(0, 100, 320, 44)]; [self.view addSubview:tbTest]; UIButton *btnTest = [UIButton buttonWithType:UIButtonTypeSystem]; [btnTest setFrame:CGRectMake(0, 0, 100, 44)]; [btnTest setTintColor:[UIColor blueColor]]; [btnTest setTitle:@"Normal" forState:UIControlStateNormal]; [btnTest setTitleColor:[UIColor redColor] forState:UIControlStateNormal]; [btnTest setTitle:@"Highlighted" forState:UIControlStateHighlighted]; [btnTest setTitleColor:[UIColor orangeColor] forState:UIControlStateHighlighted]; [btnTest setTitle:@"Selected" forState:UIControlStateSelected]; [btnTest setTitleColor:[UIColor purpleColor] forState:UIControlStateSelected]; [btnTest addTarget:self action:@selector(doSomething:) forControlEvents:UIControlEventTouchUpInside]; UIBarButtonItem *btn2Test = [[UIBarButtonItem alloc] initWithCustomView:btnTest]; [tbTest setItems:@[btn2Test]]; } -(void)doSomething:(UIButton *)sender { [sender setSelected:!sender.selected]; } 对象
  3. 填充顶部空格
  4. UITabBar标签UIView添加到此viewControllers

  5. 此外,您可以查看我刚刚开始在github上创作的有点类似的组件:
    https://github.com/staticVoidMan/SVMSlidingTabBar
    <子> 1.非故事板(但不太难以移植)
    2. 现在只支持标签按钮的图像(但感谢您的想法