带有安全区域的UITabBar以编程方式创建UIViewController

Question

在您将其标记为重复之前请注意，我已阅读this这似乎不适用于UITabBar

UIViewController和UITabBar都是以编程方式创建的。约束设置如下：

public override func viewDidLoad() {
    super.viewDidLoad()
    self.view.bringSubview(toFront: self.tabBar)
}

self.tabBar：

lazy var tabBar: UITabBar = {
    let tab = UITabBar()
    self.view.addSubview(tab)
    tab.translatesAutoresizingMaskIntoConstraints = false
    tab.rightAnchor.constraint(equalTo: self.view.rightAnchor).isActive = true
    tab.leftAnchor.constraint(equalTo: self.view.leftAnchor).isActive = true
    tab.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true //This line will change in second part of this post.
    return tab
}()

这个节目UITabBar是这样的：

它太小，因为它没有考虑到安全区域。所以我改变了行：

tab.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true

为：

tab.bottomAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor).isActive = true

然后它显示如下：

所以它也没有按预期显示。这里的目标是这样的：

如何设置约束以显示UITabBar这样的内容？

Answer 1

我在这里做到了：

let tabBar = UITabBar()

override func viewDidLoad() {
    super.viewDidLoad()
    addTabbar()
}
override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    addHeightConstraintToTabbar()
}

func addTabbar() -> Void {
    self.view.addSubview(tabBar)
    tabBar.translatesAutoresizingMaskIntoConstraints = false
    tabBar.rightAnchor.constraint(equalTo: self.view.rightAnchor).isActive = true
    tabBar.leftAnchor.constraint(equalTo: self.view.leftAnchor).isActive = true
    tabBar.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
    let item1 = UITabBarItem(tabBarSystemItem: UITabBarSystemItem.bookmarks, tag: 1)
    let item2 = UITabBarItem(tabBarSystemItem: UITabBarSystemItem.contacts, tag: 2)

    tabBar.items = [item1, item2]
    self.view.bringSubview(toFront: tabBar)
}

func addHeightConstraintToTabbar() -> Void {
    let heightConstant:CGFloat = self.view.safeAreaInsets.bottom + 49.0
    tabBar.heightAnchor.constraint(equalToConstant: heightConstant).isActive = true
}

结果：

可能不知道，这样做是否正确。你需要做得更好。

Answer 2

当您将UItabbar添加到UIViewController并使用safeAreaLayoutGuide或layoutMarginsGuide时，它将被添加到该视图控制器的保存区域，其中SafeAreaInsets的空间位于底部，您可以更改，但如果您添加到UIViewController的视图，它将坚持边缘而没有任何空格，默认高度为49

增加该高度heightAnchor约束

  lazy var tabBar: UITabBar = {
        let tab = UITabBar()
        self.view.addSubview(tab)
        tab.translatesAutoresizingMaskIntoConstraints = false
        tab.rightAnchor.constraint(equalTo: self.view.rightAnchor).isActive = true
        tab.leftAnchor.constraint(equalTo: self.view.leftAnchor).isActive = true
        tab.heightAnchor.constraint(equalToConstant: 80).isActive = true
        tab.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true //This line will change in second part of this post.
        return tab
    }()

使用安全区域指南，您可以将负值添加到ViewController additionalSafeAreaInsets的底部

self.additionalSafeAreaInsets = UIEdgeInsetsMake(0, 0, -39, 0)

Answer 3

底部锚点需要连接到视图的 safeAreaLayoutGuide。

tabbar.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
    tabbar.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    tabbar.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    tabbar.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
])