MWPhotoBrowser

一个简单的iOS图片和视频浏览器，带有可选的网格视图、标题和选择

MWPhotoBrowser可以通过提供UIImage对象、PHAsset对象或资源库资产的URL来显示一个或多个图片或视频，网页图片/视频或本地文件。图片浏览器可以无缝地处理从网页下载和缓存图片。图片可以进行缩放和滚动，并且可以显示可选的自定义标题。

该浏览器还可以用于允许用户使用网格或主图片视图来选择一个或多个图片。

适用于iOS 7及以上版本。所有字符串都是可本地化的，因此可以在支持多语言的应用中使用。

使用示例

MWPhotoBrowser旨在在导航控制器内呈现。只需设置代理（必须遵守 MWPhotoBrowserDelegate）并实现所需的代理方法，以将 MWPhoto 对象的数据形式提供给照片浏览器。您可以通过提供 UIImage 对象、PHAsset 对象或包含文件路径的URL（可以是文件、在线图片或资产库中的资产）来创建 MWPhoto 对象。

MWPhoto 对象为您处理缓存、文件管理、下载网络图片以及多种优化。如果您想使用自己的数据模型表示照片，只需确保您的模型遵守 MWPhoto 协议。然后您可以自行处理缓存、下载等管理。有关更多信息，请参阅 MWPhotoProtocol.h。

下面提供了实现照片浏览器的代码示例。项目中也包含一个简单的演示应用程序。

// Create array of MWPhoto objects
self.photos = [NSMutableArray array];

// Add photos
[photos addObject:[MWPhoto photoWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"photo2l" ofType:@"jpg"]]]];
[photos addObject:[MWPhoto photoWithURL:[NSURL URLWithString:@"http://farm4.static.flickr.com/3629/3339128908_7aecabc34b.jpg"]]];
[photos addObject:[MWPhoto photoWithURL:[NSURL URLWithString:@"http://farm4.static.flickr.com/3590/3329114220_5fbc5bc92b.jpg"]]];

// Add video with poster photo
MWPhoto *video = [MWPhoto photoWithURL:[NSURL URLWithString:@"https://scontent.cdninstagram.com/hphotos-xpt1/t51.2885-15/e15/11192696_824079697688618_1761661_n.jpg"]];
video.videoURL = [[NSURL alloc] initWithString:@"https://scontent.cdninstagram.com/hphotos-xpa1/t50.2886-16/11200303_1440130956287424_1714699187_n.mp4"];
[photos addObject:video];

// Create browser (must be done each time photo browser is
// displayed. Photo browser objects cannot be re-used)
MWPhotoBrowser *browser = [[MWPhotoBrowser alloc] initWithDelegate:self];

// Set options
browser.displayActionButton = YES; // Show action button to allow sharing, copying, etc (defaults to YES)
browser.displayNavArrows = NO; // Whether to display left and right nav arrows on toolbar (defaults to NO)
browser.displaySelectionButtons = NO; // Whether selection buttons are shown on each image (defaults to NO)
browser.zoomPhotosToFill = YES; // Images that almost fill the screen will be initially zoomed to fill (defaults to YES)
browser.alwaysShowControls = NO; // Allows to control whether the bars and controls are always visible or whether they fade away to show the photo full (defaults to NO)
browser.enableGrid = YES; // Whether to allow the viewing of all the photo thumbnails on a grid (defaults to YES)
browser.startOnGrid = NO; // Whether to start on the grid of thumbnails instead of the first photo (defaults to NO)
browser.autoPlayOnAppear = NO; // Auto-play first video

// Customise selection images to change colours if required
browser.customImageSelectedIconName = @"ImageSelected.png";
browser.customImageSelectedSmallIconName = @"ImageSelectedSmall.png";

// Optionally set the current visible photo before displaying
[browser setCurrentPhotoIndex:1];

// Present
[self.navigationController pushViewController:browser animated:YES];

// Manipulate
[browser showNextPhotoAnimated:YES];
[browser showPreviousPhotoAnimated:YES];
[browser setCurrentPhotoIndex:10];

然后响应所需的委托方法

- (NSUInteger)numberOfPhotosInPhotoBrowser:(MWPhotoBrowser *)photoBrowser {
    return self.photos.count;
}

- (id <MWPhoto>)photoBrowser:(MWPhotoBrowser *)photoBrowser photoAtIndex:(NSUInteger)index {
    if (index < self.photos.count) {
        return [self.photos objectAtIndex:index];
    }
    return nil;
}

您只需将浏览器包装在一个新的导航控制器中，然后呈现该控制器即可以模态形式呈现浏览器。演示应用程序允许您在两种呈现类型之间切换。

视频

您可以通过提供标准MWPhoto图像对象并带有videoURL属性来在MWPhoto对象中表示视频。您还可以使用PHAsset对象或资产库视频的URL。

// Video with URL including poster photo
MWPhoto *video = [MWPhoto photoWithURL:[NSURL URLWithString:@"https://scontent.cdninstagram.com/hphotos-xpt1/t51.2885-15/e15/11192696_824079697688618_1761661_n.jpg"]];
video.videoURL = [NSURL URLWithString:@"https://scontent.cdninstagram.com/hphotos-xpa1/t50.2886-16/11200303_1440130956287424_1714699187_n.mp4"];

// Video with PHAsset
MWPhoto *video = [MWPhoto photoWithAsset:asset targetSize:[UIScreen mainScreen].bounds.size]; // Example sizing

// Video with ALAsset
MWPhoto *video = [MWPhoto photoWithURL:asset.defaultRepresentation.url];
if ([asset valueForProperty:ALAssetPropertyType] == ALAssetTypeVideo) {
    photo.videoURL = asset.defaultRepresentation.url;
}

// Video with no poster photo
MWPhoto *video = [MWPhoto videoWithURL:[NSURL URLWithString:@"https://scontent.cdninstagram.com/hphotos-xfa1/t50.2886-16/11237510_945154435524423_2137519922_n.mp4"]];

// Video grid thumbnail
MWPhoto *videoThumb = [MWPhoto photoWithURL:[NSURL URLWithString:@"https://scontent.cdninstagram.com/hphotos-xaf1/t51.2885-15/s150x150/e15/11240463_963135443745570_1519872157_n.jpg"]];
videoThumb.isVideo = YES;

// Video grid thumbnail for video with no poster photo
MWPhoto *videoThumb = [MWPhoto new];
videoThumb.isVideo = YES;

网格

为了正确显示缩略图网格，您必须确保属性enableGrid设置为YES，并实现以下代理方法

- (id <MWPhoto>)photoBrowser:(MWPhotoBrowser *)photoBrowser thumbPhotoAtIndex:(NSUInteger)index;

相册浏览器也可以通过启用startOnGrid属性直接在网格上开始。

操作

默认情况下，如果操作按钮可见，则图像（如果有的话，还有标题）将被发送到UIActivityViewController。

您可以通过实现以下代理方法提供自定义操作

- (void)photoBrowser:(MWPhotoBrowser *)photoBrowser actionButtonPressedForPhotoAtIndex:(NSUInteger)index {
    // Do your thing!
}

照片标题

可以通过设置特定照片上的caption属性简单地显示照片标题

MWPhoto *photo = [MWPhoto photoWithURL:[NSURL URLWithString:@"http://farm4.static.flickr.com/3629/3339128908_7aecabc34b.jpg"]];
photo.caption = @"Campervan";

如果不设置标题属性，则不会显示标题。

自定义标题

默认情况下，标题是一个简单的黑色透明视图，带有标签以白色显示照片的标题。如果您想实现自己的标题视图，请按照以下步骤操作

可选地使用MWPhoto的子类来保存您的照片，这样您就可以存储比简单的标题字符串更多的数据。
继承 MWCaptionView 并重写 -setupCaption 和 -sizeThatFits: （以及您认为合适的任何 UIView 方法），以布局您自己的视图并设置其大小。更多相关信息可以在 MWCaptionView.h 中找到。
实现 -photoBrowser:captionViewForPhotoAtIndex: MWPhotoBrowser 代理方法（如下所示）。

自定义标题视图的示例代理方法

- (MWCaptionView *)photoBrowser:(MWPhotoBrowser *)photoBrowser captionViewForPhotoAtIndex:(NSUInteger)index {
    MWPhoto *photo = [self.photos objectAtIndex:index];
    MyMWCaptionViewSubclass *captionView = [[MyMWCaptionViewSubclass alloc] initWithPhoto:photo];
    return captionView;
}

选择

图片浏览器可以显示复选框，让用户选择一张或多张图片。要使用此功能，只需启用 displaySelectionButtons 属性，并实现以下代理方法

- (BOOL)photoBrowser:(MWPhotoBrowser *)photoBrowser isPhotoSelectedAtIndex:(NSUInteger)index {
    return [[_selections objectAtIndex:index] boolValue];
}

- (void)photoBrowser:(MWPhotoBrowser *)photoBrowser photoAtIndex:(NSUInteger)index selectedChanged:(BOOL)selected {
    [_selections replaceObjectAtIndex:index withObject:[NSNumber numberWithBool:selected]];
}

安装

MWPhotoBrowser 通过 CocoaPods 提供使用。要安装它，只需将以下行添加到您的 Podfile 中

pod "MWPhotoBrowser"

使用方法

要运行示例项目，首先克隆仓库，然后从 Example 目录运行 pod install。

然后导入图片浏览器到您的源文件（如果是使用 Swift 并且不使用 CocoaPods 的框架，则导入到您的桥接头中）

#import "MWPhotoBrowser.h"

如果您使用 Swift 和框架，可以直接将浏览器导入到 Swift 源文件中

import MWPhotoBrowser

作者

Michael Waterfall, [email protected]

许可证

MWPhotoBrowser 在 MIT 许可下可用。有关更多信息，请参阅 LICENSE 文件。

笔记

演示照片由Oliver Waters乐意提供。


依赖
MBProgressHUD	~> 0.9
DACircularProgress	~> 2.3
SDWebImage	!= 3.7.2, ~> 3.7

MWPhotoBrowser_angels2it 2.1.3

MWPhotoBrowser_angels2it 2.1.3

MWPhotoBrowser_angels2it 2.1.3

MWPhotoBrowser

一个简单的iOS图片和视频浏览器，带有可选的网格视图、标题和选择

使用示例

视频

网格

操作

照片标题

自定义标题

选择

安装

使用方法

作者

许可证

笔记