如何在 Xcode 7 的死点对齐四个按钮?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/34466624/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-15 08:21:39  来源:igfitidea点击:

How to Align four buttons at dead center in Xcode 7?

iosiphonexcodeswiftios7

提问by Begginer

How do I align these four buttons to be at the center (horizontally and vertically) for the diff sizes of screens. I see different sizes and positions of the buttons when I run the project in the different size of the simulator. Is there a way to make the four buttons to be at center (and same size) for ALL devices?

我如何将这四个按钮对齐到屏幕的差异大小的中心(水平和垂直)。当我在不同大小的模拟器中运行项目时,我看到按钮的不同大小和位置。有没有办法让所有设备的四个按钮都在中心(和相同的大小)?

I don't have any experience with constrains, it has been a while since I used Xcode. I read tutorials about constrains for hours, but I still don't understand how to use it.

我没有任何约束经验,自从我使用 Xcode 以来已经有一段时间了。我读了几个小时关于约束的教程,但我仍然不明白如何使用它。

Screenshot

截屏

Thank you and happy holidays :)

谢谢你,节日快乐:)

回答by

The easiest way to accomplish this is to use a UIStackView. Very simple to use, and it automatically manages the layout for the buttons.

完成此操作的最简单方法是使用UIStackView。使用起来非常简单,它会自动管理按钮的布局。

Remove the existing constraints for your buttons, then select all four and choose Editor -> Embed in -> Stack View.

删除按钮的现有约束,然后选择所有四个并选择Editor -> Embed in -> Stack View

Add two constraints to center your stack view in the view, and you're done!

添加两个约束以在视图中居中您的堆栈视图,您就完成了!

enter image description here

在此处输入图片说明

回答by Ajay Kumar

enter image description hereYes you can use Stack View, but it is only supported from ios 9, so if you are trying to have constraints below ios 9, follow below steps -

在此处输入图片说明是的,您可以使用堆栈视图,但它仅受 ios 9 支持,因此如果您尝试在 ios 9 以下设置约束,请按照以下步骤操作 -

  1. Add a UIView as container for your buttons, and add following constraints to it. (We will not give fixed height constraints to this view,let it determine its height intrinsically i.e we will use buttons to determine the size of container as buttons have their intrinsic size.)

    a. Align Center X to superview

    b. Align Center Y to superView

    c. Trailing and Leading space

  2. Now add first button and add following constraints -

    a. Center horizontally in center.

    b. Top space from superview (as buttons and have its intrinsic size so we dont need to give height and width, it will calculate from its content)

  3. Now for rest of three buttons add following constraints -

    a. Center horizontally with first button

    b. Add top and bottom space to all buttons with their respective top and button views (buttons). For last button i.e 4th add bottom space constraints with container view.

  1. 添加一个 UIView 作为按钮的容器,并为其添加以下约束。(我们不会给这个视图提供固定的高度约束,让它固有地确定它的高度,即我们将使用按钮来确定容器的大小,因为按钮有它们的固有大小。)

    一种。将中心 X 对齐到超级视图

    湾 将中心 Y 与 superView 对齐

    C。尾随和前导空格

  2. 现在添加第一个按钮并添加以下约束 -

    一种。在中心水平居中。

    湾 来自超级视图的顶部空间(作为按钮并具有其固有大小,因此我们不需要给出高度和宽度,它将根据其内容计算)

  3. 现在为其余三个按钮添加以下约束 -

    一种。使用第一个按钮水平居中

    湾 将顶部和底部空间添加到所有按钮及其各自的顶部和按钮视图(按钮)。对于最后一个按钮,即第四个添加容器视图的底部空间约束。

Note - Now that top button have top space constraints with container view and last button have bottom space constraints with container view and all remaining buttons are connected to each other with top and bottom space, this will determine the height of container view and your buttons will be always appear in center of screen for all size.

注意 - 现在顶部按钮具有容器视图的顶部空间约束,最后一个按钮具有容器视图的底部空间约束,并且所有剩余的按钮都通过顶部和底部空间相互连接,这将确定容器视图的高度,您的按钮将总是出现在所有尺寸的屏幕中央。

Below is the link for screenshot with all required constrints explained above.

下面是屏幕截图的链接,上面解释了所有必需的约束。

Screenshot with required constraints

具有所需约束的屏幕截图