1

I've a fairly difficult layout design that might be easier using nested stack views in iOS. BUT, I'm having problems controlling the size or distribution of stacks nested inside other stacks. One part of the layout, for example, looks OK-ish if I set Distribution to Fit Equally: enter image description here

BUT, what I really want is the photo and container to be about 1/3 the width of the text field stack. If I set Distribution to Fit Proportionally, the stack with the image (which doesn't change size) and container spreadout and squash the text against the side of the display. Everything I read suggests to reduce the Content Compression Resistance Priority. I've tried this on the image, the container and on the stack view itself, but it doesn't do much.

Could someone please point me in the right direction to control the relative widths of stacks nested inside other stacks?

4

3 回答 3

2

回答您的问题：有人可以指出我正确的方向来控制嵌套在其他堆栈中的堆栈的相对宽度吗？ ...

问题是您的顶层 在确定如何根据每个子视图的返回及其 contentHuggingPriority/contentCompressionResistance来确定如何将额外的空间/挤压事物分开时，UIStackView要求其所有子视图。不幸的是，它本身 - 即你的嵌套- 不会返回任何对它自己有用的东西（尽管它有自己的子视图，它确实如此）。因此，顶级 UIStackView 只是向前推进并布置事情，就好像嵌套的 UIStackView 不在乎，这就是为什么您的嵌套 UIStackView 最终会比您想要的更宽。intrinsicContentSizeintrinsicContentSizeUIStackView UIStackViewintrinsicContentSize

我很幸运，UIStackView为嵌套子类使用了一个简单的子类，该子类intrinsicContentSize根据其自身内容的宽度（对于垂直轴）或高度（对于水平轴）返回有用的，如下所示：

@implementation NestedStackView
- (CGSize)intrinsicContentSize
{
    CGSize size = [super intrinsicContentSize]; // returns {UIViewNoIntrinsicMetric,UIViewNoIntrinsicMetric}

    for (UIView *view in self.arrangedSubviews)
        if (!view.hidden) { // UIStackView ignores hidden subviews when doing its layout; so should we...
            if (self.axis == UILayoutConstraintAxisVertical) {
                size.width = MAX(view.intrinsicContentSize.width, size.width);
            } else {
                size.height = MAX(view.intrinsicContentSize.height, size.height);
            }
        }
    return size;
}
@end

通过这样做，顶级UIStackView 现在在分配其空间时会考虑嵌套UIStackView 所需的内容宽度。[旁白：我首先尝试在嵌套的 UIStackView 的宽度上添加一个显式的 NSLayoutConstraint，但它只是被忽略了。而返回 instrinsicContentSize.width 有效]

于 2016-05-18T02:46:07.777 回答
1

我希望可能有更好的答案，但我发现的唯一有效方法是将图像放入视图并将其固定到视图的边缘。然后可以使用约束来控制视图的大小。

如果有人有更好的方法，他们仍然可以作为这个更详细问题的一部分来回答： https ://stackoverflow.com/questions/33875801/how-to-position-and-size-images-and-their-frames-in -嵌套堆栈视图在 ib-w

于 2015-11-25T11:06:21.140 回答
0

一种简单的方法是使用 AutoLayout 在嵌套堆栈视图上设置相对宽度约束。例如，如果你想让你的左边UIStackView填满屏幕的 2/3，你的右边UIStackView填满 1/3，你可以使用下面的代码。

let leftStackView = UIStackView(arrangedSubviews: [...])
leftStackView.axis = .vertical

let rightStackView = UIStackView(arrangedSubviews: [...])
rightStackView.axis = .vertical

let containerStackView = UIStackView(arrangedSubviews:
                                     [leftStackView, rightStackView])

containerStackView.axis = .horizontal
containerStackView.distribution = .fillProportionally
containerStackView.translatesAutoresizingMaskIntoConstraints = false

addSubview(containerStackView)

//leftStackView will be twice as wide as the rightStackView, so 
//the distribution is 2/3rds to 1/3rd
leftStackView.widthAnchor.constraint(equalTo:
  rightStackView.widthAnchor, multiplier: 2.0).isActive = true
于 2018-04-24T19:48:36.530 回答