iOS - 使用故事板和自动布局使 UIScrollView 居中 [英] iOS - Using storyboard and autolayout to center the UIScrollView

问题描述

我正在使用故事板和自动布局创建 iOS 应用程序，以便它在 iPhone4 和 iPhone5 上都能正常工作.下面是我使用故事板创建的视图的屏幕截图.

I'm creating iOS app using story board and auto layout so that it will work good on both iPhone4 and iPhone5. Below is the screen shot of the view that I'm creating using story board.

在上图中，我想将滚动视图保持在超级视图的前沿和右侧表格视图的中间.我不希望滚动视图在 iPhone5 中增加其宽度.我尝试了不同的约束组合，但我无法实现.

In the above image, I want to keep the scroll view in the middle from leading edge of superview and the right table view. I dont want the scroll view to increase its width in iPhone5. I tried different combinations of constraints, but I couldn't achieve it.

有人可以建议我为滚动视图设置哪些约束，以便它位于中心.

Can some suggest me what are all constraints that I've to set for scroll view so that it will be in center.

推荐答案

您需要通过在屏幕上添加一个额外的视图来做到这一点.

You will need to do this by adding an additional view to the screen.

目前你有...

- UIView (main view)
    |
    | - scrollView
    | - tableView

你应该把滚动视图放在另一个像这样的视图中......

You should put the scroll view inside another view like this...

- UIView (main view)
    |
    | - UIView (spacer View)
    |    | - scrollView
    |
    | - tableView

现在你可以做的是有这些限制......

Now what you can do is have these constraints...

spacer view leading edge constraint to super view = 0
spacer view trailing edge to table view leading edge = 0
table view width = (whatever the width is)
table view trailing edge to super view = 0

这将布置 spacer view 和 table view 以便 spacer view 增长.

This will lay out the spacer view and the table view so that the spacer view will grow.

现在你需要添加...

scroll view width = x
scroll view height = y
scroll view centered vertically in super view
scroll view centered horizontally in super view.

现在，因为滚动视图的超级视图是间隔视图，所以它将始终居中在表格视图和其余空间之间.

Now, because the scroll view's super view is the spacer view then it will always be centered in between the table view and the rest of the space.

这篇关于iOS - 使用故事板和自动布局使 UIScrollView 居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！