在UITabBar顶部查看 [英] View on Top of UITabBar

问题描述

类似于Spotify或Apple Music应用程序在播放歌曲时所执行的操作，它会在UITabBar上放置一个自定义视图：

我尝试过的解决方案：

1. ViewController中的UITabBarController具有最大尺寸容器视图和底部布局指南上方容器View49pt顶部的自定义视图：
   
   问题：任何内容嵌入在UITabBarController中的ViewControllers约束到底部不显示，因为它们隐藏在自定义布局后面。我已经尝试在UITabBarController中覆盖 size forChildContentContainer ，尝试更新底部布局指南，Nothing。 我需要调整UITabBarController的容器视图框架。




2. 再次尝试＃1，但尝试解决内容问题通过
   但是现在我有多个自定义视图实例浮动。如果我想更改其上的标签，则必须将其更改为所有视图。或者隐藏等等。




3. 覆盖UITabBarController的UITabBar属性并返回我的自定义UITabBar（用xib充气），它有一个UITabBar +我的自定义视图。 问题：可能是所有人最令人沮丧的尝试。如果使用类MyCustomTabBar：UITabBar {} 的实例覆盖该属性，则不会显示任何选项卡！是的，我将 myCustomTabBar 的代表设置为 self 。

倾向于＃3，但寻找更好的解决方案。

解决方案

我明白了！

从本质上讲，我增加了原始UITabBar以容纳自定义视图（并缩小上面的viewcontrollers的框架），然后在其上添加一个重复的UITabBar +自定义视图。

这里是我必须做的事情。我上传了一个功能正常的例子，可以在此回购中找到：

  class TabBarViewController：UITabBarController {
 
 var currentPlaying：CurrentlyPlayingView！ 
 static let maxHeight = 100 
 static let minHeight = 49 
 static var tabbarHeight = maxHeight 
 
 override func viewDidLoad（）{
 super.viewDidLoad（） 
 
 CurrentlyPlaying = CurrentlyPlayingView（copyFrom：tabBar）
 CurrentlyPlaying.tabBar.delegate = self 
 
 view.addSubview（CurrentlyPlaying）
 tabBar.isHidden = true 
} 
覆盖func viewWillAppear（_ animated：Bool）{
 super.viewWillAppear（animated）
 
 currentPlaying.tabBar.items = tabBar.items 
 CurrentlyPlaying.tabBar.selectedItem = tabBar.selectedItem 
} 
 func hideCurrentlyPlaying（）{
 TabBarViewController.tabbarHeight = TabBarViewController.minHeight 
 UIView.animate（withDuration：0.5，animations：{
 self.currentlyPlaying.hideCustomView（）
 self.updateSelectedViewControllerLayout（）
}）
} 
 func updateSelectedViewControllerLayout（）{
 tabBar.sizeToFit（）
 tabBar.sizeToFit（）
 currentPlaying.sizeToFit（）
 view.setNeedsLayout（）
 view.layoutIfNeeded（） 
 viewControllers？[self.selectedIndex] .view.setNeedsLayout（）
 viewControllers？[self.selectedIndex] .view.layoutIfNeeded（）
} 
} 
 
 extension UITabBar {
 
 open override func sizeThatFits（_ size：CGSize） - > CGSize {
 var sizeThatFits = super.sizeThatFits（size）
 sizeThatFits.height = CGFloat（TabBarViewController.tabbarHeight）
 return sizeThatFits 
} 
} 
  

Similar to what the Spotify or Apple Music app does when a song is playing, it places a custom view on top of the UITabBar:

Solutions I've tried:

1. UITabBarController in a ViewController with a max-sized Container View, and the custom view on top of the Container View49pt above the Bottom Layout Guide: Problem: Any content in ViewControllers embedded in the UITabBarController constrained to the bottom don't show because they're hidden behind the custom layout. I've tried overriding size forChildContentContainer in UITabBarController, tried updating the bottom layout guide, Nothing. I need to resize the frame of container view of the UITabBarController.

2. Tried #1 again, but tried solving the problem of content hiding behind it by increasing the size of UITabBar, and then using ImageInset on every TabBarItem to bring it down, and adding my custom view on top of the UITabBar. Hasn't worked really well. There are going to be times when I want to hide my custom view.

3. UITabBarController as root, with each children being a ViewController with a Container View + my custom view: But now I have multiple instances of my custom view floating around. If I want to change a label on it, have to change it to all views. Or hide, etc.

4. Override the UITabBar property of UITabBarController and return my custom UITabBar (inflated it with a xib) that has a UITabBar + my custom view. Problem: Probably the most frustrating attempt of all. If you override that property with an instance of class MyCustomTabBar : UITabBar {}, no tab shows up! And yes, I set the delegate of myCustomTabBar to self.

Leaning towards #3, but looking for a better solution.

解决方案

I got it!

In essence, I increased the size of the original UITabBar to accomodate a custom view (and to shrink the frame of the viewcontrollers above), and then adds a duplicate UITabBar + custom view right on top of it.

Here's the meat of what I had to do. I uploaded a functioning example of it and can be found in this repo:

class TabBarViewController: UITabBarController {

    var currentlyPlaying: CurrentlyPlayingView!
    static let maxHeight = 100
    static let minHeight = 49
    static var tabbarHeight = maxHeight

    override func viewDidLoad() {
        super.viewDidLoad()

        currentlyPlaying = CurrentlyPlayingView(copyFrom: tabBar)
        currentlyPlaying.tabBar.delegate = self

        view.addSubview(currentlyPlaying)
        tabBar.isHidden = true
    }
    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)

        currentlyPlaying.tabBar.items = tabBar.items
        currentlyPlaying.tabBar.selectedItem = tabBar.selectedItem
    }
    func hideCurrentlyPlaying() {
        TabBarViewController.tabbarHeight = TabBarViewController.minHeight
        UIView.animate(withDuration: 0.5, animations: {
            self.currentlyPlaying.hideCustomView()
            self.updateSelectedViewControllerLayout()
        })
    }
    func updateSelectedViewControllerLayout() {
        tabBar.sizeToFit()
        tabBar.sizeToFit()
        currentlyPlaying.sizeToFit()
        view.setNeedsLayout()
        view.layoutIfNeeded()
        viewControllers?[self.selectedIndex].view.setNeedsLayout()
        viewControllers?[self.selectedIndex].view.layoutIfNeeded()
    }
}

extension UITabBar {

    open override func sizeThatFits(_ size: CGSize) -> CGSize {
        var sizeThatFits = super.sizeThatFits(size)
        sizeThatFits.height = CGFloat(TabBarViewController.tabbarHeight)
        return sizeThatFits
    }
}

这篇关于在UITabBar顶部查看的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！