I wanted to know if there was a way to where you could have constraints one way on one device and another way on a different device. For example, I want to set the constraints for a label on the iPhone X as 30 but on an iPhone 8 Plus I want the constraints to be 50.
Accepted Reply
You have the complete code:
- the extension, that you can declare outside of the class
- addApplePayPaymentButtonToView()
as I wrote it
I understoof that you wanted to adapt the bottom constraint only.
private func addApplePayPaymentButtonToView() {
let paymentButton = PKPaymentButton(paymentButtonType: .buy, paymentButtonStyle: .black)
paymentButton.translatesAutoresizingMaskIntoConstraints = false
paymentButton.addTarget(self, action: #selector(applePayButtonTapped(sender:)), for: .touchUpInside)
view.addSubview(paymentButton)
var constantValue = -25
let modelName = UIDevice.modelName
switch modelName {
case "iPhone 8 Plus" : constantValue = -50 // If you want to set constraint at 50 instead of 25
case "iPhone X", "iPhone Xs" : constantValue = -30 // If you want to set constraint at 30 instead of 25
default : constantValue = -25
}
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0))
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: constantValue))
}
I do not see where you get lost.
Replies
The simplest (and easiest to maintain) is to do it in code.
- create the constraint in IB
- asociate an IBOutlet to the constraint
@IBOutlet var myConstraint: NSLayoutConstraint!
- at the end of viewDidload, test for device
let modelName = UIDevice.current.name
- and adapt constraint constant to the desired value.
switch modelName {
case "iPhone 8 Plus" : myConstraint.constant = 50
case "iPhone X", "iPhone XS" : myConstraint.constant = 30
default : myConstraint.constant = 30
}
You should look for the different names if you want to be specific to some device
I have this code for apple pay:
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: -25))
I also added an outlet for a constraint. I wanted to know how would I make the constraint a different number on one device like the iPhone x and another number on another device like the 8 Plus.
Here you create the constraint by code. I propose a simpler solution, to create a constraint in IB then adapt in code.
Nevertheless, if you want to take the hard road (in that case, don't create IBOutlet):
let modelName = UIDevice.current.name
var myConstraint = NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: -25)) // negative, depending who is first and who is second
switch modelName {
case "iPhone 8 Plus" : myConstraint.constant = -50
case "iPhone X", "iPhone XS" : myConstraint.constant = -30
default : myConstraint.constant = -25
}
view.addConstraint(myConstraint)
Edited: the name here is the name given to the device, not the device type.
To get device type, see
h ttps://stackoverflow.com/questions/26028918/how-to-determine-the-current-iphone-device-model
This covers all models including TVOS !
create an extension:
public extension UIDevice {
static let modelName: String = {
var systemInfo = utsname()
uname(&systemInfo)
let machineMirror = Mirror(reflecting: systemInfo.machine)
let identifier = machineMirror.children.reduce("") { identifier, element in
guard let value = element.value as? Int8, value != 0 else { return identifier }
return identifier + String(UnicodeScalar(UInt8(value)))
}
func mapToDevice(identifier: String) -> String { // swiftlint:disable:this cyclomatic_complexity
#if os(iOS)
switch identifier {
case "iPod5,1": return "iPod Touch 5"
case "iPod7,1": return "iPod Touch 6"
case "iPhone3,1", "iPhone3,2", "iPhone3,3": return "iPhone 4"
case "iPhone4,1": return "iPhone 4s"
case "iPhone5,1", "iPhone5,2": return "iPhone 5"
case "iPhone5,3", "iPhone5,4": return "iPhone 5c"
case "iPhone6,1", "iPhone6,2": return "iPhone 5s"
case "iPhone7,2": return "iPhone 6"
case "iPhone7,1": return "iPhone 6 Plus"
case "iPhone8,1": return "iPhone 6s"
case "iPhone8,2": return "iPhone 6s Plus"
case "iPhone9,1", "iPhone9,3": return "iPhone 7"
case "iPhone9,2", "iPhone9,4": return "iPhone 7 Plus"
case "iPhone8,4": return "iPhone SE"
case "iPhone10,1", "iPhone10,4": return "iPhone 8"
case "iPhone10,2", "iPhone10,5": return "iPhone 8 Plus"
case "iPhone10,3", "iPhone10,6": return "iPhone X"
// Need to complement here for iPhoneXs, Xs max, Xr
// I think it this
case "iPhone11,8": return "iPhone Xr"
case "iPhone11,2": return "iPhone Xs"
case "iPhone11,4": return "iPhone Xs Max" case "iPad2,1", "iPad2,2", "iPad2,3", "iPad2,4":return "iPad 2"
case "iPad3,1", "iPad3,2", "iPad3,3": return "iPad 3"
case "iPad3,4", "iPad3,5", "iPad3,6": return "iPad 4"
case "iPad4,1", "iPad4,2", "iPad4,3": return "iPad Air"
case "iPad5,3", "iPad5,4": return "iPad Air 2"
case "iPad6,11", "iPad6,12": return "iPad 5"
case "iPad7,5", "iPad7,6": return "iPad 6"
case "iPad2,5", "iPad2,6", "iPad2,7": return "iPad Mini"
case "iPad4,4", "iPad4,5", "iPad4,6": return "iPad Mini 2"
case "iPad4,7", "iPad4,8", "iPad4,9": return "iPad Mini 3"
case "iPad5,1", "iPad5,2": return "iPad Mini 4"
case "iPad6,3", "iPad6,4": return "iPad Pro 9.7 Inch"
case "iPad6,7", "iPad6,8": return "iPad Pro 12.9 Inch"
case "iPad7,1", "iPad7,2": return "iPad Pro 12.9 Inch 2. Generation"
case "iPad7,3", "iPad7,4": return "iPad Pro 10.5 Inch"
case "AppleTV5,3": return "Apple TV"
case "AppleTV6,2": return "Apple TV 4K"
case "AudioAccessory1,1": return "HomePod"
case "i386", "x86_64": return "Simulator \(mapToDevice(identifier: ProcessInfo().environment["SIMULATOR_MODEL_IDENTIFIER"] ?? "iOS"))"
default: return identifier
}
#elseif os(tvOS)
switch identifier {
case "AppleTV5,3": return "Apple TV 4"
case "AppleTV6,2": return "Apple TV 4K"
case "i386", "x86_64": return "Simulator \(mapToDevice(identifier: ProcessInfo().environment["SIMULATOR_MODEL_IDENTIFIER"] ?? "tvOS"))"
default: return identifier
}
#endif
}
return mapToDevice(identifier: identifier)
}()
}
Then call:
let modelName = UIDevice.modelName
var myConstraint = NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: -25)) // negative, depending who is first and who is second
switch modelName {
case "iPhone 8 Plus" : myConstraint.constant = -50
case "iPhone X", "iPhone Xs" : myConstraint.constant = -30
default : myConstraint.constant = -25
}
view.addConstraint(myConstraint)
I forgot to add the code that I currently have:
private func addApplePayPaymentButtonToView() {
let paymentButton = PKPaymentButton(paymentButtonType: .buy, paymentButtonStyle: .black)
paymentButton.translatesAutoresizingMaskIntoConstraints = false
paymentButton.addTarget(self, action: #selector(applePayButtonTapped(sender:)), for: .touchUpInside)
view.addSubview(paymentButton)
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0))
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: -25))
}
Would the code you suggested work with this?
It should.
Just set the value of constant there
private func addApplePayPaymentButtonToView() {
let paymentButton = PKPaymentButton(paymentButtonType: .buy, paymentButtonStyle: .black)
paymentButton.translatesAutoresizingMaskIntoConstraints = false
paymentButton.addTarget(self, action: #selector(applePayButtonTapped(sender:)), for: .touchUpInside)
view.addSubview(paymentButton)
var constantValue = -25
let modelName = UIDevice.modelName
switch modelName {
case "iPhone 8 Plus" : constantValue = -50
case "iPhone X", "iPhone Xs" : constantValue = -30
default : constantValue = -25
}
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0))
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: constantValue))
}
Would you mind showing me what the code would look like all together I'm a little confused?
You have the complete code:
- the extension, that you can declare outside of the class
- addApplePayPaymentButtonToView()
as I wrote it
I understoof that you wanted to adapt the bottom constraint only.
private func addApplePayPaymentButtonToView() {
let paymentButton = PKPaymentButton(paymentButtonType: .buy, paymentButtonStyle: .black)
paymentButton.translatesAutoresizingMaskIntoConstraints = false
paymentButton.addTarget(self, action: #selector(applePayButtonTapped(sender:)), for: .touchUpInside)
view.addSubview(paymentButton)
var constantValue = -25
let modelName = UIDevice.modelName
switch modelName {
case "iPhone 8 Plus" : constantValue = -50 // If you want to set constraint at 50 instead of 25
case "iPhone X", "iPhone Xs" : constantValue = -30 // If you want to set constraint at 30 instead of 25
default : constantValue = -25
}
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0))
view.addConstraint(NSLayoutConstraint(item: paymentButton, attribute: .bottom, relatedBy: .equal, toItem: view, attribute: .bottom, multiplier: 1, constant: constantValue))
}
I do not see where you get lost.
Claude31’s first answer was about what I do (use an IBOutlet for the constraint, and change it in code).
I don’t recommend anything using model names, however. You would have to update your iPhone X code for iPhone XS, for example. Better is to figure out why you’re using the different constraint. Is it because there are non-zero safe insets? Is it because the screen is wider than 16 * 9? Make your decision based on those factors, and you’re more likely to be safe for the future.
+1 to this. Avoid "if model name == some hardcoded value" like the plague. It's far better to use heuristics (size classes, screen aspect ratio, margins, readable content guides etc.) if at all possible.