Question

适用于iOS的Google Primer应用程序具有表格视图滚动效果，其中单元格在滚动时堆叠在彼此之上。 Primer application：如果你在他们的页面上滚动，你可以看到效果......我所说的效果是在Primer的特色课程中。我试图用tableview重现它。

我试过在viewdidscroll事件中使用单元格的框架。我得到了它的工作，但在以某种方式向上移动时它变得非常跳跃/跳跃。此外，当发生加加速度时，框架会错误地偏移。我只能在细胞内标签的框架上做到这一点。我的细胞非常大（超过屏幕的一半）。

如何消除跳跃/混蛋？如何为容器视图位置设置动画而不是标签位置？

scrollViewDidScroll上带有标签的当前动画：

override func scrollViewDidScroll(scrollView: UIScrollView) {
    if (self.tableView.contentOffset.y < 0) { return }

    let offsetYDifference =  oldYOffset - self.tableView.contentOffset.y 
    oldYOffset = self.tableView.contentOffset.y

    let cell = self.tableView.visibleCells.first!

    var newOriginY = (cell.textLabel?.frame.origin.y)! - offsetYDifference
    if (newOriginY < 0) { //Cells get reused.
        newOriginY = newOriginY + cell.frame.height
    }

    cell.textLabel?.frame = CGRect(x: (cell.textLabel?.frame.origin.x)!,
        y: newOriginY,
        width: (cell.textLabel?.frame.width)!,
        height: (cell.textLabel?.frame.height)!)
}

启用了分页的

Custom paging-like behavior在故事板上设置为关闭：

override func scrollViewWillEndDragging(scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {

    let offsety = targetContentOffset.memory.y
    var smallestCellDiffToContentOffset = abs(offsety - (self.tableView.visibleCells.first?.frame.origin.y)!)

    var closestCellOrigin = self.tableView.visibleCells.first?.frame.origin.y

    self.tableView.visibleCells.forEach { (cell) -> () in
        if (abs(offsety - cell.frame.origin.y) <= smallestCellDiffToContentOffset) {
            smallestCellDiffToContentOffset = abs(offsety - cell.frame.origin.y)
            closestCellOrigin = cell.frame.origin.y
        }
    }
    targetContentOffset.memory.y = closestCellOrigin!
}

我是一个初学者快速开发者，我真的对此无能为力。提前致谢。

Answer 1

尝试使用CGAffineTransformMakeTranslation。它只是一种视觉效果，所以它不会搞砸桌面视图试图用单元格框架做什么。像这样（可能在viewDidScroll()）：

for cell in tableView.visibleCells() {
  let cellOffset = tableView.contentOffset.y * someMagicFormula
  cell.transform = CGAffineTransformMakeTranslation(0.0, cellOffset)
}

Answer 2

实质上你所看到的是UITableView正在抵制你制作这个动画的努力。正确地说，改变单元格的框架应该留给tableview本身。

您需要的是UICollectionView，其中包含一个自定义布局对象，用于控制单元格的位置。这将是一项相当多的工作，但是你可以让UITableView无法提供更精细的颗粒控制。

结帐this tutorial，了解有关收藏视图的自定义布局的简要介绍。我也建议观看2012年WWDC视频Advanced Collection Views and Building Custom Layouts。

Answer 3

如果您使用UIScrollView而不是UITableView功能，则可以在scrollView中启用分页（并在其中添加自定义视图）并启用垂直弹跳效果。

否则如果您想使用UITableView，可以使用UIScrollViewDelegate并执行类似的操作。

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView
                     withVelocity:(CGPoint)velocity
              targetContentOffset:(inout CGPoint *)targetOffset
{
  UITableView *tableView = (UITableView*)scrollView;
  NSIndexPath *topIndexPathAfterScrolling = [tableView indexPathForRowAtPoint:*targetContentOffset];
  CGRect rect = [tableView rectForRowAtIndexPath:indexPathOfTopRowAfterScrolling];
  targetOffset->y=rect.origin.y;
}

您可以在此处调整特定contentOffset：“targetOffset”

的滚动操作

自定义tableview滚动效果，如谷歌入门

3 个答案: