IOS photo browser – XLPhotoBrowser (similar to WeChat multi picture browsing effect)

XLPhotoBrowser GitHub link

1.XLPhotoBrowser description

A simple picture browser, similar WeChat photo browser, support pop-up animation and animation retraction, support multi support local and network browsing, picture browsing, support a variety of custom attributes (not support screen adaptation)
has the advantages of convenient use, a simple line of code can be integrated into the picture browsing

Support a variety of image browsing style

  • Similar to WeChat picture browsing style XLPhotoBrowserStylePageControl, the bottom has a pagecontrol display image index
  • Similar to micro-blog pictures browsing style XLPhotoBrowserStyleIndexLabel, above a UILabel display image index
  • Simple style XLPhotoBrowserStyleSimple, above UILabel display image index, the lower left part of a save button, you can save the current picture
IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
home page
IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
XLPhotoBrowserStylePageControl
IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
XLPhotoBrowserStyleIndexLabel
IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
XLPhotoBrowserStyleSimple

Support for long gestures pop-up pop-up box, similar to the effect of micro-blog WeChat

IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
long press the picture pop-up multi-function selection box

Other renderings:

IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
XLPhotoBrowserDemo.gif
IOS photo browser - XLPhotoBrowser (similar to WeChat multi picture browsing effect)
XLPhotoBrowserDemo2.gif

2 installation method

  • Download the sample Demo, the inside of the XLPhotoBrowser folder into your project can be (Note: it uses a number of third party library, if your project has been used in these libraries, you can delete the case)

3 instructions for use

3.1 basic use (to provide 2 ways to transfer data: the picture in the form of bulk transfer and data source method to separate each location of the image data transfer

Method 1: a line of code to enter the image browser in certain scenarios, for example just want to browse a set of local / network images, you can use this:
The incoming picture / data source, direct picture browsing the incoming picture data source self.images / / array can be an array of UIImage objects, ALAsset objects can be, can also be a picture of NSURL links, or links can be turned into NSURL NSString [XLPhotoBrowser showPhotoBrowserWithImages:self.images currentImageIndex:0] array of objects;
Method two: if you do not provide the appropriate way to image array, you can consider the realization of the data source method, providing data
  • The data source method provides three different requirements that need to be used in conjunction with different methods. Based on the annotations of each method and the requirements of the project, the specific methods to be implemented are determined
Enter the picture browser * / / * * - (void) clickImage: (UITapGestureRecognizer *) tap [XLPhotoBrowser showPhotoBrowserWithCurrentImageIndex:tap.view.tag imageCount:self.images.count datasource:self] {#pragma mark;} / * * * XLPhotoBrowserDatasource - return to the position of the placeholder images can also be original * if this method is not implemented, will use the default placeholderImage * * * @param index @param browser browser location index * * @return a picture - * / (UIImage *) photoBrowser: (* XLPhotoBrowser) browser placeholderImageForIndex: (NSInteger) index {return self.images[index];} / * * * returns the specified location of the picture UIImageView, used for photo browser pop-up magnifying and disappear retraction animation * without implementation of this method, no Retraction of animation, if passed view is not correct, may affect the retraction of animation * * @param browser * @param index browser location index * * @return display pictures of the container view, such as UIImageView * - (UIView *) photoBrowser: (* XLPhotoBrowser) browser sourceImageViewForIndex: (NSInteger) index {return self.scrollView.subviews[index];} / * * * * URL HD picture returns the specified location if you want to display high quality images, this method can transfer network / local image path to achieve the effect of * * * @param index @param browser browser location index * * @return * / - returns the larger HD index (NSURL *) photoBrowser: (* XLPhotoBrowser) browser highQualityImageURLForIndex: (NSInteger) index {return [NSURL URLWithString:self.u RlStrings[index]];}

Ps: in the following example code, such as non essential, unified with the first way to pass an array of images to show

3.2 advanced instructions (custom attributes, etc.)

  • How to browse a web browser
    line of code into the browser, the transfer of the address of the network image array can be
1 / NSURL / / NSMutableArray *URLArray = [NSMutableArray array array]; / / for (NSString *urlString in self.urlStrings) {/ / NSURL *URL = [NSURL URLWithString:urlString]; / / [URLArray / / addObject:URL] / / [XLPhotoBrowser showPhotoBrowserWithImages:URLArray currentImageIndex:0];}; / / the 2 can become a NSURL link [XLPhotoBrowser showPhotoBrowserWithImages:self.urlStrings currentImageIndex:0] array of NSString objects;

Or use the data source, the realization of photoBrowser: highQualityImageURLForIndex: method

- (void) clickImage: (UITapGestureRecognizer *) tap [XLPhotoBrowser showPhotoBrowserWithCurrentImageIndex:tap.view.tag imageCount:self.images.count datasource:self] {#pragma mark;} / / - XLPhotoBrowserDatasource can not achieve this method - (UIImage *) photoBrowser: (* XLPhotoBrowser) browser placeholderImageForIndex: (NSInteger) index {return self.images[index];} - (NSURL *) photoBrowser: (* XLPhotoBrowser) browser highQualityImageURLForIndex: (NSInteger) index [NSURL {return URLWithString:self.urlStrings[index]];}
  • How to add custom menu and press the gesture to obtain XLPhotoBrowser instance object, call the setActionSheetWithTitle:delegate:cancelButtonTitle:deleteButtonTitle:otherButtonTitles: method and XLPhotoBrowserDelegate method in the proxy monitor user selection
/ * * * * * browse pictures - (void) clickImage: (UITapGestureRecognizer * tap) {XLPhotoBrowser *browser = [XLPhotoBrowser showPhotoBrowserWithImages:self.images currentImageIndex:tap.view.tag]; browser.browserStyle = XLPhotoBrowserStyleIndexLabel; / / set / / micro-blog style long press ActionSheet data point gesture of pop, not realizing this method did not press the gesture [browser setActionSheetWithTitle:@ "this is a similar WeChat / micro-blog pictures the delegate:self cancelButtonTitle:nil deleteButtonTitle browser component":@ "delete" otherButtonTitles:@ "send to a friend", "save the picture", @ @ @ "collection", "complaint", nil] #pragma mark;} - XLPhotoBrowserDelegate - (void) photoBrowser: (XLPhotoBrowser *) browser clickActionSheetIndex: (NSInteger) actionSheetin DEX currentImageIndex: (NSInteger currentImageIndex) {/ / do (actionSheetindex) something yourself switch case 4: NSLog {{/ / delete (@ "click on the actionSheet index is%zd, the display picture index:%zd, actionSheetindex, currentImageIndex); [self.images removeObjectAtIndex:currentImageIndex]; [self resetScrollView]; break case 1:}; / / {NSLog (save" click on @ actionSheet index is%zd, the display picture index is:%zd, actionSheetindex, currentImageIndex); [browser saveCurrentShowImage];} default: {break; NSLog (@ "click the actionSheet index:%zd, current display map The index is: "%zd, actionSheetindex, currentImageIndex);} break;}}
  • How to select the browser style to get to the instance object, set the browserStyle property
XLPhotoBrowser *browser = [XLPhotoBrowser showPhotoBrowserWithImages:self.images currentImageIndex:tap.view.tag]; browser.browserStyle = XLPhotoBrowserStyleIndexLabel; / / micro-blog style
  • How to modify pagecontrol to zoom animation style is only valid in the XLPhotoBrowserStylePageControl style, the XLPhotoBrowserStyleIndexLabel style is invalid
Browser.pageDotColor = [UIColor purpleColor] / pageControl ///< custom attribute;; this property for animation style pagecontrol greenColor] browser.pageControlStyle invalid browser.currentPageDotColor = [UIColor; ///< = XLPhotoBrowserPageControlStyleClassic; pagecontrol; modify the bottom pattern for the system is the default style, elastic animation style
  • PhotoBrowser:sourceImageViewForIndex: method to realize data source methods in how to realize the transition animations like WeChat that click into the picture browser image zoom and exit when browsing picture zoom, container view transfer pictures, can make the transition animation
#pragma - XLPhotoBrowserDatasource - mark (UIImage *) photoBrowser: (* XLPhotoBrowser) browser placeholderImageForIndex: (NSInteger) index {return self.images[index];} - (UIView *) photoBrowser: (* XLPhotoBrowser) browser sourceImageViewForIndex: (NSInteger) index {return self.scrollView.subviews[index];}
  • How to use XLPhotoBrowserConfig, how to open the debug mode, message output format in the XLPhotoBrowserConfig open the code to //#define XLPhotoBrowserDebug 1 can also modify many style properties, such as: here the background color / modify the browser picture space, use a very simple way, the specific use will not go into details here

4 like, give the author a star, you can contact me through the following way

  • QQ group: 579572313 (what is the problem, welcome to the group to discuss questions)
  • Email: [email protected]