如何在视图之间创建具有可变间距的 UIStackView? [英] How can I create UIStackView with variable spacing between views?

问题描述

我有一个简单的水平 UIStackView，里面有几个 UIView.我的目标是在视图之间创建可变间距.我很清楚我可以使用间距"属性在子视图之间创建恒定空间.但是我的目标是创建可变空间.请注意，如果可能的话，我希望避免使用充当分隔符的不可见视图.

I have a simple horizontal UIStackView with several UIViews stacked inside. My goal is to create variable spacing between views. I am well aware that I can create constant space between the subviews using "spacing" property. However my goal is to create variable space. Please note, if at all possible, I would like to avoid using invisible views that act as spacers.

我想出的最好的方法是将我的 UIViews 包装在一个单独的 UIStackView 中，并使用 layoutMarginsRelativeArrangement = YES 来尊重布局边距我的内部堆栈.我希望我可以对任何 UIView 做类似的事情，而无需求助于这种丑陋的解决方法.这是我的示例代码:

The best I came up with was to wrap my UIViews in a separate UIStackView, and use layoutMarginsRelativeArrangement = YES to respect layout margins of my inner stack. I was hoping I could do something similar with any UIView without resorting to this ugly work-around. Here is my sample code:

// Create stack view
UIStackView *stackView = [[UIStackView alloc] init];
stackView.translatesAutoresizingMaskIntoConstraints = NO;
stackView.axis = UILayoutConstraintAxisHorizontal;
stackView.alignment = UIStackViewAlignmentCenter;
stackView.layoutMarginsRelativeArrangement = YES;

// Create subview
UIView *view1 = [[UIView alloc] init];
view1.translatesAutoresizingMaskIntoConstraints = NO;
// ... Add Auto Layout constraints for height / width
// ...
// I was hoping the layoutMargins would be respected, but they are not
view1.layoutMargins = UIEdgeInsetsMake(0, 25, 0, 0);

// ... Create more subviews
// UIView view2 = [[UIView alloc] init];
// ...

// Stack the subviews
[stackView addArrangedSubview:view1];
[stackView addArrangedSubview:view2];

结果是一个视图的堆栈，它们之间有间距:

The result is a stack with views right next to each other with spacing:

推荐答案

更新 iOS 11，StackViews with Custom Spacing

Apple 在 iOS 11 中添加了设置自定义间距的功能.您只需在每个排列的子视图之后指定间距.不幸的是，您之前不能指定间距.

Apple has added the ability to set custom spacing in iOS 11. You simply have to specify the spacing after each arranged subview. Unfortunately you can't specify spacing before.

stackView.setCustomSpacing(10.0, after: firstLabel)
stackView.setCustomSpacing(10.0, after: secondLabel)

仍然比使用自己的视图更好.

Still way better than using your own views.

适用于 iOS 10 及更低版本

您可以简单地在堆栈视图中添加一个透明视图并为其添加宽度约束.

You could simply add a transparent views into your stack view and add width constraints to them.

(标签 - UIView - 标签 - UIView -Label)

(Label - UIView - Label - UIView -Label)

如果你保留 distribution 来填充，那么你可以在你的 UIViews 上设置可变宽度约束.

and if you keep distribution to fill, then you can setup variable width constraints on your UIViews.

但如果是这种情况，我会考虑这是否是使用 stackviews 的正确情况.自动布局使得在视图之间设置可变宽度变得非常容易.

But I would consider if this is the right situation to use stackviews if that's the case. Autolayout makes it very easy to setup variable widths between views.

这篇关于如何在视图之间创建具有可变间距的 UIStackView?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！