在uitableview上设置视图动画

Question

I have a UINavigationController that has my custom ViewController with a tableView in it that takes up the whole screen.

I want to push down the tableView and reveal a settings menu with just a couple items. My SettingsView.xib I created in a separate nib that is 320 x 90 and just has a single UISegmentedControl in it.

I have an Outlet for the NSLayoutConstraint I created between the tableView and the top layout guide. When my settingsButton is pressed, I do this

func showSettings(sender: UIBarButtonItem) {
    println(String(format: "%@", NSStringFromCGRect(settingsView.frame)))
    println(String(format: "tableview %@", NSStringFromCGRect(tableView.frame)))
    isSettingsOpen = !isSettingsOpen
    settingsHeightConstraint.constant = isSettingsOpen ? 90.0 : -64.0

    UIView.animateWithDuration(1.0, delay: 0.0, usingSpringWithDamping: 0.4, initialSpringVelocity: 8.0, options: .CurveEaseIn, animations: {
        self.view.layoutIfNeeded()
        }, completion: nil)
}

That part slides down as I expect. Then I added the settingsView like so:

lazy var settingsView: UIView = self.initializeSettingsView()

func initializeSettingsView() -> UIView {
    let nib = UINib(nibName: "SettingsView", bundle: nil)
    let nibView = nib.instantiateWithOwner(self, options: nil)[0] as! UIView
    return nibView;
}

    // in viewDidLoad
    settingsView.center.y -= self.settingsView.frame.height
    view.addSubview(settingsView)

    var constraints = [NSLayoutConstraint]()
    constraints.append(NSLayoutConstraint(item: settingsView, attribute: NSLayoutAttribute.Bottom, relatedBy: .Equal, toItem: tableView, attribute: .Top, multiplier: 1.0, constant: 0.0))  // this constraint seems to be the problem one
    constraints.append(NSLayoutConstraint(item: settingsView, attribute: .Left, relatedBy: .Equal, toItem: tableView, attribute: .Left, multiplier: 1.0, constant: 0.0))
    constraints.append(NSLayoutConstraint(item: settingsView, attribute: .Right, relatedBy: .Equal, toItem: tableView, attribute: .Right, multiplier: 1.0, constant: 0.0))
    NSLayoutConstraint.activateConstraints(constraints)

Then I get ambiguous layout. I know that the height constraint that I try to animate and the first constraint that I put a comment on are conflicting with each other because if I comment one of those lines out, I don't get the error message.

What I'm trying to do with that first constraint is just have the settingsView "pinned" to the edge of the tableView so that way when I animate the tableView moving downwards by 90.0 then the settingsView would go with it.

This doesn't seem to be the case and I can't figure out why. I haven't really done much with animating views when constraints are involved. Did I set this up correctly? Do I need to remove one of the constraints and then add a different one? Thanks in advance.

Answer 1

In initializeSettingsView() add nibView.setTranslatesAutoresizingMaskIntoConstraints(false) . And then in viewDidload add the hight constraint to settingsView

constraints.append(NSLayoutConstraint(item: settingsView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: 90.0))

And you do not need to set the position of settingsView , since it will be layout at the right position based on the constraints you add. So just remove settingsView.center.y -= settingsView.frame.size.height