如何使视图滚动？就像 Instagram 的个人资料一样

Question

滚动视图中的 UIView、SegmentedController 和 UIContainerView 或类似的东西？

在我的故事板中，我有一个 VC，其中包含顶部的 UIView、中间的分段控制器和底部的 2 个 ContainerViewControllers，并将 segue 嵌入到新的 VC。

在新的 VC 中，我有一个 TableView 和一个 CollectionView（例如 Instagram 个人资料）。

我的问题是我需要 SegmentedController 和 UIView 与 ContainerView(TableView/CollectionView) 一起滚动，目前只有 ContainerView 部分滚动并且上面的部分是固定的。

现在我猜我可能需要将所有内容都放入 UIScrollView，所以我尝试了并正确放置了所有成本约束。但是当它在 Swift 文件中配置它时，我现在才真正知道如何设置滚动的高度，但显然我需要的高度可以变化并且不是固定高度！

如果有人可以在这里帮助我，那就太棒了，或者可能会指出我已经在这里提出的类似问题？我已经看过了，但很遗憾没有找到任何东西！

下面的图片基本上解释了我所追求的，如果上面我不是很清楚..

这是一个你可以看到的例子：https://github.com/Jackksun/ScrollIssue

Answer 1

据我了解，您想让滚动视图在其边界之外接收触摸。您可以通过覆盖实际接收触摸的视图上的 hitTest:withEvent: 方法来实现这一点。

这是我在项目中所做的一个示例。我将 UIView 子类化并将其接收到的所有触摸重定向到特定视图。在您的情况下，您会将所有触摸重定向到滚动视图。

.h file:

@import UIKit.UIView;

/*!
 @class         TouchableView
 @abstract      Touchable view.
 */
@interface TouchableView : UIView

/*!
 @property      viewToReceiveTouches
 @abstract      View that receives touches instead of a given view.
 */
@property (nonatomic, weak) IBOutlet UIView *viewToReceiveTouches;

@end
.m file:

@import UIKit.UIButton;
@import UIKit.UITableView;
@import UIKit.UITextField;

#import "TouchableView.h"

@implementation TouchableView

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    if ( [self shouldViewReceiveTouch:self inPoint:point] )
    {
        return [super hitTest:point withEvent:event];
    }
    else if ( CGRectContainsPoint(self.bounds, point) && self.isUserInteractionEnabled )
    {
        return self.viewToReceiveTouches;
    }

    return nil;
}

- (BOOL)shouldViewReceiveTouch:(UIView *)view inPoint:(CGPoint)point
{
    if ( !CGRectContainsPoint(view.bounds, point) || !view.isUserInteractionEnabled )
    {
        return NO;
    }

    if ( [view isKindOfClass:[UIButton class]] ||
         [view isKindOfClass:[UITextField class]] ||
         [view isKindOfClass:[UITableViewCell class]] ||
         [view isKindOfClass:[UITableView class]] )

    {
        return YES;
    }

    for ( UIView *subview in view.subviews )
    {
        if ( [self shouldViewReceiveTouch:subview inPoint:[view convertPoint:point toView:subview]] )
        {
            return YES;
        }
    }

    return NO;
}

@end

Answer 2

您可以为滚动视图内容设置动态大小。这就是我所做的。

• 定义dynamicHeight 来存储新的TableView/CollectionView 高度。
• 每次更改段控件时，获取子控制器高度并更新滚动视图内容大小。

看看我的代码（演示here）

@IBAction func selectPage(sender: AnyObject) {

    // clear all child controller before load new controller 
    for controller in childViewControllers {

        controller.removeFromParentViewController()
    }

    for view in pageContainer.subviews {

        view.removeFromSuperview()
    }

    let segment = sender as! UISegmentedControl

    if segment.selectedSegmentIndex == 0 {

        createImageController()
    }
    else {

        createTextController()
    }

    updateScrollContentSize()
}

func updateScrollContentSize() {

    // 150 is your view and segment height
    scrollView.contentSize = CGSize(width: view.frame.size.width, height: dynamicHeight + 150)
}

func createTextController() {

    let textController = UIStoryboard(name: "Main", bundle: nil).instantiateViewControllerWithIdentifier("TextController") as! TextController
    dynamicHeight = textController.getTableContentHeight()
    textController.tableView.scrollEnabled = false

    self.addChildViewController(textController)
    pageContainer.addSubview(textController.view)
    textController.view.frame = CGRectMake(0, 0, pageContainer.frame.size.width, dynamicHeight)
}

func createImageController() {

    let imageController = UIStoryboard(name: "Main", bundle: nil).instantiateViewControllerWithIdentifier("ImageShowController") as! ImageShowController
    dynamicHeight = imageController.getTableContentHeight()
    imageController.tableView.scrollEnabled = false

    self.addChildViewController(imageController)
    pageContainer.addSubview(imageController.view)
    imageController.view.frame = CGRectMake(0, 0, pageContainer.frame.size.width, dynamicHeight * 2)
}

希望这会有所帮助。

Answer 3

由于您的身高可能会有所不同，我认为做您想做的最简单的方法是将所有内容放入UICollectionView。 赛格？没问题，实现didSelectRowAtIndexPath，更改您的数据和高度并重新加载UICollectionView。 您还可以将UICollectionView 添加到简单的UIView，这样您就可以在其上放置一些静态内容。

这是一个示例应用程序来演示这一点： https://github.com/tirrorex/Apps/tree/master/Swift/Sampleapp

您将必须实现一个动态高度，您可以在此找到一些线程（基本上您可以为包含您的 collectionview/tableview 的单元格制作一个特殊情况，以便从 nib 加载该单元格，这可能会对您有所帮助） ： UICollectionView Self Sizing Cells with Auto Layout