如何在自动布局中添加视差效果

Question

我正在使用大小类的自动布局。我想在 UITableViewCell 上添加视差效果，所以我参考。以下链接

• https://github.com/fernandospr/FSParallaxTableView
• https://github.com/jberlana/JBParallaxCell

但他们没有使用自动布局，不知道如何在 size 类开启并使用自动布局时将视差效果应用于 imageView。

Answer 1

通过自动布局，在滚动视图（或表格视图）中添加视差非常容易。

要点是除了其他约束之外，我们在已添加到单元格内容的 imageView 上添加垂直中心约束，并且在滚动时我们更改所有可见单元格垂直约束的常量值。完成！

这里是示例代码

#import <UIKit/UIKit.h>
#define kParallaxRatio 8.0

#pragma mark - Custom Cell

@interface TableViewCell : UITableViewCell
@property (nonatomic,weak) IBOutlet NSLayoutConstraint * verticalCenter;
@end

@implementation TableViewCell
@end


#pragma mark - Custom Table View Controller

@interface TableViewController : UITableViewController
@end

@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;
    }
}

@end

约束

PS：确保您的图像视图的高度高于单元格内容视图的高度。我为此添加了一个高度约束，使图像视图高度是单元格视图高度的 3 倍。