将多个容器视图放在 ios 中的分页 UIScrollView 中

Posted 2023-03-14

【中文标题】将多个容器视图放在 ios 中的分页 UIScrollView 中

【英文标题】：Putting multiple container views inside paged UIScrollView in ios

【发布时间】：2014-07-01 15:18:19

【问题描述】：

我在UIViewController 中有一个UIScrollView。现在我想向这个滚动视图添加多个容器视图。每个容器视图的大小与滚动视图的大小相同，即一个容器视图基本上填满了滚动视图。现在，我将通过设置容器视图的框架和更改滚动视图的 contentSize 来向此滚动视图添加多个容器视图。

这会产生旋转问题。当设备从纵向旋转到横向时，会同时显示 2 个容器视图。我希望这些容器视图在旋转时调整大小。我可以做到这一点的一种方法是在设备旋转时更新我所有容器视图的框架（到目前为止已添加到滚动视图）。

但我想使用自动布局约束来处理这个问题。但是在将容器添加到滚动视图时，我无法获得要使用的约束。

【问题讨论】：

您是否尝试过使用 UICollectionView 或者您使用 UIScrollView 是否有特定原因？

使用滚动视图没有什么特别的原因。我只是想拥有水平分页视图，每个视图在纵向和横向方向都覆盖整个屏幕。

【参考方案1】：

尝试改用 UICollectionView。设置 collectionView 的大小以匹配显示并将单元格大小设置为与 collectionview 几乎相同。在集合视图周围放置自动布局约束，以保持其边缘和超级视图之间的距离不变。

使用 CollectionViewFlowLayoutDelegate 方法

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath

控制单元格的大小。这是我自己的一个项目中的一个示例。

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
if (UIDeviceOrientationIsLandscape([[UIApplication sharedApplication] statusBarOrientation])) 
    if (iPhone5) return CGSizeMake(470.f, 150.f);
    else return CGSizeMake(380.f, 150.f);

if (iPhone5) return CGSizeMake(270.f, 325.f);
else return CGSizeMake(272.f, 390.f);

将您的容器视图放在单元格内，并将容器边缘的自动布局约束应用到单元格。

最后，覆盖collection view layout，设置滚动方向为水平。

【讨论】：

您能否告诉我们如何将自动布局约束应用于UICollectionViewCell，以便整个单元格的大小在旋转时发生变化。据我所知，单元格采用它的大小，并且在旋转时保持相同的大小，除非我们明确改变它的大小。

您使用的方法是通过计算我想避免的旋转来手动提供框架。这可行，但我想完全使用自动布局。

【参考方案2】：

任何人登陆这里都是为了同样的问题，有这篇很好的帖子https://www.natashatherobot.com/ios-autolayout-scrollview/ 关于在使用自动布局时处理 UIScrollView 内的元素。完全值得一读。

简要总结：

UIScrollView 应该只有一个子视图。 除了添加通常需要的约束外，请考虑在滚动视图的超级视图（主视图）和滚动视图的唯一子视图（内容视图）之间需要一个 EQUAL WIDTH 约束。 根据每种情况，您可能需要通过代码进行少量调整，这很好。