测试已测试 | ✗ |
Lang语言 | Obj-CObjective C |
许可 | MIT |
发布上次发布 | 2017年6月 |
由赵奕奇维护。
依赖 | |
SDWebImage | = 4.0.0 |
SDWebImage/GIF | = 4.0.0 |
DACircularProgress | >= 0 |
ZYQPhotoBrowser 是基于 MWPhotoBrowser 的新实现。
我们添加了 Facebook 和 Tweetbot 照片浏览器启发的用户体验和技术功能。
查看下面的代码示例,了解如何实现照片浏览器。
首先创建一个包含 ZYQPhoto 对象的 photos 数组
// URLs array
NSArray *photosURL = @[
[NSURL URLWithString:@"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1498113175410&di=bd10bcd2b2a45906259f4e823bbf9df6&imgtype=0&src=http%3A%2F%2Fpic.58pic.com%2F58pic%2F14%2F27%2F45%2F71r58PICmDM_1024.jpg"]
,[NSURL URLWithString:@"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1498113236506&di=004225eba24d74087feaeaa9484db047&imgtype=0&src=http%3A%2F%2Fic.topit.me%2Fc%2F3c%2Ff6%2F1110230348da8f63cco.jpg"]
,[NSURL URLWithString:@"https://timgsa.baidu.com/timg?image&quality=80&size=b10000_10000&sec=1498103182&di=eb660bada9ced24acbc9153464aaedcd&src=http://www.bz55.com/uploads/allimg/141120/139-141120151946.jpg"]
,[NSURL URLWithString:@"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1498139264538&di=6e5cedbfecc6a0e4bce2fc0005f56785&imgtype=0&src=http%3A%2F%2Fimg3.a0bi.com%2Fupload%2Fttq%2F20140719%2F1405761279700.gif"]
];
// Create an array to store ZYQPhoto objects
NSMutableArray *photos = [NSMutableArray new];
for (NSURL *url in photosURL) {
ZYQPhoto *photo = [ZYQPhoto photoWithURL:url];
[photos addObject:photo];
}
// Or use this constructor to receive an NSArray of ZYQPhoto objects from your NSURL objects
NSArray *photos = [ZYQPhoto photosWithURLs:photosURL];
有两种主要方式来显示 photoBrowser,一种是在屏幕上淡入淡出,另一种是从现有视图进行缩放效果。
使用简单的淡入淡出过渡
ZYQPhotoBrowser *browser = [[ZYQPhotoBrowser alloc] initWithPhotos:photos];
从视图缩放效果
ZYQPhotoBrowser *browser = [[ZYQPhotoBrowser alloc] initWithPhotos:photos animatedFromView:sender];
在使用此动画时,您可以设置 scaleImage
属性,以防从视图中的图像与浏览器上显示的图像不同,因此它会动态缩放它
browser.scaleImage = buttonSender.currentImage;
使用模态视图控制器展示
[self presentViewController:browser animated:YES completion:nil];
您可以自定义工具栏。有三个布尔属性您可以设置:displayActionButton(默认为 YES),displayArrowButton(默认为 YES)和 displayCounterLabel(默认为 NO)。如果您根本不想使用工具栏,您可以设置 displayToolbar = NO。
工具栏设置示例
browser.displayActionButton = NO;
browser.displayArrowButton = YES;
browser.displayCounterLabel = YES;
您可以使用自己的图像作为工具栏箭头
browser.leftArrowImage = [UIImage imageNamed:@"PhotoBrowser_customArrowLeft.png"];
browser.rightArrowImage = [UIImage imageNamed:@"PhotoBrowser_customArrowRight.png"];
browser.leftArrowSelectedImage = [UIImage imageNamed:@"PhotoBrowser_customArrowLeftSelected.png"];
browser.rightArrowSelectedImage = [UIImage imageNamed:@"PhotoBrowser_customArrowRightSelected.png"];
如果您想使用自定义操作,请使用 actionButtonTitles 数组设置操作表标题。然后,从 ZYQPhotoBrowser 委托中实现 photoBrowser:didDismissActionSheetWithButtonIndex:photoIndex: 方法
browser.actionButtonTitles = @[@"Option 1", @"Option 2", @"Option 3", @"Option 4"];
您可以进行的其他自定义包括:使用白色背景颜色,不显示完成按钮,并更改完成按钮的背景图像
browser.useWhiteBackgroundColor = YES;
browser.displayDoneButton = NO;
browser.doneButtonImage = [UIImage imageNamed:@"PhotoBrowser_customDoneButton.png"];
如果您想保持用户在滚动时显示的界面
browser.autoHideInterface = NO;
您可以在展示和消失照片时使用平滑的缩放动画
browser.useZoomAnimation = YES;
如果展示视图控制器没有状态栏,在某些情况下,您可以强制将其隐藏
browser.forceHideStatusBar = YES;
可以禁用垂直消失滑动手势
browser.disableVerticalSwipe = YES;
触摸消失照片浏览器(而不是显示/隐藏控件)
browser.dismissOnTouch = YES;
您可以使用自定义背景
browser.customBackgroud=[[BackgroudBlurView alloc] init];
照片标题可以通过在特定照片上设置 caption
属性来简单显示
ZYQPhoto *photo = [ZYQPhoto photoWithFilePath:[[NSBundle mainBundle] pathForResource:@"photo2l" ofType:@"jpg"]];
photo.caption = @"Campervan";
如果没有设置标题属性,则不会显示任何标题。
默认情况下,标题是一个简单的黑色透明视图,标签以白色显示照片的标题。如果您想实现自己的标题视图,请按照以下步骤操作
ZYQPhoto
的子类来存储您的照片,以便您可以存储比简单标题字符串更多的数据。ZYQCaptionView
并重写 -setupCaption
、-sizeThatFits:
(以及您认为合适的任何其他 UIView
方法)来布局您自己的视图并设置其大小。更多关于这方面的信息可以在 ZYQCaptionView.h
中找到-photoBrowser:captionViewForPhotoAtIndex:
(如下所示)。自定义标题视图的示例代理方法
- (ZYQCaptionView *)photoBrowser:(ZYQPhotoBrowser *)photoBrowser captionViewForPhotoAtIndex:(NSUInteger)index {
ZYQPhoto *photo = [self.photos objectAtIndex:index];
MyCaptionViewSubclass *captionView = [[MyCaptionViewSubclass alloc] initWithPhoto:photo];
return captionView;
}
您需要实现协议
//ZYQPhotoBrowser's
@protocol ZYQPhotoBrowserCustomProtocol <NSObject>
@required
- (void)custom_animateView:(UIView *)view toFrame:(CGRect)frame completion:(void (^)(void))completion;
@end
//ZYQPhoto's
@protocol ZYQPhotoCustomLoadProtocol <NSObject>
@required
-(void)loadImageWithURL:(NSURL*)url updateProgressBlock:(void (^)(CGFloat progress))updateProgressBlock completedBlock:(void (^)(UIImage *image,NSError *error))completedBlock;
-(id)loadImageWithFile:(NSString *)path;
@end
//ZYQZoomingScrollView's
@class ZYQPhotoBrowser;
@protocol ZYQZoomingScrollViewCustomProtocol <NSObject>
@required
-(id)getCustomProgressViewWithBrowser:(ZYQPhotoBrowser*)browser;
@end
//Your ProgressView's
@protocol ZYQProgressViewProtocol <NSObject>
@required
@property(nonatomic,assign)CGFloat zyq_progress;
@end
示例
将 pod 'YYWebImage'
添加到您的 Podfile 中。
@interface ZYQPhoto (Custom)<ZYQPhotoCustomLoadProtocol>
@end
@implementation ZYQPhoto (Custom)
-(void)loadImageWithURL:(NSURL*)url updateProgressBlock:(void (^)(CGFloat progress))updateProgressBlock completedBlock:(void (^)(UIImage *image,NSError *error))completedBlock{
[[YYWebImageManager sharedManager] requestImageWithURL:url options:YYWebImageOptionAllowBackgroundTask progress:^(NSInteger receivedSize, NSInteger expectedSize) {
if (updateProgressBlock) {
updateProgressBlock(receivedSize/expectedSize*1.0);
}
} transform:nil completion:^(UIImage * _Nullable image, NSURL * _Nonnull url, YYWebImageFromType from, YYWebImageStage stage, NSError * _Nullable error) {
if (completedBlock) {
completedBlock(image,error);
}
}];
}
-(id)loadImageWithFile:(NSString *)path{
return [YYImage imageWithContentsOfFile:path];
}
@end
@interface ZYQZoomingScrollView (Custom)<ZYQZoomingScrollViewCustomProtocol>
@end
@implementation ZYQZoomingScrollView (Custom)
-(id)getCustomProgressViewWithBrowser:(ZYQPhotoBrowser *)browser{
CGRect screenBound = [[UIScreen mainScreen] bounds];
CGFloat screenWidth = screenBound.size.width;
CGFloat screenHeight = screenBound.size.height;
DACircularProgressView *tmpProgressView = [[DACircularProgressView alloc] initWithFrame:CGRectMake((screenWidth-35.)/2., (screenHeight-35.)/2, 35.0f, 35.0f)];
[tmpProgressView setProgress:0.0f];
tmpProgressView.tag = 101;
tmpProgressView.thicknessRatio = 0.1;
tmpProgressView.roundedCorners = NO;
tmpProgressView.trackTintColor = browser.trackTintColor ? browser.trackTintColor : [UIColor colorWithWhite:0.2 alpha:1];
tmpProgressView.progressTintColor = browser.progressTintColor ? browser.progressTintColor : [UIColor colorWithWhite:1.0 alpha:1];
_progressView=tmpProgressView;
return tmpProgressView;
}
@end
@interface DACircularProgressView (Custom)<ZYQProgressViewProtocol>
@end
@implementation DACircularProgressView (Custom)
-(void)setZyq_progress:(CGFloat)zyq_progress{
[self setProgress:zyq_progress animated:YES];
}
-(CGFloat)zyq_progress{
return [self progress];
}
@end
本项目使用 MIT 许可证。