在水平堆栈视图 + 元素的全宽上注册 UITapGesture

Posted 2023-03-15

【中文标题】在水平堆栈视图 + 元素的全宽上注册 UITapGesture

【英文标题】：Register UITapGesture on full width of Horizontal stackview + elements

【发布时间】：2020-11-30 22:19:43

【问题描述】：

我在垂直 stackView 中有一个水平 stackView。问题是我想在整行上注册一个 UITapGesture，而不仅仅是里面的元素。由于父（垂直） stackView 的对齐 = .leading，它会导致我的 stackView 未占用的剩余宽度变得对点击无响应。

本质上，我希望整行都可以点击，而不仅仅是其中的元素。我已将水平背景颜色设置为黑色，以了解可点击的宽度。

提前致谢。

这是我的代码的总体思路：

// Parent vertical stackView
private(set) var optionStackView: UIStackView = 
    let stackView = UIStackView()
    stackView.axis = .vertical
    stackView.alignment = .leading
    return stackView
()

// Child horizontal stackView inside optionStackView
private(set) var takePictureStackView: UIStackView = 
    let stackView = UIStackView()
    stackView.backgroundColor = .black
    return stackView
()

...
takePictureStackView.addArrangedSubview(takePictureImageView)
takePictureStackView.addArrangedSubview(takePictureLabel)

optionStackView.addArrangedSubview(takePictureStackView)
...

    // Attaching tapGesture recognizer from VC
takePictureStackView.addGestureRecognizer(UITapGestureRecognizer(target: self, action:  #selector(self.takePicture)))

【参考方案1】：

为takePictureStackView 的宽度添加一个约束，使其等于optionStackView 的宽度。

这将水平扩展takePictureStackView 并增加可点击区域。

【讨论】：

在完成增加可点击区域之后，我还建议在更简洁的代码方面进行改进。您尝试使用UIStackView + UIImageView + UILabel 实现的目标也可以通过单个UIButton 实现。单个UIButton 可以同时具有图像和文本。它们之间的插入也是可调节的。请查看文档以获取更多信息：developer.apple.com/documentation/uikit/uibutton

非常感谢！！感谢您抽出时间提供帮助并提出更好的做法。