ios 如何在iOS中隐藏带有动画的标签栏？

How to hide tab bar with animation in iOS?

提问by b3rge

So I have a button that is connected to a IBAction. When I press the button I want to hide the tab bar in my iOS app with a animation. This [self setTabBarHidden:hidden animated:NO];or this [self.tabBarController setTabBarHidden:hidden animated:YES];does not work. This is my code without the animation:

所以我有一个连接到 IBAction 的按钮。当我按下按钮时，我想用动画隐藏我的 iOS 应用程序中的标签栏。这个[self setTabBarHidden:hidden animated:NO];或这个[self.tabBarController setTabBarHidden:hidden animated:YES];不起作用。这是我没有动画的代码：

- (IBAction)picture1:(id)sender {
    [self.tabBarController.tabBar setHidden:YES];
}

Any help would be greatly appreciated :D

任何帮助将不胜感激：D

回答by Ben

When working with storyboard its easy to setup the View Controller to hide the tabbar on push, on the destination View Controller just select this checkbox:

使用故事板时，可以轻松设置视图控制器以在推送时隐藏标签栏，在目标视图控制器上只需选中此复选框：

回答by danh

I try to keep view animations available to me using the following formula:

我尝试使用以下公式保持视图动画对我可用：

// pass a param to describe the state change, an animated flag and a completion block matching UIView animations completion 
- (void)setTabBarVisible:(BOOL)visible animated:(BOOL)animated completion:(void (^)(BOOL))completion {

    // bail if the current state matches the desired state
    if ([self tabBarIsVisible] == visible) return (completion)? completion(YES) : nil;

    // get a frame calculation ready
    CGRect frame = self.tabBarController.tabBar.frame;
    CGFloat height = frame.size.height;
    CGFloat offsetY = (visible)? -height : height;

    // zero duration means no animation
    CGFloat duration = (animated)? 0.3 : 0.0;

    [UIView animateWithDuration:duration animations:^{
        self.tabBarController.tabBar.frame = CGRectOffset(frame, 0, offsetY);
    } completion:completion];
}

//Getter to know the current state
- (BOOL)tabBarIsVisible {
    return self.tabBarController.tabBar.frame.origin.y < CGRectGetMaxY(self.view.frame);
}

//An illustration of a call to toggle current state
- (IBAction)pressedButton:(id)sender {
    [self setTabBarVisible:![self tabBarIsVisible] animated:YES completion:^(BOOL finished) {
        NSLog(@"finished");
    }];
}

回答by HixField

Swift 3.0 version, using an extension:

Swift 3.0 版本，使用扩展：

extension UITabBarController {

    private struct AssociatedKeys {
        // Declare a global var to produce a unique address as the assoc object handle
        static var orgFrameView:     UInt8 = 0
        static var movedFrameView:   UInt8 = 1
    }

    var orgFrameView:CGRect? {
        get { return objc_getAssociatedObject(self, &AssociatedKeys.orgFrameView) as? CGRect }
        set { objc_setAssociatedObject(self, &AssociatedKeys.orgFrameView, newValue, .OBJC_ASSOCIATION_COPY) }
    }

    var movedFrameView:CGRect? {
        get { return objc_getAssociatedObject(self, &AssociatedKeys.movedFrameView) as? CGRect }
        set { objc_setAssociatedObject(self, &AssociatedKeys.movedFrameView, newValue, .OBJC_ASSOCIATION_COPY) }
    }

    override open func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()
        if let movedFrameView = movedFrameView {
            view.frame = movedFrameView
        }
    }

    func setTabBarVisible(visible:Bool, animated:Bool) {
        //since iOS11 we have to set the background colour to the bar color it seams the navbar seams to get smaller during animation; this visually hides the top empty space...
        view.backgroundColor =  self.tabBar.barTintColor 
        // bail if the current state matches the desired state
        if (tabBarIsVisible() == visible) { return }

        //we should show it
        if visible {
            tabBar.isHidden = false
            UIView.animate(withDuration: animated ? 0.3 : 0.0) {
                //restore form or frames
                self.view.frame = self.orgFrameView!
                //errase the stored locations so that...
                self.orgFrameView = nil
                self.movedFrameView = nil
                //...the layoutIfNeeded() does not move them again!
                self.view.layoutIfNeeded()
            }
        }
            //we should hide it
        else {
            //safe org positions
            orgFrameView   = view.frame
            // get a frame calculation ready
            let offsetY = self.tabBar.frame.size.height
            movedFrameView = CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height + offsetY)
            //animate
            UIView.animate(withDuration: animated ? 0.3 : 0.0, animations: {
                self.view.frame = self.movedFrameView!
                self.view.layoutIfNeeded()
            }) {
                (_) in
                self.tabBar.isHidden = true
            }
        }
    }

    func tabBarIsVisible() ->Bool {
        return orgFrameView == nil
    }
}

• This is based on the input from Sherwin Zadeh after a few hours of playing around.
• Instead of moving the tabbar itself it moves the frame of the view, this effectively slides the tabbar nicely out of the bottom of the screen but...
• ... has the advantage that the content displayed inside the UITabbarcontroller is then also taking the full screen!
• note its also using the AssociatedObject functionality to attached data to the UIView without subclassing and thus an extension is possible (extensions do not allow stored properties)

• 这是基于 Sherwin Zadeh 在玩了几个小时后的输入。
• 它不是移动标签栏本身，而是移动视图的框架，这有效地将标签栏很好地滑出屏幕底部，但是......
• ...的优点是 UITabbarcontroller 中显示的内容也会全屏显示！
• 请注意，它还使用 AssociatedObject 功能将数据附加到 UIView 而无需子类化，因此可以进行扩展（扩展不允许存储属性）

回答by ldindu

As per Apple docs, hidesBottomBarWhenPushed property of UIViewController, a Boolean value, indicating whether the toolbar at the bottom of the screen is hidden when the view controller is pushed on to a navigation controller.

根据 Apple 文档，UIViewController 的 hidesBottomBarWhenPushed 属性，一个布尔值，指示当视图控制器推送到导航控制器时屏幕底部的工具栏是否隐藏。

The value of this property on the topmost view controller determines whether the toolbar is visible.

最顶层视图控制器上的这个属性的值决定了工具栏是否可见。

The recommended approach to hide tab bar would as follows

隐藏标签栏的推荐方法如下

    ViewController *viewController = [[ViewController alloc] init];
    viewController.hidesBottomBarWhenPushed = YES;  // This property needs to be set before pushing viewController to the navigationController's stack. 
    [self.navigationController pushViewController:viewController animated:YES];

However, note this approach will only be applied to respective viewController and will not be propagated to other view controllers unless you start setting the same hidesBottomBarWhenPushed property in other viewControllers before pushing it to the navigation controller's stack.

但是，请注意，此方法仅适用于相应的视图控制器，不会传播到其他视图控制器，除非您在将其推送到导航控制器的堆栈之前开始在其他视图控制器中设置相同的 hidesBottomBarWhenPushed 属性。

回答by Sherwin Zadeh

Swift Version:

迅捷版：

@IBAction func tap(sender: AnyObject) {
    setTabBarVisible(!tabBarIsVisible(), animated: true, completion: {_ in })
}


// pass a param to describe the state change, an animated flag and a completion block matching UIView animations completion
func setTabBarVisible(visible: Bool, animated: Bool, completion:(Bool)->Void) {

    // bail if the current state matches the desired state
    if (tabBarIsVisible() == visible) {
        return completion(true)
    }

    // get a frame calculation ready
    let height = tabBarController!.tabBar.frame.size.height
    let offsetY = (visible ? -height : height)

    // zero duration means no animation
    let duration = (animated ? 0.3 : 0.0)

    UIView.animateWithDuration(duration, animations: {
        let frame = self.tabBarController!.tabBar.frame
        self.tabBarController!.tabBar.frame = CGRectOffset(frame, 0, offsetY);
    }, completion:completion)
}

func tabBarIsVisible() -> Bool {
    return tabBarController!.tabBar.frame.origin.y < CGRectGetMaxY(view.frame)
}

回答by Bill Chan

Rewrite Sherwin Zadeh's answer in Swift 4:

在 Swift 4 中重写 Sherwin Zadeh 的回答：

/* tab bar hide/show animation */
extension AlbumViewController {
    // pass a param to describe the state change, an animated flag and a completion block matching UIView animations completion
    func setTabBarVisible(visible: Bool, animated: Bool, completion: ((Bool)->Void)? = nil ) {

        // bail if the current state matches the desired state
        if (tabBarIsVisible() == visible) {
            if let completion = completion {
                return completion(true)
            }
            else {
                return
            }
        }

        // get a frame calculation ready
        let height = tabBarController!.tabBar.frame.size.height
        let offsetY = (visible ? -height : height)

        // zero duration means no animation
        let duration = (animated ? kFullScreenAnimationTime : 0.0)

        UIView.animate(withDuration: duration, animations: {
            let frame = self.tabBarController!.tabBar.frame
            self.tabBarController!.tabBar.frame = frame.offsetBy(dx: 0, dy: offsetY)
        }, completion:completion)
    }

    func tabBarIsVisible() -> Bool {
        return tabBarController!.tabBar.frame.origin.y < view.frame.maxY
    }
}

回答by Tai Le

[Swift4.2]

[Swift4.2]

Just created an extension for UITabBarController:

刚刚创建了一个扩展UITabBarController：

import UIKit

extension UITabBarController {
    func setTabBarHidden(_ isHidden: Bool, animated: Bool, completion: (() -> Void)? = nil ) {
        if (tabBar.isHidden == isHidden) {
            completion?()
        }

        if !isHidden {
            tabBar.isHidden = false
        }

        let height = tabBar.frame.size.height
        let offsetY = view.frame.height - (isHidden ? 0 : height)
        let duration = (animated ? 0.25 : 0.0)

        let frame = CGRect(origin: CGPoint(x: tabBar.frame.minX, y: offsetY), size: tabBar.frame.size)
        UIView.animate(withDuration: duration, animations: {
            self.tabBar.frame = frame
        }) { _ in
            self.tabBar.isHidden = isHidden
            completion?()
        }
    }
}

回答by gran33

Try to set the frame of the tabBar in animation. See thistutorial.

尝试在动画中设置tabBar的frame。请参阅本教程。

Just be aware, it's bad practice to do that, you should set show/hide tabBar when UIViewControllerpush by set the property hidesBottomBarWhenPushedto YES.

请注意，这样做是不好的做法，您应该在UIViewController推送时设置显示/隐藏 tabBar，方法是将属性设置hidesBottomBarWhenPushed为YES。

回答by ingconti

tried in swift 3.0 / iOS10 / Xcode 8:

在 swift 3.0 / iOS10 / Xcode 8 中尝试过：

    self.tabBarController?.tabBar.isHidden = true

I set it when my controller is shown: (and Hide when back, after navigation)

我在显示控制器时设置它：（导航后返回时隐藏）

override func viewWillAppear(_ animated: Bool) {

        super.viewWillAppear(animated)
        self.tabBarController?.tabBar.isHidden = false

    }

    override func viewWillDisappear(_ animated: Bool) {
                super.viewWillDisappear(animated)
        self.tabBarController?.tabBar.isHidden = true

    }

BTW: better to have a flag to save if shown or not, as other vents can eventually trigger hide/show

顺便说一句：如果显示或不显示，最好有一个标志来保存，因为其他通风口最终会触发隐藏/显示

回答by glassomoss

For Xcode 11.3 and iOS 13 other answers didn't work for me. However, based on those I've came up to the new solution using CGAffineTransform

对于 Xcode 11.3 和 iOS 13，其他答案对我不起作用。但是，根据我提出的新解决方案，使用CGAffineTransform

I didn't test this code well, but this might actually work.

我没有很好地测试这段代码，但这可能真的有效。

extension UITabBarController {

    func setTabBarHidden(_ isHidden: Bool) {

        if !isHidden { tabBar.isHidden = false }

        let height = tabBar.frame.size.height
        let offsetY = view.frame.height - (isHidden ? 0 : height)
        tabBar.transform = CGAffineTransform(translationX: 0, y: offsetY)

        UIView.animate(withDuration: 0.25, animations: {
            self.tabBar.transform = .identity
        }) { _ in
            self.tabBar.isHidden = isHidden
        }
    }

}

Hope that helps.

希望有帮助。

UPDATE 09.03.2020:

2020 年 3 月 9 日更新：

I've finally found an awesome implementation of hiding tab bar with animation. It's huge advantage it's able to work either in common cases and in custom navigation controller transitions. Since author's blog is quite unstable, I'll leave the code below. Original source: https://www.iamsim.me/hiding-the-uitabbar-of-a-uitabbarcontroller/

我终于找到了一个很棒的隐藏带有动画的标签栏的实现。它能够在常见情况下和自定义导航控制器转换中工作，这是一个巨大的优势。由于作者的博客非常不稳定，我将代码保留在下面。原始来源：https: //www.iamsim.me/hiding-the-uitabbar-of-a-uitabbarcontroller/

Implementation:

执行：

extension UITabBarController {

    /**
     Show or hide the tab bar.

     - Parameter hidden: `true` if the bar should be hidden.
     - Parameter animated: `true` if the action should be animated.
     - Parameter transitionCoordinator: An optional `UIViewControllerTransitionCoordinator` to perform the animation
        along side with. For example during a push on a `UINavigationController`.
     */
    func setTabBar(
        hidden: Bool,
        animated: Bool = true,
        along transitionCoordinator: UIViewControllerTransitionCoordinator? = nil
    ) {
        guard isTabBarHidden != hidden else { return }

        let offsetY = hidden ? tabBar.frame.height : -tabBar.frame.height
        let endFrame = tabBar.frame.offsetBy(dx: 0, dy: offsetY)
        let vc: UIViewController? = viewControllers?[selectedIndex]
        var newInsets: UIEdgeInsets? = vc?.additionalSafeAreaInsets
        let originalInsets = newInsets
        newInsets?.bottom -= offsetY

        /// Helper method for updating child view controller's safe area insets.
        func set(childViewController cvc: UIViewController?, additionalSafeArea: UIEdgeInsets) {
            cvc?.additionalSafeAreaInsets = additionalSafeArea
            cvc?.view.setNeedsLayout()
        }

        // Update safe area insets for the current view controller before the animation takes place when hiding the bar.
        if hidden, let insets = newInsets { set(childViewController: vc, additionalSafeArea: insets) }

        guard animated else {
            tabBar.frame = endFrame
            return
        }

        // Perform animation with coordinato if one is given. Update safe area insets _after_ the animation is complete,
        // if we're showing the tab bar.
        weak var tabBarRef = self.tabBar
        if let tc = transitionCoordinator {
            tc.animateAlongsideTransition(in: self.view, animation: { _ in tabBarRef?.frame = endFrame }) { context in
                if !hidden, let insets = context.isCancelled ? originalInsets : newInsets {
                    set(childViewController: vc, additionalSafeArea: insets)
                }
            }
        } else {
            UIView.animate(withDuration: 0.3, animations: { tabBarRef?.frame = endFrame }) { didFinish in
                if !hidden, didFinish, let insets = newInsets {
                    set(childViewController: vc, additionalSafeArea: insets)
                }
            }
        }
    }

    /// `true` if the tab bar is currently hidden.
    var isTabBarHidden: Bool {
        return !tabBar.frame.intersects(view.frame)
    }

}

If you're dealing with custom navigation transitions just pass a transitionCoordinatorproperty of "from" controller, so animations are in sync:

如果您正在处理自定义导航转换，只需传递transitionCoordinator“from”控制器的属性，因此动画是同步的：

from.tabBarController?.setTabBar(hidden: true, along: from.transitionCoordinator)

Note, that in such case the initial solution work very glitchy.

请注意，在这种情况下，初始解决方案的工作非常有问题。