How to add parallax effect in auto layout

问题

I am using auto layout with size class. I want to add parallax effect on UITableViewCell so i ref. following links

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

but they didn't use auto layout , any idea how to apply parallax effect to imageView when size class is on and auto layout is used.

回答1:

With auto layout its really easy to add parallax in scrollview (or a tableview).

The gist is that apart from other constraints we add a vertical centre constraint on the imageView that has been added to the cells content, and on scroll we change the constant vale of all the visible cells vertical constraint. DONE !

Here is the sample code

#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

The constraints

PS: Make sure your image view has more height than the cell content View height. I have added a height constraint for this that makes the image views height 3 times the cell views height.

来源：https://stackoverflow.com/questions/32930241/how-to-add-parallax-effect-in-auto-layout

标签

ios

uitableview

autolayout

parallax

uiviewanimation