UIScrollView - 滚动时内容超出边界

Question

我在界面构建器中设计了滚动视图，如下所示：

看起来很好。但不幸的是，当我在模拟器或设备上运行它时，

它变成了这个样子：

滚动视图中的内容超出了滚动视图本身，甚至超出了包含此滚动视图的UIView。

在我的viewDidLoad中（panel是scrollView的容器），

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    CGFloat adjustPanelHeight = [PTTScreenScaleUtil getAdjustHeight:self.panel.frame.size.height];
    CGRect panelRect = self.panel.frame;
    panelRect.size.height = adjustPanelHeight;
    self.panel.frame = panelRect;

    UIImage *image = [UIImage imageNamed:@"panel-background"];
    UIGraphicsBeginImageContext(self.panel.frame.size);
    [image drawInRect:CGRectMake(0, 0, self.panel.frame.size.width, adjustPanelHeight)];
    UIImage* newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    [self.panel setBackgroundColor:[UIColor colorWithPatternImage:newImage]];

    NSLog(@"scrollView Height : %f", self.scrollView.frame.size.height);
    NSLog(@"scrollView contentSize Height : %f", self.scrollView.contentSize.height);
//    CGRect scrollViewRect = self.scrollView.frame;
//    CGRect scrollViewContentRect = self.scrollView.frame;
//    NSLog(@"ScrollView Height Before : %f , After : %f", self.scrollView.frame.size.height, [PTTScreenScaleUtil getAdjustHeight:self.scrollView.frame.size.height]);
//    scrollViewRect.size.width = 280;
//    scrollViewRect.size.height = [PTTScreenScaleUtil getAdjustHeight:270];
//    self.scrollView.frame = scrollViewRect;
//    [self.detailsLabel sizeToFit];
    UIView *view = [[self.scrollView subviews] objectAtIndex:0];
//    [view sizeToFit];
//    [self.scrollView setContentMode:UIViewContentModeScaleAspectFit];
//    NSLog(@"ContentSize Height : %f", view.frame.size.height);
//    scrollViewContentRect.size.height = view.frame.size.height;
    NSLog(@"Bounds : %f", view.bounds.size.height);
    self.scrollView.frame = CGRectMake(10, 10, 280, 270);
    self.scrollView.contentSize = CGSizeMake(280, 500);
    NSLog(@"Frame Height %f", self.scrollView.frame.size.height);
    //[self.scrollView setContentSize: CGSizeMake(280, 1000)];

    CGRect termBtnRect = self.termBtn.frame;
    CGRect mailBtnRect = self.mailBtn.frame;
    CGRect twitterBtnRect = self.twitterBtn.frame;
    CGRect fbBtnRect = self.fbBtn.frame;
    termBtnRect.origin.y = adjustPanelHeight - 10 - termBtnRect.size.height;
    mailBtnRect.origin.y = adjustPanelHeight - 10 - termBtnRect.size.height;
    twitterBtnRect.origin.y = adjustPanelHeight - 10 - termBtnRect.size.height;
    fbBtnRect.origin.y = adjustPanelHeight - 10 - termBtnRect.size.height;
    self.termBtn.frame = termBtnRect;
    self.mailBtn.frame = mailBtnRect;
    self.twitterBtn.frame = twitterBtnRect;
    self.fbBtn.frame = fbBtnRect;
}

所有日志的回报为270.0

PS. 即使内容溢出但滚动条仍然正确，滚动条正常工作（在接口生成器中安排在滚动视图的框架中），我不知道如何解决这个问题，希望有人能帮助我。

谢谢你。

- SaintTail

---

你在代码的其他地方改变了scrollView的frame吗？ - sangony

不要更改scrollView的大小（这行代码self.scrollView.frame = CGRectMake(10, 10, 280, 270); 我只是给了与我在Size Inspector中设置的scrollView相同的值）。所有这些adjustHeight都是针对iPhone5的。在iPhone5以下，它返回相同的值。 - SaintTail

尝试通过编程方式创建并添加scrollView，看看是否会出现相同的问题。你知道如何做吗？ - sangony

Answer 1

通过在界面构建器中创建新的视图控制器，并仔细重做同样的过程，可以解决此问题。然后，bingo，它就能正常工作了。

当我比较这两个视图控制器时，我发现错误的那个UIScrollView Clip Subviews未被选中。当选中它时，问题得到了解决。

- SaintTail

---

显然，在UISCrollView上设置Clip Subviews就可以解决问题。感谢您的回答。 - Nirav

将剪辑设置为边界对我也起作用，但由于某种原因，在IB中设置时该设置未生效。在代码中设置 clipsToBounds = true 有所帮助。 - Mask Ota

Answer 2

我刚刚花费了一个小时来解决这个问题，最后恍然大悟。

我的情况是在Storyboard场景中有一个UIView。但后来我决定将其改为UIScrollView（而不是最初的计划：将UIScrollView嵌入到UIView中）

然后我更改了UIView的类为UIScrollView。IB会在文档大纲中将其更改为滚动视图，我想这样就可以了，对吗？

但后来我发现了你描述的问题。

后来我意识到仅更改类是不够的。显然通过IB添加UIScrollView与添加UIView有所不同。这可能是重做修复该问题的原因。

因此，对于未来遇到此问题的任何人，请确保通过IB添加了UIScrollView而不是UIView

- Tom Kidd

Answer 3

我遇到了与这篇文章中描述的相同的问题。我尝试了多种解决方案的组合，但都没有成功，包括：

• 将滚动视图放在一个Clip To Bounds = YES的视图中
• 将一个视图放在滚动视图中，并将Clip To Bounds = YES，然后该视图包含我的子视图
• 将容器视图放在滚动视图中，然后嵌入我的子视图
• 完全重建Interface Builder文件
• 系统地为滚动视图和容器视图的每个自动调整大小掩码选项进行组合
• 系统地启用或禁用每个单独元素的剪辑到边界

所涉及的子视图之前曾在滚动视图中工作，但在这种情况下，内容超出了滚动视图的边界。

最终，由于找不到让Interface Builder配合的方法，我在代码中实现了解决方案：

// There are two scroll areas on the screen, the left view and the right view.
// We want the right view to contain a scrollable area with another child view controller
// we designed in Interface Builder.

// create a scroll view to fill the right view with a scrollable area
CGSize rightFrameSize = self.rightView.bounds.size;
scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake (0, 0, rightFrameSize.width, rightFrameSize.height)];
scrollView.contentSize = CGSizeMake(640, 1352);
[self.rightView addSubview:scrollView];

// now create our child view controller from Interface Builder and add it to the scroll view
UIStoryboard *sb = [UIStoryboard storyboardWithName:@"CustomerAddress" bundle:[NSBundle mainBundle]];
detailsView = [sb instantiateViewControllerWithIdentifier:@"CustomerDetailsView"];
detailsView.delegate = self;
detailsView.customer = _customer;
[scrollView addSubview:detailsView.view];

当然，您可以从使用scrollView.contentSize = detailsView.view.frame.size在Interface Builder中构建的子视图控制器中获取scrollView.contentSize。

我和Interface Builder有一种爱恨交加的关系...大多数时候我喜欢它，但有些日子我们会争吵，我希望我们永远不会相遇... :)

- JasonD

Answer 4

如果您将UIView更改为UIScrollView，请仅在Storyboard中设置cliptobound=YES。

- SANDEEP