自定义标签栏按钮，而不是 UITabBarController

Posted 2023-02-23

【中文标题】自定义标签栏按钮，而不是 UITabBarController

【英文标题】：Custom Tabbar Button without being a UITabBarController

【发布时间】：2018-02-22 17:53:30

【问题描述】：

我正在构建一个电子商务应用程序并想创建附加的图像。

因此，我以模态方式展示此控制器，它不会位于 Tabbar 内。

有没有一种简单的方法可以添加 Tabbar 并创建按钮，而无需为每个 iPhone 创建类似 TabBar 的视图？

或者最好将它嵌入到另一个 UITabBarController 中？好像有点矫枉过正...

非常感谢。

【问题讨论】：

你想在其他设备上怎么样？比如 6/7/8

完全一样。我相信 UITabBar 高度为 49pts，阴影线为 0.5pts。我需要一个 40pt 高的按钮。

是的，有可能。您需要为阴影和工具栏创建视图。添加到它们中。只需要一些约束

【参考方案1】：

为工具栏和阴影声明 Checkout 按钮和视图。

lazy var customView: UIView = 
    let vw = UIView()
    vw.backgroundColor = UIColor(red: 249/255, green: 249/255, blue: 249/255, alpha: 1.0)
    vw.translatesAutoresizingMaskIntoConstraints = false
    return vw
()

lazy var shadowView: UIView = 
    let vw = UIView()
    vw.backgroundColor = UIColor.gray
    vw.translatesAutoresizingMaskIntoConstraints = false
    return vw
()

lazy var checkoutButton: UIButton = 
    let btn = UIButton(type: .system)
    btn.tintColor = .white
    btn.layer.cornerRadius = 5
    btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 20)
    btn.setTitle("Checkout", for: .normal)
    btn.backgroundColor = UIColor(red: 39/255, green: 39/255, blue: 39/255, alpha: 1.0)
    btn.translatesAutoresizingMaskIntoConstraints = false
    return btn
()

在 viewDidLoad 中添加所有内容。

override func viewDidLoad() 
    super.viewDidLoad()

    view.addSubview(customView)

    [customView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor), 
    //Size of UITabBar from safeArea, so its compatible for iPhone X and others 
    customView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -49),
    customView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
    customView.heightAnchor.constraint(equalToConstant: 83)].forEach $0.isActive = true 


    view.addSubview(shadowView)

    [shadowView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
     shadowView.bottomAnchor.constraint(equalTo: customView.topAnchor),
     shadowView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
     shadowView.heightAnchor.constraint(equalToConstant: 0.5)].forEach $0.isActive = true 


    customView.addSubview(checkoutButton)

    [checkoutButton.leadingAnchor.constraint(equalTo: customView.leadingAnchor, constant: 10),
     checkoutButton.topAnchor.constraint(equalTo: customView.topAnchor, constant: 4.5),
     checkoutButton.trailingAnchor.constraint(equalTo: customView.trailingAnchor, constant: -10),
     checkoutButton.heightAnchor.constraint(equalToConstant: 40)].forEach $0.isActive = true