(Swift) 以编程方式将 UIButton 约束到角落

Posted

技术标签:

【中文标题】(Swift) 以编程方式将 UIButton 约束到角落【英文标题】:(Swift) programmatically constrain UIButton to corner 【发布时间】:2016-07-19 02:28:27 【问题描述】:

对于圆形按钮的图像,我有以下代码:

let settingsButton = UIButton(type: .Custom)

settingsButton.frame = CGRectMake(160, 100, 50, 50)
settingsButton.layer.cornerRadius = 0.5 * settingsButton.bounds.size.width
settingsButton.setImage(UIImage(named:"settingsButton.png"), forState: .Normal)
settingsButton.clipsToBounds = true

view.addSubview(settingsButton)

我想将它限制在我的视图控制器的左上角,但由于我以编程方式制作了这个按钮,我无法在我的故事板中看到它,因此无法手动移动和限制它。有没有办法在我的故事板的视图控制器中看到这个以编程方式创建的按钮?如果不是,我如何以编程方式将我创建的这个按钮限制在视图控制器的左上角?

非常感谢任何帮助!

【问题讨论】:

【参考方案1】:

由于您是在代码中创建按钮,因此最简单的方法是使用按钮的自动调整大小掩码。首先,设置按钮的frame,使其位于超级视图的右上角。然后设置按钮的autoresizingMask,只允许到superview的左下边缘的距离变化:

settingsButton.frame = CGRect(x: view.bounds.maxX - 50, y: 0, width: 50, height: 50)
settingsButton.autoresizingMask = [.flexibleLeftMargin, .flexibleBottomMargin]
view.addSubview(settingsButton)

我的代码采用 Swift 3 语法,但将其转换为 Swift 2 应该很简单。

请记住,自动调整大小的蒙版在自动布局下可以正常工作。 Apple 的许多标准类仍在内部使用自动调整大小的蒙版。 Xcode 8 添加了在故事板或 xib 中混合约束和自动调整蒙版的能力,因此很明显,Apple 认为您应该在合适的时候使用自动调整大小。

【讨论】:

收到以下错误:“类型 'UIViewAutoresizing' 没有成员 'flexibleRightMargin'”,我的意思是说左上角,所以我现在要更改它,有什么建议吗? 正如我所说,您需要将我的代码转换为 Swift 2 语法。在 Swift 2 中,常量是 .FlexibleLeftMargin.FlexibleBottomMargin【参考方案2】:

如果我将 constrain 解释为 using constraints,您可以使用布局锚点。这里的问题是:

    始终在您的视图中设置translatesAutoresizingMaskIntoConstraints = false。 在布局锚点上设置 .active = true。 仅适用于 ios >= 9.0(如果您需要支持早期版本的 iOS,请使用普通的NSlayoutConstraints)。

示例代码:

let settingsButton = UIButton(type: .Custom)
view.addSubview(settingsButton)
settingsButton.backgroundColor = UIColor.redColor()
settingsButton.translatesAutoresizingMaskIntoConstraints = false
settingsButton.widthAnchor.constraintEqualToConstant(50).active = true
settingsButton.heightAnchor.constraintEqualToConstant(50).active = true

settingsButton.topAnchor.constraintEqualToAnchor(view.topAnchor, constant: 10).active = true
settingsButton.trailingAnchor.constraintEqualToAnchor(view.trailingAnchor, constant: -10).active = true

settingsButton.setNeedsLayout()
settingsButton.layoutIfNeeded()
settingsButton.layer.cornerRadius = 0.5 * settingsButton.bounds.size.width
settingsButton.setImage(UIImage(named:"settingsButton.png"), forState: .Normal)
settingsButton.clipsToBounds = true

注意,使用约束优于设置框架,因为约束会适应父视图大小的变化(例如,设备旋转到横向模式)。

【讨论】:

【参考方案3】:

你可以用这个:

let settingsButton = UIButton()
settingsButton.translatesAutoresizingMaskIntoConstraints = false
settingsButton.trailingAnchor.constraint(equalTo: view.leadingAnchor,constant: 160).isActive = true
settingsButton.bottomAnchor.constraint(equalTo: view.topAnchor,constant: 100).isActive = true
settingsButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
settingsButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
settingsButton.widthAnchor.constraint(equalToConstant: 50).isActive = true
settingsButton.layer.cornerRadius = 0.5 * settingsButton.bounds.size.width
settingsButton.clipsToBounds = true

view.addSubview(settingsButton)

【讨论】:

以上是关于(Swift) 以编程方式将 UIButton 约束到角落的主要内容,如果未能解决你的问题,请参考以下文章

Swift:以编程方式在键盘上方添加 UIButton

Swift - UIButton 以编程方式设置约束

在 Swift 中以编程方式更改 UIButton 的文本(填充)

如何在 Swift 中以编程方式更改 UIButton 状态

如何在 Swift 中以编程方式调整 UIButton 中文本的字体大小以适应宽度?

Swift:以编程方式在 UICollectionViewCell 中的 IndexPath 中的多个 UIButton,下一个 addTarget 不单击