Почему эти кнопки не отображаются правильно в устройствах большего размера? (Swift)

Question

Я выложил свое приложение в Xcode, используя вид iPhone SE. Кнопки и т. Д. Появляются под тестированием, как они должны.

Однако, когда я тестирую на большом экране, то есть на iPhone 7 возникает пара странных вещей.

1) Кнопки обнимают правую часть, даже если я ограничения установлен быть 20px от краев

А во-вторых, градиент, который я применил к своим кнопкам, кажется, остановить 3/4 по кнопке в этом случае:

это тот же код вызывается в каждом экземпляре кнопки:

let orangeGradient = CAGradientLayer().orangeButtonColor() 
    orangeGradient.frame = self.joinCommunityButton.bounds 
    self.joinCommunityButton.layer.insertSublayer(orangeGradient, at: 0) 

extension CAGradientLayer { 

func bespokeColor() -> CAGradientLayer { 

let topColor = UIColor(red: (46/255.0), green: (63/255.0),blue: (81/255.0), alpha: 1) 
let bottomColor = UIColor(red: (22/255.0), green: (31/255.0),blue: (41/255.0), alpha: 1) 
let gradientColors: [CGColor] = [topColor.cgColor, bottomColor.cgColor] 
let gradientLocations: [Float] = [0.0, 1.0] 

let gradientLayer: CAGradientLayer = CAGradientLayer() 
gradientLayer.colors = gradientColors 
gradientLayer.locations = gradientLocations as [NSNumber]? 

return gradientLayer 

} 

func orangeButtonColor() -> CAGradientLayer { 

    let topColor = UIColor(red: (211/255.0), green: (115/255.0),blue: (28/255.0), alpha: 1) 
    let bottomColor = UIColor(red: (171/255.0), green: (80/255.0),blue: (14/255.0), alpha: 1) 
    let gradientColors: [CGColor] = [topColor.cgColor, bottomColor.cgColor] 
    let gradientLocations: [Float] = [0.0, 1.0] 

    let gradientLayer: CAGradientLayer = CAGradientLayer() 
    gradientLayer.colors = gradientColors 
    gradientLayer.locations = gradientLocations as [NSNumber]? 

    return gradientLayer 

} 

func purpleButtonColor() -> CAGradientLayer { 

    let topColor = UIColor(red: (112/255.0), green: (41/255.0),blue: (183/255.0), alpha: 1) 
    let bottomColor = UIColor(red: (85/255.0), green: (19/255.0),blue: (159/255.0), alpha: 1) 
    let gradientColors: [CGColor] = [topColor.cgColor, bottomColor.cgColor] 
    let gradientLocations: [Float] = [0.0, 1.0] 

    let gradientLayer: CAGradientLayer = CAGradientLayer() 
    gradientLayer.colors = gradientColors 
    gradientLayer.locations = gradientLocations as [NSNumber]? 

    return gradientLayer 

} 

func greenButtonColor() -> CAGradientLayer { 

    let topColor = UIColor(red: (35/255.0), green: (193/255.0),blue: (67/255.0), alpha: 1) 
    let bottomColor = UIColor(red: (31/255.0), green: (148/255.0),blue: (53/255.0), alpha: 1) 
    let gradientColors: [CGColor] = [topColor.cgColor, bottomColor.cgColor] 
    let gradientLocations: [Float] = [0.0, 1.0] 

    let gradientLayer: CAGradientLayer = CAGradientLayer() 
    gradientLayer.colors = gradientColors 
    gradientLayer.locations = gradientLocations as [NSNumber]? 

    return gradientLayer 

} 


} 

Вот скриншот того, что я считаю, являются параметры автоматической компоновки:

Answer 1

viewDidLoad, autoLayout еще не вступил в силу, поэтому ваша кнопка bounds не являются конкретными устройствами.

Помещенный

orangeGradient.frame = self.joinCommunityButton.bounds в viewDidLayoutSubviews или viewDidAppear

Убедитесь, что добавить градиенты или выполнения задач, связанных с UIView кадра или границ послеviewDidLayoutSubviews, привлекаемого , если вы используете autoLayout.

Кроме того,

Не помещайте инициализацию CAGradientLayer() внутри viewDidAppear или viewDidLayoutSubviews функций как они называются несколько раз и будут продолжать добавлять слои к вашим UIView, вы должны просто изменить границы внутри этих двух методов ,

Answer 2

Пожалуйста, убедитесь, что вы используете AutoLayout в интерфейсе builder.If вы используете то сделать уверен, что они тоже оставили маржу.