什么约束会阻止我的UIViews堆叠在彼此的顶部？ [英] What constraints would prevent my UIViews from stacking on top of each other?

问题描述

我的UIView的堆叠在一起，如此：

My UIView's are stacking up on top of each other like so :

每个UIView都在 wordContainer 中。每个UIView有两个 UILabel 里面

Each UIView is inside a wordContainer. Each UIView has two UILabel's inside of it

我创建每个单独的UIView有两个孩子UILabel的，像这样：

I create each individual UIView with two child UILabel's like so :

    var labels = [UIView]()
    for word in words {

        let wordLabel               = UILabel(frame: CGRectZero)
        wordLabel.text              = word.valueForKey("sanskrit") as? String
        wordLabel.numberOfLines     = 0
        wordLabel.sizeToFit()
        wordLabel.translatesAutoresizingMaskIntoConstraints = false

        let englishWordLabel           = UILabel(frame: CGRectMake(wordLabel.frame.width + 10,0,0,0))
        englishWordLabel.text          = word.valueForKey("english") as? String)
        englishWordLabel.numberOfLines = 0
        englishWordLabel.sizeToFit()
        englishWordLabel.lineBreakMode     = .ByWordWrapping
        englishWordLabel.translatesAutoresizingMaskIntoConstraints = false

        let wordView = UIView(frame: CGRectMake(0,0,self.view.frame.width,englishWordLabel.frame.height))
        wordView.translatesAutoresizingMaskIntoConstraints = false
        wordView.addSubview(wordLabel)
        wordView.addSubview(englishWordLabel)

        wordView.sizeToFit()

        labels.append(wordView)
    }

然后我把这个UIView集合，并把它们添加到我的 wordContainer 。这是我想象的部分，我应该设置NSLayoutConstraints。这个想法是，我想让他们所有的堆叠在彼此的正确。例如，它应该看起来像这样：

Then I take this collection of UIView's and add them to my wordContainer. This is the part, where I imagine, I should be setting NSLayoutConstraints. The idea is that I want them all to stack up on top of each other properly. For example, it should look like this :

word: definition
word: definition
word: definition
word: definition

但是它看起来像这样：

我将它们添加到 wordContainer 像这样：

I add them into the wordContainer like so :

    let wordContainer  = UIView(frame: CGRectZero)

    var currentY:CGFloat      = 0.0
    let margin_height:CGFloat = 4.0
    var height:CGFloat        = 0

    for view in wordViews {
        var rect = view.frame
        rect.origin.y = currentY
        view.frame = rect

        currentY += view.frame.height
        height += view.frame.height

        wordContainer.addSubview(view)

    }
    let containRect = CGRectMake(0,0,self.view.frame.width, height)
    wordContainer.frame = containRect

然后我为 wordContainer 它们有效地允许所有单词的空间存在，如果它们没有彼此堆叠：

And then I set my constraints for the wordContainer which effectually allows the space for all the words to exist if they weren't piled on top of each other :

   wordContainer.bottomAnchor.constraintEqualToAnchor(cell.contentView.bottomAnchor).active     = true
   wordContainer.topAnchor.constraintEqualToAnchor(cell.contentView.topAnchor).active           = true

我最新的想法是，也许我应该添加约束。我已经尝试添加 NSLayoutConstraints 到单元格的高度，当我做所有的话不再适当布局。相反，它们堆叠在彼此的顶部。但这似乎是正确的方向..

My latest idea is that maybe I should be adding constraints to this. I have experimented with adding NSLayoutConstraints to the height of the cell, and when I do all the words no longer are appropriately laid out. Instead, they are stacked on top of each other. But this seems like the right direction..

推荐答案

为了让单元格自动调整其高度contentView内的内容对contentView的所有4个边都有约束。

In order for the cell to adjust its height automatically your content inside the contentView must have constraints against all 4 edges of the contentView.

我刚刚用不同的单元格类型来完成这个工作，用于文本，图像和嵌入的tweets， ve描述。我发现最简单的方法是在内容视图中添加一个视图，围绕任何组件，然后你可以轻松地添加约束到该元素周围。

I have just done this myself with different cell types for text, images and embedded tweets and had some of the issues you've described. I found the easiest way was to add a view around any components within the content view and then you can easily add the constraints to that element all around.

我刚刚快速浏览了一些可以证明这一点，并找到另一个

I've just had a quick look around for something that can demonstrate this and found another SO answer that explains it with a few screenshots.

此外，我今天使用的参考是 Ray Wenderlich的网站上的此帖

Also the reference I used when doing this today was This post on Ray Wenderlich's site

这篇关于什么约束会阻止我的UIViews堆叠在彼此的顶部？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！