以前瀑布流的時分運用過UICollectionView,但是那時運用的是零碎自帶的UICollectionViewFlowLayout規劃,明天看文章,看到UICollectionViewFlowLayout自定義相關的東西,於是入手寫了一個復雜圖片閱讀的demo,純熟一些UICollectionViewFlowLayout自定義規劃。
#import <UIKit/UIKit.h> @interface JWCollectionViewFlowLayout : UICollectionViewFlowLayout @end
自定義UICollectionViewFlowLayout,首先承繼UICollectionViewFlowLayout,完成一下幾個辦法
#define screenWidth [UIScreen mainScreen].bounds.size.width #define MaxChangeRange 100 #import "JWCollectionViewFlowLayout.h" @implementation JWCollectionViewFlowLayout -(void)prepareLayout { self.scrollDirection = UICollectionViewScrollDirectionHorizontal; self.itemSize = CGSizeMake(300, 500); } - (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds { return YES; } - (nullable NSArray<__kindof UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect { NSArray *array = [super layoutAttributesForElementsInRect:rect]; CGRect visibleRect = CGRectMake(self.collectionView.contentOffset.x, 0, self.collectionView.bounds.size.width, self.collectionView.bounds.size.height); for (UICollectionViewLayoutAttributes *attr in array) { if (CGRectIntersectsRect(attr.frame, rect)) { BOOL isAtRight = YES; CGFloat distance = (attr.center.x - CGRectGetMidX(visibleRect)); if (distance<0) { distance = -distance; isAtRight = NO; } CGFloat precent ; if (distance < 180) { precent = 1.0; } else { precent = ((screenWidth / 2) - distance) / (screenWidth / 2); } CATransform3D transform = CATransform3DIdentity; transform.m34 = 1.0 / 600; if (precent < 0.5) { precent = 0.5; } transform = CATransform3DScale(transform, 1, precent, 1); CGFloat p = isAtRight?M_PI_4:-M_PI_4; transform = CATransform3DRotate(transform, p * (1 - precent), 0, 1, 0); attr.transform3D = transform; attr.zIndex = 1; attr.alpha = precent; } } return array; } - (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity { CGFloat offset = MAXFLOAT; CGFloat hCenter = proposedContentOffset.x + (CGRectGetWidth(self.collectionView.bounds) / 2.0); CGRect currentRect = CGRectMake(proposedContentOffset.x, 0, self.collectionView.bounds.size.width, self.collectionView.bounds.size.height); NSArray* array = [super layoutAttributesForElementsInRect:currentRect]; for (UICollectionViewLayoutAttributes* layoutAttributes in array) { CGFloat itemHorizontalCenter = layoutAttributes.center.x; if (ABS(itemHorizontalCenter - hCenter) < ABS(offset)) { offset = itemHorizontalCenter - hCenter; } } return CGPointMake(proposedContentOffset.x + offset, proposedContentOffset.y); }
運用
-(void)setupUI { JWCollectionViewFlowLayout *flowLayout = [[JWCollectionViewFlowLayout alloc] init]; UICollectionView *imgBrowseView = [[UICollectionView alloc] initWithFrame:self.view.bounds collectionViewLayout:flowLayout]; imgBrowseView.dataSource = self; imgBrowseView.delegate = self; imgBrowseView.backgroundColor = [UIColor whiteColor]; [self.view addSubview:imgBrowseView]; _imgBrowseView = imgBrowseView; [self.imgBrowseView registerNib:[UINib nibWithNibName:@"CustumCollectionViewCell" bundle:nil] forCellWithReuseIdentifier:@"cell"]; }
demo:https://github.com/jiangtaidi/JWImageBrowseDemo.git
運轉後果:
以上就是本文的全部內容,希望對大家的學習有所協助。
【iOS自定義UICollectionViewFlowLayout完成圖片閱讀效果】的相關資料介紹到這裡,希望對您有所幫助! 提示:不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦!