带有标题的 uitableview，如 instagram 用户个人资料答案

【问题标题】：uitableview with header like instagram user profile带有标题的 uitableview，如 instagram 用户个人资料
【发布时间】：2013-01-29 14:38:00
【问题描述】：

我已经为此苦苦挣扎了一段时间。我必须实现一个类似于 Instagram 在他们的 ios 应用中的用户配置文件。

当单击该标签栏上的第一个按钮时，所有向下的内容都会发生变化。底部显示的表格视图具有动态大小，因此他们也考虑到了这一点。

我实现了一些顶部是带有 5 个按钮的 UIView 并基于它们底部（女巫就像一个容器视图）更改内容。而这两个（顶部 uiview 和底部容器视图）是 UIScrollView 的一部分。但是这样我就无法及时获取关于我想在底部显示的表格视图大小的信息，以便修改 UIScrollView 的大小。我有一种感觉，这是一种有缺陷的方法。我真的很感激任何想法哦如何实现这个交互之王。谢谢。

【问题讨论】：

标签： ios uitableview uiscrollview instagram

【解决方案1】：

我相信它是 UITableView 或 UICollectionView 上的 headerView，具体取决于您选择的视图模式。当您点击其中一个按钮时，它会将 UITableView 更改为 UICollectionView，反之亦然。

您希望跟踪正在显示的内容的当前 contentOffset（UICollectionView 和 UITableView 都是 UIScrollView 的子类，因此您可以从两者中获取），然后在要切换到的视图上设置 contentOffset .

为 UIView 标头子类设置一个 ivar，以便您可以轻松地重复使用它。

【讨论】：

所以你的意思是tableview 和collectionview 都将有相同的标题，并且每个按钮在标题中的操作必须在每个类中具有相同的实现？在我的应用程序中，我计划有 4 个按钮。这不是有点开销吗？
老实说，这取决于您希望在四个不同视图中显示的内容。如果您要显示几个不同的 UITableView，您可能会考虑使用 parentViewController/childViewController 实现，但您也可以尝试更改表视图的数据源并跟踪您所处的模式以确保获得正确的数量行、对象等。

【解决方案2】：

这就是我所拥有的。我的问题是，为了改变后者的滚动视图大小，我不想在有用的时间将 tableview 的框架高度从 tableview 控制器返回到 UserProfileViewController。我也觉得我在某种程度上是在倒退，所以任何建议都非常受欢迎。

这个视图有两部分：上部和下部。父视图是滚动视图。我想用这个实现的是在上部有一种标签栏，它将控制 waht 出现在下部。

当按下左上角按钮以显示另一个视图时，上部有一个翻转动画。实现这一点的方法是拥有 2 个视图：虚拟视图和后视图。虚拟视图具有小时候的正视图。前视图是包含所有按钮的视图。这个动画的代码是这样实现的：

- (IBAction)infoButtonPressed:(id)sender
{
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:1.0];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.hoverView cache:YES];

    if ([self.headerView superview]) {

        [self.headerView removeFromSuperview];
        [self.hoverView addSubview:self.backOfHeaderView];
        [self.infoButton removeFromSuperview];
        [self.backOfHeaderView addSubview:self.infoButton];

    } else {

        [self.backOfHeaderView removeFromSuperview];
        [self.hoverView addSubview:self.headerView];
        [self.infoButton removeFromSuperview];
        [self.headerView addSubview:self.infoButton];

    }
    [UIView commitAnimations];
}

下半部分由充当占位符的容器视图组成。当按下按钮时，容器视图中会显示不同的视图控制器。

每个视图控制器都有自己的容器视图。当控制器被加载时，该视图控制器（tableview）的特定视图被添加到它的容器视图中。它还确保如果 tableview 已经添加到容器视图中，它将被删除。所有这些都在每个特定的视图控制器中完成。

在用户配置文件视图的视图控制器中，有一个容器视图的实例和一个 UIViewController，它也充当占位符（从现在开始命名为 currentViewController）。当按下特定按钮时，它会检查我们想要显示的视图控制器的实例是否已经存在。如果不是，它将创建一个并将其 tableview 的框架设置为容器视图的边界。之后，它将从父视图控制器中删除 currentViewController 的视图，并从父视图控制器中删除 currentViewController 本身，以确保如果有分配给它们的东西，它们将不存在。然后它将所需的视图控制器分配给 currentViewController。它还将所需的 viewcontroller 的 containerView 实例分配给父 viewcontroller（用户配置文件 viewcontroller）中的 containerview。最后，它会将所需的视图控制器作为子视图添加到主视图控制器（用户配置文件视图控制器），并将所需的视图控制器的视图添加到主视图控制器的 containerView 中。这是其中一个按钮的代码：

    //Check if there is an instance of the viewcontroller we want to display. If not make one and set it's tableview frame to the container's view bounds
    if(!_userWallViewController) {
        self.userWallViewController = [[WallViewController alloc] init];
//        self.userWallViewController.activityFeedTableView.frame = self.containerView.bounds;

    }

    [self.userWallViewController.containerView addSubview:self.userWallViewController.activityFeedTableView];
    //If the currentviewcontroller adn it's view are already added to the hierarchy remove them
    [self.currentViewController.view removeFromSuperview];
    [self.currentViewController removeFromParentViewController];

    //Add the desired viewcontroller to the currentviewcontroller
    self.currentViewController = self.userWallViewController;

    //Pass the data needed for the desired viewcontroller to it's instances
    self.userWallViewController.searchURLString = [NSString stringWithFormat:@"event/user/%@/", self.userID];
    self.userWallViewController.sendCommentURLString = [NSString stringWithFormat:@"event/message/%@", self.userID];

    self.userWallViewController.totalCellHeight = ^(float totalCellHeight){

        self.userWallViewController.numberOfCells = ^(float numberOfCells){
            NSLog(@"The total number of cells: %f", numberOfCells);
            NSLog(@"The total cell height: %f", totalCellHeight);

            self.scrollView.contentSize = CGSizeMake(320.0, totalCellHeight + 172.0 + 33.0);
            CGRect newFrame = self.userWallViewController.containerView.frame;
            newFrame.size.height = totalCellHeight + 33.0;
            self.userWallViewController.containerView.frame = newFrame;

            NSLog(@"Container view: %f", self.containerView.frame.size.height);
            NSLog(@"Scroll view: %f",self.scrollView.contentSize.height );
        };
    };

    //Add this containerview to the desired viewcontroller's containerView
    self.userWallViewController.containerView = self.containerView;

    //Add the needed viewcontroller and view to the parent viewcontroller and the containerview
    [self addChildViewController:self.userWallViewController];
    [self.containerView addSubview:self.userWallViewController.view];

    [self performSelector:@selector(changeScrollView) withObject:self afterDelay:0.5];

    //CLEAN UP THE CONTAINER VIEW BY REMOVING THE PREVIOUS ADDED TABLE VIEWS
    [self.userFansViewController.userSimpleTableView removeFromSuperview];
    [self.fanOfViewController.userSimpleTableView removeFromSuperview];
    [self.userPublishedMovellaListViewController.gridView removeFromSuperview];

    [self.userPublishedMovellaListViewController removeFromParentViewController];
    self.userPublishedMovellaListViewController = nil;
}

【讨论】：

【解决方案3】：

我知道这个答案迟了一年多，但我想说明我的假设……以防它以后可能对其他人有所帮助。我实施了类似的观点并得出了这个结论。如果我错了，欢迎任何人纠正我。

我认为顶视图可能是标题视图，而看起来像集合视图和表格视图的两个选项都是集合视图。

因为集合视图的布局可以微调到最细微的细节，我认为看起来像表格视图的视图只是一个真正专门设计的集合视图。并且在视图之间切换时，集合视图的数据和属性会被交换和重新加载。

【讨论】：