WPMediaPicker

WPMediaPicker is an iOS controller that allows capture and picking of media assets. It allows:

• Allows selection of multiple media objects in one go.
• Capture of new media while inside the picker.
• Use different data sources for the media library.
• Switch between different albums.
• Filtering by media types.
• Preview of media (images and video) in full screen.
• Show the media picker inside as a keyboard input view.
• Super quick and memory optimized.
• Allow horizontal and vertical scroll of assets.

Installation

WPMediaPicker is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "WPMediaPicker"

Usage

To use the picker do the following:

Import header

#import <WPMediaPicker/WPMediaPicker.h>

Create and present the picker in modal mode

WPNavigationMediaPickerViewController * mediaPicker = [[WPNavigationMediaPickerViewController alloc] init];
mediaPicker.delegate = self;
[self presentViewController:mediaPicker animated:YES completion:nil];

Implement didFinishPickingAssets delegate

The delegate is responsible for dismissing the picker when the operation completes. To dismiss the picker, call the dismissViewControllerAnimated:completion: method of the presenting controller responsible for displaying the WPNavigationMediaPickerController object. Please refer to the demo app.

- (void)mediaPickerController:(WPMediaPickerViewController *)picker didFinishPickingAssets:(NSArray<WPMediaAsset> *)assets
{
  [self dismissViewControllerAnimated:YES completion:nil];    
}

Other methods to display the picker

The example above shows the recommended way to show the picker in a modal. There are currently three available controllers to show the picker depending on your application needs:

• WPMediaPickerViewController, this is the base collection view controller that displays the media. It can be used inside another view controllers using containment.
• WPInputMediaPickerViewController, a wrapper of the WPMediaPickerController to be used has an inputView of an UIControl.
• WPNavigationMediaPickerViewController, a convenience wrapper of the WPMediaPickerViewController inside a UINavigationController to show in a modal context.

How to configure the appearance of the picker

Just use the standard appearance methods from UIKit. Here is an example how to configure the main components

//Configure navigation bar background color
[[UINavigationBar appearanceWhenContainedInInstancesOfClasses:@[[WPNavigationMediaPickerViewController class]]] setBarTintColor:[UIColor colorWithRed:0/255.0f green:135/255.0f blue:190/255.0f alpha:1.0f]];
//Configure navigation bar items text color
[[UINavigationBar appearanceWhenContainedInInstancesOfClasses:@[[WPNavigationMediaPickerViewController class]]] setTintColor:[UIColor whiteColor]];
//Configure navigation bar title text color
[[UINavigationBar appearanceWhenContainedInInstancesOfClasses:@[[WPNavigationMediaPickerViewController class]]] setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor whiteColor]} ];
//Configure background color for media scroll view
[[UICollectionView appearanceWhenContainedInInstancesOfClasses:@[[WPMediaCollectionViewController class]]] setBackgroundColor:[UIColor colorWithRed:233/255.0f green:239/255.0f blue:243/255.0f alpha:1.0f]];
//Configure background color for media cell while loading image.
[[WPMediaCollectionViewCell appearanceWhenContainedInInstancesOfClasses:@[[WPMediaCollectionViewController class]]] setBackgroundColor:[UIColor colorWithRed:243/255.0f green:246/255.0f blue:248/255.0f alpha:1.0f]];
//Configure color for activity indicator while loading media collection
[[UIActivityIndicatorView appearanceWhenContainedInInstancesOfClasses:@[[WPMediaCollectionViewController class]]] setColor:[UIColor grayColor]];

How to use a custom data source for the picker

If you have a custom database of media and you want to display it using the WPMediaPicker you need to to implement the following protocols around your data:

• WPMediaCollectionDataSource
• WPMediaGroup
• WPMediaAsset

You can view the protocols documentation for more implementation details. After you have implemented it you can use it by simple doing the following:

self.customDataSource = [[WPCustomAssetDataSource alloc] init];
mediaPicker.dataSource = self.customDataSource;

Sample Project

To run the example project, clone the repo, and run pod install from the Example directory first.

Requirements

• ARC
• Photos, AVFoundation, ImageIO
• XCode 9 or above
• iOS 10 or above

Author

WordPress, mobile@automattic.com

License

WPMediaPicker is available under the GPL license. See the LICENSE file for more info.