如何在 Swift 5 中以编程方式从右上角添加垂直按钮列表

Posted 2023-02-27

【中文标题】如何在 Swift 5 中以编程方式从右上角添加垂直按钮列表

【英文标题】：How add vertical button list from top right corner programmatically in Swift 5

【发布时间】：2020-01-21 14:41:44

【问题描述】：

我需要从屏幕右上角添加按钮。我添加了按钮。它在 iPhone 上运行良好。但是当我跑到 iPad 时，它从屏幕的右上角开始。我已经使用下面的代码..

 let button1 = UIButton(frame: CGRect(x: view.frame.size.width - 56, y: view.frame.size.width - 220, width: 30, height: 30))
  self.view.addSubview(button1)

 let button12 = UIButton(frame: CGRect(x: view.frame.size.width - 56, y: view.frame.size.width - 150, width: 30, height: 30))
 self.view.addSubview(button12)

如何在手机或 iPad 的右上角添加按钮？

【问题讨论】：

也许尝试使用自动布局约束？

@ParthibBiswas 先生，我在谷歌地图中使用过

使用约束！

@DonMag 如何在此处添加约束

【参考方案1】：

将view.frame.size.width 更改为y 位置的静态值。因为 UIView 的位置计算是从 Top-Left 角开始的。

let button1 = UIButton(frame: CGRect(x: view.frame.size.width - 56, y: 20, width: 30, height: 30))
self.view.addSubview(button1)

let button12 = UIButton(frame: CGRect(x: view.frame.size.width - 56, y: 60, width: 30, height: 30))
self.view.addSubview(button12)

如果你想添加 AutoLayoutConstraint 试试这个

let button1 = UIButton()
button1.setTitle("Button 1", for: .normal)
button1.backgroundColor = .red
button1.translatesAutoresizingMaskIntoConstraints = false
 self.view.addSubview(button1)

let button12 = UIButton()
button12.setTitle("Button 12", for: .normal)
button12.backgroundColor = .red
button12.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(button12)

button1.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 20).isActive = true
button1.trailingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.trailingAnchor, constant: -20).isActive = true
button1.heightAnchor.constraint(equalToConstant: 30).isActive = true
button1.widthAnchor.constraint(equalToConstant: 100).isActive = true

button12.topAnchor.constraint(equalTo: button1.bottomAnchor, constant: 20).isActive = true
button12.trailingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.trailingAnchor, constant: -20).isActive = true
button12.heightAnchor.constraint(equalToConstant: 30).isActive = true
button12.widthAnchor.constraint(equalToConstant: 100).isActive = true

要了解translatesAutoresizingMaskIntoConstraints，请查看-link

【参考方案2】：

我会考虑将这些直接添加到情节提要中。可能在 stackview 中创建这两个按钮。如果您需要以编程方式进行，则上述示例的主要问题是使用height 而不是width 代替y：

let button1 = UIButton(frame: CGRect(x: self.view.frame.size.width - 56, y: self.view.frame.size.height - 220, width: 30, height: 30))
self.view.addSubview(button1)

let button12 = UIButton(frame: CGRect(x: self.view.frame.size.width - 56, y: self.view.frame.size.height - 150, width: 30, height: 30))
self.view.addSubview(button12)

【参考方案3】：

您必须像这样将带有约束的按钮固定到该视图：

NSLayoutConstraint.activate([
    self.button1.topAnchor.constraint(equalTo: self.view.topAnchor, constant: *first button top margin*),
    self.button1.rightAnchor.constraint(equalTo: self.view.rightAnchor, constant: *first button right margin*),
    self.button2.topAnchor.constraint(equalTo: self.button1.bottomAnchor, constant: *second button top margin*),
    self.button2.rightAnchor.constraint(equalTo: self.view.rightAnchor, constant: *second button right margin*)
])

不要忘记像 self.view.addSubview(button1) 那样添加子视图 您还可以设置宽度和高度的约束。

Apple 文档：https://developer.apple.com/library/archive/documentation/UserExperience/Conceptual/AutolayoutPG/ProgrammaticallyCreatingConstraints.html#//apple_ref/doc/uid/TP40010853-CH16-SW1