自定义标签栏，如 swift-Storyboard 中附加的屏幕截图

Question

大家好，我被困在某个地方了。需要你的帮助。我想实现自定义标签栏

到目前为止我做了什么。

1. 我添加了标签栏控制器，但无法给出约束。
2. 还在视图控制器中添加了选项卡栏，但未能添加操作 导航到其他控制器。

Answer 1

是否可以将标签栏修改为这样，我不确定。我可以确认不可能通过故事板来做到这一点。

故事板是非常强大的工具，但通过右侧的选项仅提供有限的自定义控件的能力。对于选项卡栏，您所能做的就是设置背景颜色、选项卡选定颜色等。要做这样的事情，至少您需要在 tabBarController 内运行一些代码来修改 UIViews 以在中间创建特殊按钮，然后修圆边缘等。

例如，我之前需要创建一个特殊的、更大的中间按钮，并且选项卡栏的左上角和右上角是圆角的。这是一段代码作为一个粗略的想法：

import UIKit

class HomeTabBarController: UITabBarController {
    
    private let middleButton = UIButton(frame: CGRect(x: 0, y: 0, width: 40, height: 40))
    
    override func viewDidLoad() {
        super.viewDidLoad()
    }
    
    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        
        guard let tabItems = tabBar.items else { return }
        tabItems[0].titlePositionAdjustment = UIOffset(horizontal: -25, vertical: 0)
        tabItems[1].titlePositionAdjustment = UIOffset(horizontal: 25, vertical: 0)
        
        middleButton.setBackgroundImage(UIImage(named: "middle-tab-button"), for: .normal)
        middleButton.setBackgroundImage(UIImage(named: "middle-tab-button")?.maskWithColor(color: .lightGray), for: .highlighted)
        middleButton.tintColor = UIColor.black
        middleButton.center = CGPoint(x: tabBar.frame.width/2, y: 25)
        self.tabBar.addSubview(middleButton)
        
        self.view.backgroundColor = UIColor(named: "background")
    }
    
    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        
        self.tabBar.roundCorners(corners: [.topLeft, .topRight], radius: 28)
    }
}

您也许可以以此为起点并添加内容。另一种选择是从头开始完全构建自定义控件，并使所有交互工作相同。

但是，如果背后的设计者同意坚持使用更多 iOS 风格的控件，这会容易得多。构建和维护这些东西需要大量的时间和精力。通常，内置控件的外观略有不同几乎不会改变任何东西，因此不值得。