如何在 iOS 中以编程方式设置纵横比约束?
How can I set aspect ratio constraints programmatically in iOS?
我为我的视图控制器使用了自动布局。我已经在约束中设置了 V 和 H 位置,但我想知道当它变为 5s、6 和 6 Plus 时如何增加按钮大小。这是我为登录按钮添加约束的方式:
NSArray *btncon_V=[NSLayoutConstraint constraintsWithVisualFormat:@"V:[btnLogin(40)]" options:0 metrics:nil views:viewsDictionary];
[btnLogin addConstraints:btncon_V];
NSArray *btncon_POS_H=[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[btnLogin]-100-|" options:0 metrics:nil views:viewsDictionary];
[self.view addConstraints:btncon_POS_H];
NSArray *btncon_POS_V=[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-70-[Title]-130-[lblFirst]-0-[lblSecond]-20-[textusername]-10-[txtpassword]-10-[btnLogin]" options:0 metrics:nil views:viewsDictionary];
[self.view addConstraints:btncon_POS_V];
但我的问题是,虽然它管理左右两侧的间隙,但由于高度固定,它在 iPhone 6 和 6 Plus 中变长了。如何根据屏幕尺寸增加尺寸?我认为这可能是宽高比,但如何在代码中设置宽高比约束?
像这样。尝试一次。
[self.yourview setTranslatesAutoresizingMaskIntoConstraints:NO];
[self.yourview addConstraint:[NSLayoutConstraint
constraintWithItem:self.yourview
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:self.yourview
attribute:NSLayoutAttributeWidth
multiplier:(self.yourview.frame.size.height / self.yourview.frame.size.width)
constant:0]];
或者在 (self.yourview.frame.size.height / self.yourview.frame.size.width)
的位置,您可以使用任何浮点值。
谢谢
Swift 3.0 -
self.yourview!.translatesAutoresizingMaskIntoConstraints = false
self.yourview!.addConstraint(NSLayoutConstraint(item: self.yourview!,
attribute: NSLayoutAttribute.height,
relatedBy: NSLayoutRelation.equal,
toItem: self.yourview!,
attribute: NSLayoutAttribute.width,
multiplier: self.yourview.frame.size.height / self.yourview.frame.size.width,
constant: 0))
您可以在 Interface Builder 中将 "Height constraint" 设置为 Design-time。
只需勾选'"Remove at build time",它会在 App 运行 时删除。
之后你可以添加 "Aspect Ratio" 约束,例如,在 viewDidLoad 方法中。
在 Xamain.iOS 中,“16:9”看起来像这样:
this.ImageOfTheDay.AddConstraint(NSLayoutConstraint.Create(
this.ImageOfTheDay,
NSLayoutAttribute.Height,
NSLayoutRelation.Equal,
this.ImageOfTheDay,
NSLayoutAttribute.Width,
9.0f / 16.0f,
0));
或者,正如 Mahesh Agrawal 所说:
[self.ImageOfTheDay addConstraint:[NSLayoutConstraint
constraintWithItem:self.ImageOfTheDay
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:self.ImageOfTheDay
attribute:NSLayoutAttributeWidth
multiplier:(9.0f / 16.0f)
constant:0]];
Swift 3:
yourView.addConstraint(NSLayoutConstraint(item: yourView,
attribute: .height,
relatedBy: .equal,
toItem: yourView,
attribute: .width,
multiplier: 9.0 / 16.0,
constant: 0))
我已经尝试了上面的所有答案但没有奏效,这是我的解决方案 swift 3:
let newConstraint = NSLayoutConstraint(item: yourView, attribute: .width, relatedBy: .equal, toItem: yourView, attribute: .height, multiplier: 560.0/315.0, constant: 0)
yourView.addConstraint(newConstraint)
NSLayoutConstraint.activate([newConstraint])
NSLayoutConstraint.deactivate(yourView.constraints)
yourView.layoutIfNeeded()
Layout Anchors 是以编程方式设置约束的最便捷方式。
假设您想为按钮设置 5:1 宽高比,那么您应该使用:
button.heightAnchor.constraint(equalTo: button.widthAnchor, multiplier: 1.0/5.0).isActive = true
完整代码如下:
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let button = UIButton(type: .custom)
button.setTitle("Login", for: .normal)
button.backgroundColor = UIColor.darkGray
self.view.addSubview(button)
button.translatesAutoresizingMaskIntoConstraints = false
let margins = view.layoutMarginsGuide
button.leadingAnchor.constraint(equalTo: margins.leadingAnchor, constant: 20.0).isActive = true
button.trailingAnchor.constraint(equalTo: margins.trailingAnchor, constant: -20.0).isActive = true
button.bottomAnchor.constraint(equalTo: margins.bottomAnchor, constant: -20.0).isActive = true
button.heightAnchor.constraint(equalTo: button.widthAnchor, multiplier: 1.0/5.0).isActive = true
}
}
这是使用上面编写的代码实现的结果。您可以看到该按钮在各种设备上保持其 5:1 纵横比:
UIView 上的助手扩展
extension UIView {
func aspectRation(_ ratio: CGFloat) -> NSLayoutConstraint {
return NSLayoutConstraint(item: self, attribute: .height, relatedBy: .equal, toItem: self, attribute: .width, multiplier: ratio, constant: 0)
}
}
用法是:
view.aspectRation(1.0/1.0).isActive = true
Swift5解,Xcode12.4。需要 ios 9.0+
只需将您的身高限制固定在特定比例即可:
let aspectRatio: CGFloat = 9 / 16 // Example of ratio you want to apply
yourView.heightAnchor.constraint(equalTo: imageView.widthAnchor,
multiplier: aspectRatio).activate()
我为我的视图控制器使用了自动布局。我已经在约束中设置了 V 和 H 位置,但我想知道当它变为 5s、6 和 6 Plus 时如何增加按钮大小。这是我为登录按钮添加约束的方式:
NSArray *btncon_V=[NSLayoutConstraint constraintsWithVisualFormat:@"V:[btnLogin(40)]" options:0 metrics:nil views:viewsDictionary];
[btnLogin addConstraints:btncon_V];
NSArray *btncon_POS_H=[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[btnLogin]-100-|" options:0 metrics:nil views:viewsDictionary];
[self.view addConstraints:btncon_POS_H];
NSArray *btncon_POS_V=[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-70-[Title]-130-[lblFirst]-0-[lblSecond]-20-[textusername]-10-[txtpassword]-10-[btnLogin]" options:0 metrics:nil views:viewsDictionary];
[self.view addConstraints:btncon_POS_V];
但我的问题是,虽然它管理左右两侧的间隙,但由于高度固定,它在 iPhone 6 和 6 Plus 中变长了。如何根据屏幕尺寸增加尺寸?我认为这可能是宽高比,但如何在代码中设置宽高比约束?
像这样。尝试一次。
[self.yourview setTranslatesAutoresizingMaskIntoConstraints:NO];
[self.yourview addConstraint:[NSLayoutConstraint
constraintWithItem:self.yourview
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:self.yourview
attribute:NSLayoutAttributeWidth
multiplier:(self.yourview.frame.size.height / self.yourview.frame.size.width)
constant:0]];
或者在 (self.yourview.frame.size.height / self.yourview.frame.size.width)
的位置,您可以使用任何浮点值。
谢谢
Swift 3.0 -
self.yourview!.translatesAutoresizingMaskIntoConstraints = false
self.yourview!.addConstraint(NSLayoutConstraint(item: self.yourview!,
attribute: NSLayoutAttribute.height,
relatedBy: NSLayoutRelation.equal,
toItem: self.yourview!,
attribute: NSLayoutAttribute.width,
multiplier: self.yourview.frame.size.height / self.yourview.frame.size.width,
constant: 0))
您可以在 Interface Builder 中将 "Height constraint" 设置为 Design-time。 只需勾选'"Remove at build time",它会在 App 运行 时删除。
在 Xamain.iOS 中,“16:9”看起来像这样:
this.ImageOfTheDay.AddConstraint(NSLayoutConstraint.Create(
this.ImageOfTheDay,
NSLayoutAttribute.Height,
NSLayoutRelation.Equal,
this.ImageOfTheDay,
NSLayoutAttribute.Width,
9.0f / 16.0f,
0));
或者,正如 Mahesh Agrawal 所说:
[self.ImageOfTheDay addConstraint:[NSLayoutConstraint
constraintWithItem:self.ImageOfTheDay
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:self.ImageOfTheDay
attribute:NSLayoutAttributeWidth
multiplier:(9.0f / 16.0f)
constant:0]];
Swift 3:
yourView.addConstraint(NSLayoutConstraint(item: yourView,
attribute: .height,
relatedBy: .equal,
toItem: yourView,
attribute: .width,
multiplier: 9.0 / 16.0,
constant: 0))
我已经尝试了上面的所有答案但没有奏效,这是我的解决方案 swift 3:
let newConstraint = NSLayoutConstraint(item: yourView, attribute: .width, relatedBy: .equal, toItem: yourView, attribute: .height, multiplier: 560.0/315.0, constant: 0)
yourView.addConstraint(newConstraint)
NSLayoutConstraint.activate([newConstraint])
NSLayoutConstraint.deactivate(yourView.constraints)
yourView.layoutIfNeeded()
Layout Anchors 是以编程方式设置约束的最便捷方式。
假设您想为按钮设置 5:1 宽高比,那么您应该使用:
button.heightAnchor.constraint(equalTo: button.widthAnchor, multiplier: 1.0/5.0).isActive = true
完整代码如下:
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let button = UIButton(type: .custom)
button.setTitle("Login", for: .normal)
button.backgroundColor = UIColor.darkGray
self.view.addSubview(button)
button.translatesAutoresizingMaskIntoConstraints = false
let margins = view.layoutMarginsGuide
button.leadingAnchor.constraint(equalTo: margins.leadingAnchor, constant: 20.0).isActive = true
button.trailingAnchor.constraint(equalTo: margins.trailingAnchor, constant: -20.0).isActive = true
button.bottomAnchor.constraint(equalTo: margins.bottomAnchor, constant: -20.0).isActive = true
button.heightAnchor.constraint(equalTo: button.widthAnchor, multiplier: 1.0/5.0).isActive = true
}
}
这是使用上面编写的代码实现的结果。您可以看到该按钮在各种设备上保持其 5:1 纵横比:
UIView 上的助手扩展
extension UIView {
func aspectRation(_ ratio: CGFloat) -> NSLayoutConstraint {
return NSLayoutConstraint(item: self, attribute: .height, relatedBy: .equal, toItem: self, attribute: .width, multiplier: ratio, constant: 0)
}
}
用法是:
view.aspectRation(1.0/1.0).isActive = true
Swift5解,Xcode12.4。需要 ios 9.0+
只需将您的身高限制固定在特定比例即可:
let aspectRatio: CGFloat = 9 / 16 // Example of ratio you want to apply
yourView.heightAnchor.constraint(equalTo: imageView.widthAnchor,
multiplier: aspectRatio).activate()