Demo 下載
一无牵、預(yù)覽
圖片瀏覽.gif
二漾肮、如何使用（使用簡(jiǎn)單）
CLPhotoBrowser *brower = [[CLPhotoBrowser alloc] init];
brower.photos = [NSMutableArray array];
int i=0;
for (UIImageView *imageView in self.images) {
CLPhoto *photo = [[CLPhoto alloc] init];
NSString *url = [_urls[i] stringByReplacingOccurrencesOfString:@"thumbnail" withString:@"bmiddle"];
photo.url = url;
photo.thumbUrl = _urls[i];
photo.scrRect = [imageView convertRect:imageView.bounds toView:nil];
[brower.photos addObject:photo];
i++;
}
brower.selectImageIndex = tap.view.tag;
[brower show];
brower.delegate = self;
文件結(jié)構(gòu).png
三、庫(kù)結(jié)構(gòu)
CLPhotoBrowser：圖片瀏覽器的容器茎毁，顯示在window中的rootViewController
CLPhoto:保存圖片URL和其他數(shù)據(jù)的數(shù)據(jù)模型
PhotoBrowserCell：UICollectionViewCell的子類克懊，用于顯示圖片
CLPhotoProgressView：顯示圖片下載進(jìn)度的View
四、內(nèi)部實(shí)現(xiàn)
1、視圖顯示位置
- (void)show
{
[[UIApplication sharedApplication].keyWindow endEditing:YES];
UIViewController *rootViewCtl = [UIApplication sharedApplication].keyWindow.rootViewController;
[rootViewCtl addChildViewController:self];
[rootViewCtl.view addSubview:self.view];
[self showFirstImageView];
}
2谭溉、顯示第一張圖片的動(dòng)畫
- (void)showFirstImageView
{
CLPhoto *photo = [self.photos objectAtIndex:self.selectImageIndex];
self.imageView = [[UIImageView alloc] init];
[self.view addSubview:self.imageView];
BOOL existBigPic = NO;
self.imageView.image = [CLPhoto existImageWithUrl:photo.url];
if (self.imageView.image) { //查看大圖是否存在
existBigPic = YES;
}else{//查看小圖是否存在
self.imageView.image = [CLPhoto existImageWithUrl:photo.thumbUrl];
if (self.imageView.image == nil) { //大小圖都不存在時(shí)
self.imageView.image = [UIImage imageNamed:@"dialog_load"];
}
}
//漸變顯示
self.view.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.0];
self.imageView.frame = photo.scrRect;
__weak typeof(self)weakself = self;
CGPoint ScreenCenter = self.view.window.center;
[UIView animateWithDuration:duration animations:^{
//有大圖直接顯示大圖墙懂，沒有先顯示小圖
if (existBigPic) {
CGSize size = [CLPhoto displaySize:self.imageView.image];
weakself.imageView.frame = CGRectMake(0, 0, size.width, size.height);
//長(zhǎng)圖處理
if (size.height<=[UIScreen mainScreen].bounds.size.height) {
weakself.imageView.center = ScreenCenter;
}
}else{
self.imageView.center = self.view.center;
}
weakself.view.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:1.0];
} completion:^(BOOL finished) {
[weakself.imageView removeFromSuperview];
weakself.imageView = nil;
weakself.collectionView.contentOffset = CGPointMake(self.selectImageIndex*[UIScreen mainScreen].bounds.size.width, 0);
weakself.pageCtl.numberOfPages = self.photos.count;
weakself.pageCtl.currentPage = self.selectImageIndex;
weakself.currentSelectIndex = self.selectImageIndex;
[_collectionView setContentOffset:(CGPoint){weakself.currentSelectIndex * (self.view.bounds.size.width + 20),0} animated:NO];
}];
}
3、點(diǎn)擊圖片隱藏圖片動(dòng)畫
- (void)hide:(UIImageView *)imageView with:(CLPhoto *)photo
{
CGFloat width = imageView.image.size.width;
CGFloat height = imageView.image.size.height;
CGSize tempRectSize = (CGSize){ScreenWidth,(height * ScreenWidth / width) > ScreenHeight ? ScreenHeight:(height * ScreenWidth / width)};
[imageView setBounds:(CGRect){CGPointZero,{tempRectSize.width,tempRectSize.height}}];
[imageView setCenter:self.view.center];
[self.view addSubview:imageView];
[UIView animateWithDuration:duration delay:0 options:UIViewAnimationOptionCurveEaseOut animations:^{
[imageView setFrame:photo.scrRect];
self.view.backgroundColor = [UIColor clearColor];
} completion:^(BOOL finished) {
[self.view removeFromSuperview];
[self removeFromParentViewController];
}];
}
4扮念、給UIImageView添加手勢(shì)
- (UIImageView *)imageView
{
if (_imageView == nil) {
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectZero];
imageView.userInteractionEnabled = YES;
// 1.生產(chǎn) 兩種 手勢(shì)
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(scrollViewDidTap)];
UITapGestureRecognizer *doubleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(scrollViewDidDoubleTap:)];
UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPressToDo:)];
// 2.設(shè)置 手勢(shì)的要求
[tap setNumberOfTapsRequired:1];
[tap setNumberOfTouchesRequired:1];
[doubleTap setNumberOfTapsRequired:2];
[doubleTap setNumberOfTouchesRequired:1];
// 3.避免兩種手勢(shì)沖突
[tap requireGestureRecognizerToFail:doubleTap];
// 4.添加 手勢(shì)
[self addGestureRecognizer:tap];
[self addGestureRecognizer:doubleTap];
[self addGestureRecognizer:longPress];
[self.scrollview addSubview:imageView];
_imageView = imageView;
}
return _imageView;
}
5损搬、圖片下載，先判斷圖片是否已經(jīng)下載
- (UIImage *)image
{
UIImage *urlImage = [CLPhoto existImageWithUrl:self.url];
if (urlImage) {
if (self.progressBlock) {
self.progressBlock(1);
}
CGSize size = [CLPhoto displaySize:urlImage];
self.imageViewBounds = CGRectMake(0, 0, size.width, size.height);
return urlImage;
}else{
__weak typeof(self)weakself = self;
[[SDWebImageManager sharedManager] downloadImageWithURL:[NSURL URLWithString:self.url] options:SDWebImageRetryFailed progress:^(NSInteger receivedSize, NSInteger expectedSize) {
if (weakself.progressBlock != nil) {
CGFloat f = receivedSize*1.0 / expectedSize;
weakself.progressBlock(f);
}
} completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
weakself.downLoad = YES;
}];
UIImage *thumbImage = [CLPhoto existImageWithUrl:self.thumbUrl];
self.imageViewBounds = self.scrRect;
return thumbImage;
}
}
4扔亥、工具方法
（1）圖片在手機(jī)上面按比例顯示
+ (CGSize)displaySize:(UIImage *)image
{
// 1.拿到圖片的寬高比
CGFloat imageW = image.size.width;
CGFloat ScreenW = [UIScreen mainScreen].bounds.size.width;
CGFloat scale = image.size.height / imageW;
// 2.根據(jù)寬高比計(jì)算高度
CGFloat width = 0;
//最小UIImageView的顯示寬度為100px
if (imageW < 100) {
width = 100;
}else if (imageW > ScreenW) {
width = ScreenW;
}else{
width = image.size.width;
}
CGFloat height = width * scale;
return CGSizeMake(width, height);
}
（2）判斷圖片是否在內(nèi)存中或者緩存到沙盒中
+ (UIImage *)existImageWithUrl:(NSString *)urlStr
{
SDWebImageManager *manager = [SDWebImageManager sharedManager];
UIImage *image = nil;
NSURL *url = [NSURL URLWithString:urlStr];
NSString *key = [manager cacheKeyForURL:url];
image = [manager.imageCache imageFromMemoryCacheForKey:key]; //先看看內(nèi)存在是否存在圖片
if (!image) {
image = [manager.imageCache imageFromDiskCacheForKey:key]; //重緩存中取出改圖片
}
return image;
}
