如何添加前导填充以添加到UIStackView中添加的视图


125

这是我的设置:我的UIScrollView前缘,前缘,试验边缘均设置为0。在其中添加了UIStackView以下约束:

stackView.centerYAnchor.constraintEqualToAnchor(selectedContactsScrollView.centerYAnchor).active = true  
stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

在堆栈视图中,我添加了一些视图。
我的问题是,由于种种限制,添加到堆栈视图的第一个视图也将具有前导边缘= 0。

我可以在第一个视图中添加一些填充的方法是什么?无需调整滚动视图约束。


2
您会改变接受的答案吗?托尔加的答案似乎更好。
亲爱的

Answers:


26

您提供的解决方案不会在UIStackView中添加视图的填充(如您在问题中所希望的),但是会为UIStackView添加引导。

一种解决方案是在原始UIStackView内添加另一个UIStackView并引导至此新的UIStackVIew。然后,将视图添加到这个新的UIStackView中。

提示,您可以使用Interface Builder完全做到这一点。换句话说,无需为此编写代码。


373

isLayoutMarginsRelativeArrangementproperty为true时,堆栈视图将相对于其布局边距布局其已安排的视图。

stackView.layoutMargins = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
stackView.isLayoutMarginsRelativeArrangement = true

但这会影响堆栈视图内部的所有已排列视图。如果您只想在一个排列的视图中使用此填充,则需要使用嵌套UIStackView


2
isLayoutMarginsRelativeArrangement是吸气剂,二传手是layoutMarginsRelativeArrangement。我无法编辑答案
maross

5
@maross在Swift中,getter和setter函数之间没有区别。但是您是对的,使用Objective-C开发的人应该使用它layoutMarginsRelativeArrangement。正式文件:developer.apple.com/reference/uikit/uistackview/...
托加奥库

3
对于Objective-C:stackView.layoutMargins = UIEdgeInsetsMake(0, 20, 0, 20); [stackView setLayoutMarginsRelativeArrangement:YES];
Snouto

4
2019年2月,午夜时分,坐在办公室里 -这样的回答使我有前进的力量。感谢@tolpp
nefarianblack

155

我发现约束在堆栈视图中不起作用,或者它们看起来有些奇怪。

(就像我将前导/尾随约束添加到图像stackview上的选定对象一样,这也将前导/尾随约束添加到collectionview,但不添加尾随;并且肯定会发生冲突)。

stackview内部stackview

要为stackview内的所有视图设置布局边距,请选择:

Stack View > Size Inspector > Layout Margins > Fixed

注意:如屏幕截图所示,该"Fixed"选项以前称为"Explicit"

然后添加您的填充:

故事板


23
苹果公司隐藏的事情之一。我讨厌Xcode与好的,友好的和容易的相反。谢谢
鸭子

当我更改那些显式的布局边距时,Xcode继续崩溃。提交了一个错误,但他们答复说是重复的。
mvandillen

那就是我在UI中找不到的东西。将布局边距更改为显式以查看堆栈视图边距的字段。
pkamb

13
现在,FYI XCode 9将此称为“固定”,而不是“显式”。
梅尔(Mel)

同样在Xcode 9中,取消选中文件检查器中的“使用安全区域布局指南”,在撰写本文时,这仍然会导致IB中出现很多问题,并坚持使用常规布局指南来约束您。
PJ_Finnegan

16

对我有用的是在堆栈视图中添加另一个只是分隔符的UIView(至少与stackView.distribution = .Fill一起使用):

let spacerView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 10))
stackView.addArrangedSubview(spacerView)
stackView.addArrangedSubview(viewThatNeedsSpaceBeforeIt)
stackView.addArrangedSubview(NextView)...

6

迅捷3:您只需要通过以下方式设置偏移量:

firstView.leadingAnchor.constraint(equalTo: parentView.leadingAnchor, constant: 200).isActive = true

确保在您之后设置此约束 parentView.addArrangdSubView(firstView)


4

如果只需要前导填充,则可以将堆栈视图的Alignment设置为“ Trailing”,然后可以在其包含的每个子视图中自由指定唯一的Leading约束。

另外,您还可以将堆栈视图的对齐方式设置为“居中”,然后可以使用前导和/或尾随约束为每个项目提供自己的两侧填充。


1

这个问题已经有了很好的答案,尽管有一个建议,但还是使用spacing属性来设置视图之间的间距。对于第一个和最后一个视图,可以有两个选项,要么将插入设置为建议的@tolpp,要么使用常量将约束附加到父级(stackview)以添加填充。


0

我们所做的是添加透明组件(例如,UIButton / UIView)作为UIStackView的第一个和最后一个子代。然后设置约束这些不可见子项的宽度以调整填充。


0

解决方案是在堆栈视图中有一个常规视图,以容纳要向其添加约束的任何视图,然后可以为与堆栈视图中的视图相关的项添加约束。这样,您的原始视图可以在堆栈视图中具有前导和尾随约束。

这可以在界面构建器中以编程方式完成。


-3

看来解决方案非常简单。代替:

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

我刚刚写道:

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor, constant: 15).active = true

1
实际上,您的代码在urscrollview内为uistackview添加了一个前导,它并未在uistackview内为您的视图添加了填充(如问题所述)
William Kinaan 2015年

是的,但是我不知道您是否可以添加填充,所以这对我有用。
阿德里安

首先想到的是,您可以另一个uistackview插入您原来的uistackview并为其添加填充。然后将您的视图添加到这个新的uistackview中(您可以完全由界面生成器完成此操作,无需为其编写代码)
William Kinaan 2015年

是的,那行得通。您可以添加为答案,我会接受的。
阿德里安
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.