iOS/Swift - Скрыть / Показать UITabBarController при прокрутке вниз / вверх

Question

Я довольно новичок в разработке для iOS. Прямо сейчас я пытаюсь скрыть свою панель вкладок, когда я прокручиваю вниз и при прокрутке вверх должна появиться панель вкладок. Я хотел бы анимировать это так же, как панель навигации. Для панели навигации я просто щелкнул опцию в Инспекторе Атрибутов. Я видел несколько примеров для панели инструментов, но я не могу принять его на вкладке.

self.tabBarController?.tabBar.hidden = true просто скрывает мою вкладку, но она не анимирована, как контроллер навигации.

Answer 1

Это код, который я на самом деле использую в производственном приложении.

Это в Swift, и это также обновляет UITabBar.hidden вар.

func scrollViewWillBeginDragging(scrollView: UIScrollView) {
    if scrollView.panGestureRecognizer.translation(in: scrollView).y < 0{
        changeTabBar(hidden: true, animated: true)
    }
    else{
        changeTabBar(hidden: false, animated: true)
    }
}

Вы также можете использовать другой метод обратного вызова:

func scrollViewDidScroll(scrollView: UIScrollView) {
    ...
}

но если вы выберете это, вы должны обработать несколько вызовов вспомогательного метода, который фактически скрывает tabBar.

И тогда вам нужно добавить этот метод, который анимирует скрытие / показ tabBar.

func changeTabBar(hidden:Bool, animated: Bool){
    var tabBar = self.tabBarController?.tabBar
    if tabBar!.hidden == hidden{ return }
    let frame = tabBar?.frame
    let offset = (hidden ? (frame?.size.height)! : -(frame?.size.height)!)
    let duration:NSTimeInterval = (animated ? 0.5 : 0.0)
    tabBar?.hidden = false
    if frame != nil
    {
        UIView.animateWithDuration(duration,
            animations: {tabBar!.frame = CGRectOffset(frame!, 0, offset)},
            completion: {
                println($0)
                if $0 {tabBar?.hidden = hidden}
        })
    }
}

Обновление Swift 4

func changeTabBar(hidden:Bool, animated: Bool){
    guard let tabBar = self.tabBarController?.tabBar else { return; }
    if tabBar.isHidden == hidden{ return }
    let frame = tabBar.frame
    let offset = hidden ? frame.size.height : -frame.size.height
    let duration:TimeInterval = (animated ? 0.5 : 0.0)
    tabBar.isHidden = false

    UIView.animate(withDuration: duration, animations: {
        tabBar.frame = frame.offsetBy(dx: 0, dy: offset)
    }, completion: { (true) in
        tabBar.isHidden = hidden
    })
}

Answer 2

Этот ответ является небольшой модификацией ответа Ариэля, который добавляет анимацию во время прокрутки пользователем.

extension ViewController:UIScrollViewDelegate{
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        if scrollView.panGestureRecognizer.translation(in: scrollView).y < 0{
            //scrolling down
            changeTabBar(hidden: true, animated: true)
        }
        else{
            //scrolling up
            changeTabBar(hidden: false, animated: true)
        }
    }

    func changeTabBar(hidden:Bool, animated: Bool){
        let tabBar = self.tabBarController?.tabBar
        let offset = (hidden ? UIScreen.main.bounds.size.height : UIScreen.main.bounds.size.height - (tabBar?.frame.size.height)! )
        if offset == tabBar?.frame.origin.y {return}
        print("changing origin y position")
        let duration:TimeInterval = (animated ? 0.5 : 0.0)
        UIView.animate(withDuration: duration,
                       animations: {tabBar!.frame.origin.y = offset},
                       completion:nil)
    }
}

Answer 3

Основываясь на ответе Ариэля, я обновил код для Swift3. Это отлично сработало в моей коллекции просмотров.

override func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
        if scrollView.panGestureRecognizer.translation(in: scrollView).y < 0 {
            changeTabBar(hidden: true, animated: true)
        }else{
            changeTabBar(hidden: false, animated: true)
        }

    }

func changeTabBar(hidden:Bool, animated: Bool){
        let tabBar = self.tabBarController?.tabBar
        if tabBar!.isHidden == hidden{ return }
        let frame = tabBar?.frame
        let offset = (hidden ? (frame?.size.height)! : -(frame?.size.height)!)
        let duration:TimeInterval = (animated ? 0.5 : 0.0)
        tabBar?.isHidden = false
        if frame != nil
        {
            UIView.animate(withDuration: duration,
                                       animations: {tabBar!.frame = frame!.offsetBy(dx: 0, dy: offset)},
                                       completion: {
                                        print($0)
                                        if $0 {tabBar?.isHidden = hidden}
            })
        }
    }

Answer 4

Вы можете точно контролировать UITabBar, настроив свой класс в качестве делегата для scrollView и реализовав прокрутку в scrollViewDidScroll: метод.

Вот пример того, как я делаю это мое приложение. Вы можете легко изменить это для своих нужд. Некоторая вспомогательная функция для включения UITabBar.

#define LIMIT(__VALUE__, __MIN__, __MAX__) MAX(__MIN__, MIN(__MAX__, __VALUE__))

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat scrollOffset = scrollView.contentOffset.y;
    CGFloat scrollDiff = scrollOffset - self.previousScrollViewYOffset;
    CGFloat scrollHeight = scrollView.frame.size.height;
    CGFloat scrollContentSizeHeight = scrollView.contentSize.height + scrollView.contentInset.bottom;
    CGFloat scrollOffsetGlobal = scrollOffset + scrollView.contentInset.top;
    [self updateUITabBarY:[self UITabBarView].frame.origin.y + scrollDiff];
    self.previousScrollViewYOffset = scrollOffset;
}

- (UITabBar*) UITabBarView
{
    for(UIView *view in self.tabBarController.view.subviews)
    {
        if([view isKindOfClass:[UITabBar class]])
        {
            return (UITabBar*) view;
        }
    }

    return nil;
}

- (void) updateUITabBarY:(CGFloat) y
{
    UITabBar* tabBar = [self UITabBarView];
    if(tabBar)
    {
        CGRect frame = tabBar.frame;
        frame.origin.y  = LIMIT(y, [self UITabBarMiny], [self UITabBarMaxY]);
        tabBar.frame = frame;
    }
}

- (CGFloat) UITabBarMiny
{
    return [UIScreen mainScreen].bounds.size.height - [self UITabBarView].frame.size.height - [[UIApplication sharedApplication] statusBarFrame].size.height + 20.0f;
}

- (CGFloat) UITabBarMaxY
{
    return [UIScreen mainScreen].bounds.size.height;
}

Answer 5

Ariels answer works, but has some values that seem off. When you compare the y-value of the scrollView scrollView.panGestureRecognizer.translation(in: scrollView).y, "0" has the side effect, that the tabBar shows or hides when you stop scrolling. It calls the method one more time with a "0" value. I tried it with didEndDragging, didScroll and willBeginDragging with similar effects. And that feels very counter intuitive or buggy. I used +/- 0.1 when comparing the y-value and got the desired effect, that it just shows and hides when you are really scrolling up or down.

Another thing that isn't mentioned is that the offset that you set with tabBar.frame = frame.offsetBy(dx: 0, dy: offset) will be reset when the app moves to the background. You scroll down, the tabBar disappears, you change the app, open it up again, the tabBar is still hidden but the frame is back to the old location. So when the function is called again, the tabBar moves up even more and you have a gap of the size of the tabBar.frame.

To get rid of this I compared the current frame location and animated the alpha value. I couldn't get the usual coming back up animation to work, maybe somebody will try, can't be that hard. But its okay this way, as it doesn't happen that often.

      override func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {

    let yValue = scrollView.panGestureRecognizer.translation(in: scrollView).y
    if yValue < -0.1 {
        //hide tabBar
        changeTabBar(hidden: true, animated: true)
    } else if yValue > 0.1 {
        //show tabBar
        changeTabBar(hidden: false, animated: true)
    }
}

func changeTabBar(hidden:Bool, animated: Bool) {
    guard let tabBar = self.tabBarController?.tabBar else {
        return
    }
    if tabBar.isHidden == hidden{
        return
    }
    
    let frame = tabBar.frame
    let frameMinY = frame.minY  //lower end of tabBar
    let offset = hidden ? frame.size.height : -frame.size.height
    let viewHeight = self.view.frame.height
    
    //hidden but moved back up after moving app to background
    if frameMinY < viewHeight && tabBar.isHidden {
        tabBar.alpha = 0
        tabBar.isHidden = false

        UIView.animate(withDuration: 0.5) {
            tabBar.alpha = 1
        }
        
        return
    }

    let duration:TimeInterval = (animated ? 0.5 : 0.0)
    tabBar.isHidden = false

    UIView.animate(withDuration: duration, animations: {
        tabBar.frame = frame.offsetBy(dx: 0, dy: offset)
    }, completion: { (true) in
        tabBar.isHidden = hidden
    })
}

Answer 6

Согласно @Ariel Hernández Amador ответ за черный экран после скрытия Tabbar просто используйте эту строку кода в вашем ViewDidLoad(). Работает великолепно... Я разместил это здесь, так как я не могу комментировать там.

viewDidLoad()
{
if #available(iOS 11.0, *) {
            self.myScroll.contentInsetAdjustmentBehavior = .never
        }
}

Здесь myScroll - это Scrollview, который я использую в своем ВК. Просто замените его на свой ВК.