Нежелательная высота кнопки вычисляется с использованием языка визуального форматирования

Question

У меня есть UIViewController с четырьмя UIButtons (2 x 2) на нем, которые я написал в построителе интерфейса, который отлично работал. У меня будет бесплатная и поддерживаемая рекламой версия моего приложения, поэтому мне нужно переделать эту сцену для загрузки на основе того, является ли приложение платной или поддерживаемой рекламой версией. Исходя из этого, я пытаюсь использовать язык визуального форматирования, чтобы выложить представление. Я получаю неправильные значения для моих высот UIButton, несмотря на их учет, когда я их вычисляю. Я не могу понять свою ошибку (или упущение?).

Вот скриншот моего интерфейса-строителя.

У меня нет ограничений на мои кнопки в интерфейсе строителя, но я уже IBOutlets подключен к MyViewController. MyViewController находится в навигационном контроллере и имеет панель вкладок внизу.

Я создал метод, называемый layoutButtons, который я вызываю в viewDidLoad сразу после super.viewDidLoad(). Вот оно:

func layoutButtons() { 
    // Configure layout constraints 

    // Remove interface builder constraints from storyboard 
    view.removeConstraints(view.constraints) 

    // create array to dump constraints into 
    var allConstraints = [NSLayoutConstraint]() 

    // determine screen size 
    let screenSize: CGRect = UIScreen.mainScreen().bounds 

    let navBarRect = navigationController!.navigationBar.frame 
    let navBarHeight = navBarRect.height 

    let tabBarRect = tabBarController!.tabBar.frame 
    let tabBarHeight: CGFloat = tabBarRect.height 

    // calculate button width based on screen size 

    // padding for left + middle + right = 8.0 + 8.0 + 8.0 = 24.0 
    let buttonWidth = (screenSize.width - 24.0)/2 

    /* 
    My buttons are extending under the top & bottom layout guides despite accounting 
    for them when I set the buttonHeight. 
    */ 

    // padding for top + middle + bottom = 8.0 + 8.0 + 8.0 = 24.0 
    let buttonHeight = (screenSize.height - topLayoutGuide.length - bottomLayoutGuide.length - 24.0)/2 

    // create dictionary of metrics 
    let metrics = ["buttonWidth": buttonWidth, 
     "buttonHeight": buttonHeight, 
     "navBarHeight": navBarHeight, 
     "tabBarHeight": tabBarHeight, 
     "bannerAdWidth": bannerAdWidth, 
     "bannerAdHeight": bannerAdHeight] 

    // create dictionary of views 
    var views: [String : AnyObject] = ["firstButton": firstButton, 
     "secondButton": secondButton, 
     "thirdButton": thirdButton, 
     "fourthButton": fourthButton, 
     "topLayoutGuide": topLayoutGuide, 
     "bottomLayoutGuide": bottomLayoutGuide] 

    let topRowHorizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "H:|-[firstButton(buttonWidth)]-[secondButton(buttonWidth)]-|", 
     options: [.AlignAllCenterY], 
     metrics: metrics, 
     views: views) 
    allConstraints += topRowHorizontalConstraints 

    let bottomRowHorizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "H:|-[thirdButton(buttonWidth)]-[fourthButton(buttonWidth)]-|", 
     options: [.AlignAllCenterY], 
     metrics: metrics, 
     views: views) 
    allConstraints += bottomRowHorizontalConstraints 

    let leftColumnVerticalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "V:|[topLayoutGuide]-[firstButton(buttonHeight)]-[thirdButton(buttonHeight)]-[bottomLayoutGuide]|", 
     options: [], 
     metrics: metrics, 
     views: views) 
    allConstraints += leftColumnVerticalConstraints 

    let rightColumnVerticalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "V:|[topLayoutGuide]-[secondButton(buttonHeight)]-[fourthButton(buttonHeight)]-[bottomLayoutGuide]|", 
     options: [], 
     metrics: metrics, 
     views: views) 
    allConstraints += rightColumnVerticalConstraints 

    NSLayoutConstraint.activateConstraints(allConstraints) 
} 

Я возился с моей buttonHeight переменной, но каждая итерация я попробовал результаты в кнопках простирающийся под topLayoutGuide и bottomLayoutGuide. Вот как это выглядит во время исполнения:

Я приветствую любые предложения, где искать свою ошибку. Спасибо за чтение.

Answer 1

Первоначально я следовал Ray Wenderlich's Visual Format Language tutorial и установка обучающей программы была похожа на мой, в том, что subViews были на раскадровке и подключены к MyViewController с IBOutlets.

Из отчаяния я обнародовал раскадровку и создал код UIButtons. По пути я обнаружил, что проблема заключается в том, что я устанавливал изображение на кнопку, прежде чем она была выложена. Мораль этой истории не устанавливает изображения на UIButtons, пока они не выложены!

Ниже приведен код вызывается из метода в моем viewDidLoad, что выкладывает сетку 2 х 2 кнопок:

// Configure Buttons 
    firstButton.translatesAutoresizingMaskIntoConstraints = false 
    // code to customize button 

    secondButton.translatesAutoresizingMaskIntoConstraints = false 
    // code to customize button 

    thirdButton.translatesAutoresizingMaskIntoConstraints = false 
    // code to customize button 

    fourthButton.translatesAutoresizingMaskIntoConstraints = false 
    // code to customize button 

    // Add buttons to the subview 
    view.addSubview(firstButton) 
    view.addSubview(secondButton) 
    view.addSubview(thirdButton) 
    view.addSubview(fourthButton) 

    // create views dictionary 
    var allConstraints = [NSLayoutConstraint]() 

    let views: [String : AnyObject] = ["firstButton": firstButton, 
     "secondButton": secondButton, 
     "thirdButton": thirdButton, 
     "fourthButton": fourthButton, 
     "topLayoutGuide": topLayoutGuide, 
     "bottomLayoutGuide": bottomLayoutGuide] 

    // Calculate width and height of buttons 
    // 24.0 = left padding + middle padding + right padding 
    let buttonWidth = (screenSize.width - 24.0)/2 
    let buttonHeight = (screenSize.height - topLayoutGuide.length - bottomLayoutGuide.length - 24.0)/2 

    // Create a dictionary of metrics 
    let metrics = ["buttonWidth": buttonWidth, 
    "buttonHeight" : buttonHeight] 

    let topVerticalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "V:|[topLayoutGuide]-[firstButton(buttonHeight)]", 
     options: [], 
     metrics: metrics, 
     views: views) 
    allConstraints += topVerticalConstraints 

    let topRowHorizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "H:|-[firstButton(buttonWidth)]-[secondButton(==firstButton)]-|", 
     options: NSLayoutFormatOptions.AlignAllCenterY, 
     metrics: metrics, 
     views: views) 
    allConstraints += topRowHorizontalConstraints 

    let bottomRowHorizontalContraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "H:|-[thirdButton(buttonWidth)]-[fourthButton(==thirdButton)]-|", 
     options: NSLayoutFormatOptions.AlignAllCenterY, 
     metrics: metrics, 
     views: views) 
    allConstraints += bottomRowHorizontalContraints 

    let leftColumnVerticalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
     "V:[firstButton]-[thirdButton(==firstButton)]-[bottomLayoutGuide]-|", 
     options: [], 
     metrics: metrics, 
     views: views) 
    allConstraints += leftColumnVerticalConstraints 

    let rightColumnVerticalConstriants = NSLayoutConstraint.constraintsWithVisualFormat(
     "V:[secondButton(buttonHeight)]-[fourthButton(==secondButton)]-[bottomLayoutGuide]-|", 
     options: [], 
     metrics: metrics, 
     views: views) 
    allConstraints += rightColumnVerticalConstriants 

    NSLayoutConstraint.activateConstraints(allConstraints) 

    // ** DON'T SET IMAGES ON THE BUTTONS UNTIL THE BUTTONS ARE LAID OUT!!!** 
    firstButton.imageView?.contentMode = UIViewContentMode.ScaleAspectFit 
    firstButton.setImage(UIImage(named: "first.png"), forState: .Normal) 

    secondButton.imageView?.contentMode = UIViewContentMode.ScaleAspectFit 
    secondButton.setImage(UIImage(named: "second.png"), forState: .Normal) 

    thirdButton.imageView?.contentMode = UIViewContentMode.ScaleAspectFit 
    thirdButton.setImage(UIImage(named: "third.png"), forState: .Normal) 

    fourthButton.imageView?.contentMode = UIViewContentMode.ScaleAspectFit 
    fourthButton.setImage(UIImage(named: "fourth.png"), forState: .Normal)