在导航栏按钮中使整个 UIView 可点击?

Make whole UIView clickable in nav bar button?

我正在制作一个带有自定义视图 (btnView) 的左栏按钮。我希望此视图位于屏幕边缘,Swift 不允许这样做,因为如果我尝试添加位于左侧更远位置的视图,它会将条形按钮向右移动。当我扩展框架以适合我的 UIView 时,它只是移动所有内容以适合边距。

< 限制设置在距边缘 15 点左右。

启用isUserInteractionEnabled不会影响 UIView 的可点击性,它仍然响应那个小区域而不是最左边的边缘。

这是我现在的按钮:

func addBackButton() {
        // position of btn view on navbar
        let btnView = UIView(frame: CGRect(x:-15.5, y:-6, width: 58.5, height: 44))
        // position of label in btn view
        let label = UILabel(frame: CGRect(x: 24.5, y: 13, width: 0, height: 0))
        label.font = UIFont.systemFont(ofSize: 17)
        label.textAlignment = .left
        label.textColor = .systemBlue
        label.text = "VET"
        label.sizeToFit()
        btnView.addSubview(label)
        
        let icon = UIImage(systemName: "chevron.left", withConfiguration: UIImage.SymbolConfiguration(pointSize: 23, weight: .medium))
        // convert UIImage to UIView
        let iconView = UIImageView(image: icon)
        // position of icon in btn view
        iconView.frame.origin.x = 5.5
        iconView.frame.origin.y = 12
        btnView.addSubview(iconView)

        // make small button to stick the view onto
        let backBtn = UIButton(type: .custom)
        backBtn.addTarget(self, action: #selector(goBack), for: .touchUpInside)
        backBtn.addSubview(btnView)
        
        // make button clickable behind btn view
        btnView.isUserInteractionEnabled = false

        // convert UIButton to UIBarButtonItem and add to navbar
        navigationItem.leftBarButtonItem = UIBarButtonItem(customView: backBtn)
    }

我还尝试在 btnView 上添加第二个按钮,以便它可以正确定位,但由于某种原因它仍然无法点击,只有导航栏按钮区域有响应。

有没有更简单的方法来实现这个?我想避免额外的 类 或像我在某些主题中看到的那样的扩展,但我现在没有任何更简单的选择,所以我正在重新考虑。

解决方案:

我明白了。您可以将视图和按钮作为子视图添加到导航栏,而不是将它们限制在 leftBarButton 中。

  1. 我在我的视图上添加了按钮:

         // add button over view to perform action
     let clickableBtn = UIButton(type: .custom)
     clickableBtn.frame = CGRect(x:0, y:0, width: 58.5, height: 44)
     clickableBtn.addTarget(self, action: #selector(goBack), for: .touchUpInside)
     btnView.addSubview(clickableBtn)
    
  2. 删除了 isUserInteractionEnabled 和 backBtn 代码

  3. 并将视图添加到导航栏:

         // add btnView to navbar as subview
     navigationController?.navigationBar.addSubview(btnView)