在图像上滑动 UITableView答案

【问题标题】：sliding UITableView over image在图像上滑动 UITableView
【发布时间】：2014-04-22 23:37:01
【问题描述】：

用户首先在页面顶部看到一张图片；页面的其余部分是图片正下方的 UITableView。

当用户在表格上向上滑动时，我想向上滑动整个 UITableView 以使其覆盖图像，然后开始滚动表格单元格。向下滑动（一旦第一个单元格位于顶部），UITableView 将向下滑动以再次显示图像。

这类似于 Crackle 应用程序（和其他应用程序）所做的。有什么好的/优雅的方式来做到这一点？

【问题讨论】：

我没听懂，但您似乎可以将 imageView 添加为您的第一个单元格。
@AbinGeorge：当表格视图向上滑动时，我希望它慢慢地覆盖图像，图像仍然在原处（但在表格视图下方）。它们是两个不同的元素。

标签： ios uitableview uiscrollview

【解决方案1】：

通过设置框架来改变TableView的位置， self.tableView.frame=self.view.frame in -scrollViewWillBeginDragging：

【讨论】：

【解决方案2】：

毫无疑问，有几种方法可以做到这一点。途中涉及将该图像放在第一个单元格内，这将与您的数据的其他单元格不同。当您滚动时，该图像在单元格中的位置将向下移动，这会使该图像看起来被下面的单元格覆盖。下面的代码显示了如何做到这一点（我从另一个项目中修改了这个，该项目有交替的行，似乎浮动在固定图像上）。

@interface TableController ()
@property (strong,nonatomic) NSArray *theData;
@end

@implementation TableController 


- (void)viewDidLoad {
    [super viewDidLoad];
    self.theData = @[@"One",@"Two",@"Three",@"Four",@"Five",@"Six",@"Seven",@"Eight",@"Nine",@"Black",@"Brown",@"Red",@"Orange",@"Yellow",@"Green",@"Blue"];
}



-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
    RDCell *topCell = (RDCell *)[self.tableView cellForRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]];
    [topCell updateImageViewWithOffset:scrollView.contentOffset.y];
}



- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return self.theData.count + 1;
}



-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    CGFloat height = (indexPath.row == 0)? 140 : 44;
    return height;
}



- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    if (indexPath.row == 0) {
        RDCell *cell = [tableView dequeueReusableCellWithIdentifier:@"ImageCell" forIndexPath:indexPath];
        return cell;
    }else{
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
        cell.textLabel.text = self.theData[indexPath.row - 1];
        return cell;
    }
}

自定义单元格中的代码就是这一种方法，

-(void)updateImageViewWithOffset:(CGFloat) offset {
    CGFloat cellY = self.frame.origin.y;
    self.topCon.constant = offset - cellY;
}

topCon 是 NSLayoutConstraint 的 IBOutlet，位于单元格顶部和单元格中图像视图的顶部之间——重要的是图像视图对单元格的顶部和侧面有约束，以及高度约束（等于单元格的高度），但对单元格的底部没有限制。如果你想看看这种方法是否能给你想要的外观，你可以从这里下载示例项目，http://jmp.sh/zOVz6Ev。

【讨论】：