对视差图像的tableview使用自动布局 [英] Parallax on tableview image, using Auto Layout

问题描述

我有几个的tableview细胞，比他们高大宽。因此，我采取的视差滚动，所以你可以看到更多的图像，你向上/向下滚动

I have several tableview cells which are wider than they are tall. As such, I'm implementing a parallax scroll so you can see more of the image as you scroll up/down

<一个href=\"http://www.$c$c4app.net/ios/A-Parallax-TableViewCell-like-the-Dice-app/545f1434e24741e25228bb71\"相对=nofollow>预期的效果示例

随着一些 code范例几乎让我有，但为我用自动版式，我发现有一个跳当你第一次开始滚动，由于实际的图像位置差与预期的位置。我试过呼吁双方viewDidAppear和didLayoutSubviews布局功能，试图第一个设置后踢成的形状，但没有运气。

Following some code examples nearly gets me there, but as I'm using AutoLayout, I find there is a 'jump' when you first start scrolling, due to the difference in actual image positions and the expected position. I've tried calling the layout function on both viewDidAppear and didLayoutSubviews to try and kick it into shape after the first setup, but no luck.

<一个href=\"http://stackoverflow.com/questions/32930241/how-to-add-parallax-effect-in-auto-layout?lq=1\">This回答建议使用自动版式，这似乎很succint的解决方案，所以我调整了首code，但它仍然跳。如果我使用code。在回答表明，这是不言而喻所有的地方

This answer suggests a solution using AutoLayout which seems very succint, so I've adjusted the code in the first, however it still jumps. If I use the code suggested in that answer, it goes all over the place

CGRect rectInSuperview = [tableView convertRect:self.frame toView:view];

float distanceFromCentre = CGRectGetHeight(view.frame)/2 - CGRectGetMinY(rectInSuperview);
float difference = CGRectGetHeight(self.eventImage.frame) - CGRectGetHeight(self.frame);
float move = (distanceFromCentre / CGRectGetHeight(view.frame)) *difference;

CGRect imageRect = self.eventImage.frame;
imageRect.origin.y = -(difference/2)+move;
self.verticalCenter.constant = move;

现在发生了什么，是滚动的伟大工程，但元素约30像素十岁上下，只要你开始第一次滚动跳了下去。所以，我需要它没有这个最初的跳跃工作？

what happens now, is the scrolling works great, but elements jump down by about 30px ish as soon as you start to first scroll. So I need it to work without this initial jump?

初​​始屏幕负载：

由1px的滚动（第一和最后图像的通知跳）之后：

After scrolling by 1px (notice jump of first and last images):

推荐答案

我已经更新了链接回答，

@implementation TableViewController

-(void)scrollViewDidScroll:(UIScrollView *)scrollView {

    NSArray * cells =  [self.tableView visibleCells];
    for (TableViewCell* cell in cells) {
        NSIndexPath * indexPathOfCell = [self.tableView indexPathForCell:cell];
        CGRect cellRect = [self.tableView rectForRowAtIndexPath:indexPathOfCell];
        cell.verticalCenter.constant = (scrollView.contentOffset.y -cellRect.origin.y)/kParallaxRatio;
    }
}

现在，而不是改变约束常数滚动型内容偏移，我已经介绍了 cellRect 来可以确保电池的约束恒为零时，它是在顶部在实现代码如下。

Now, instead of changing constraint constant to scrollview content offset, I have introduced the cellRect to makes sure that the cell's constraint constant is zero when it is at the top of the tableview.

您可以找到样本 rel=\"nofollow\">。

You can find the sample here.

这篇关于对视差图像的tableview使用自动布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！