iOS open source encrypted album agony implementation (VI)

Brief introduction

Although there are some good encryption album app on the market, but not the built-in ads, it is to limit the number of uploads. This paper introduces the production process of an encrypted album, which will include multiple passwords (enter different passwords to access different spaces, can be used to hide), WiFi transmission map, photo file encryption and other functions. Currently the project and the article will go forward at the same time, the project source code can be downloaded on GitHub.
Click to go to GitHub

Overview

The previous article mainly introduced the photo preservation, delete batch processing implementation. This article describes the implementation details of the picture browser's original view, zoom, and swipe to toggle the picture.

Implementation of picture scaling general description

You can use Uiscrollview's zoom-related properties and methods to handle the zoom of the view, which supports pinch and gesture. There is a proxy method on ScrollView that shows which view the scaling works on, as follows.

- (nullable UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView; 

You can set the zoom scale and the current zoom value by using the following properties.

@property(nonatomicCGFloat// default is 1.0@property(nonatomicCGFloat// default is 1.0. must be > minimum zoom scale to enable zooming@property(nonatomicCGFloat// default is 1.0

You can set the scale of the picture size to fit the screen to 1.0, the maximum scaling value depends on the original size, if the original size corresponding to a scale of less than 5.0 to take 5.0, otherwise take the original size, so that the small image can also be scaled.

While changing the size of the picture, the ScrollView contentsize will be set to the same, so that you can swipe to reach the different parts of the picture, and swipe left and right to scroll to the edge of the picture before the picture switch.

Class structure

For the original view, each picture is a Uiscrollview sub-class, the picture click will pass the event outward, corresponding to the navigation bar and the toolbar's hidden and display state rollover, Double-clicking will make the original state (Sgimageviewstateorigin) and adapt to the screen state of the flip (Sgimageviewstatefit), with a pinch gesture will make the picture into the Middle State (Sgimageviewstatenone), The specific implementation is as follows.

typedefNs_options (Nsinteger, sgimageviewstate) {Sgimageviewstatenone =0, Sgimageviewstatefit, Sgimageviewstateorigin};//used to define a block that passes the click event Outwardtypedef void(^sgzoomingimageviewtaphandlerblock) (void); @interface sgzoomingimageview : uiscrollview @property(nonatomic,Assign) Sgimageviewstate State;//ImageView for displaying pictures@property(nonatomic,Strong)Uiimageview*innerimageview;//used to determine whether the current display is thumbnail or original, for memory optimization, explained below@property(nonatomic,Assign)BOOLIsorigin;//Click the event callback block setter- (void) Setsingletaphandler: (Sgzoomingimageviewtaphandlerblock) handler;//Zoom picture to fit screen (picture width equals screen width)- (void) Scaletofitanimated: (BOOL) animated;//Zoom the picture to its original size- (void) Scaletooriginsize: (BOOL) animated;//Flip to fit the screen with the original size, if in the middle State, then zoom to artwork- (void) Togglestate: (BOOL) animated;@end

Clicks and double-click processing

Since the double-click has been clicked, it is necessary to trigger the click before double-clicking, there are two solutions for double-clicking and clicking on the individual trigger.
One is to set the dependency of the gesture trigger by Uigesturerecognizer's Requiregesturerecognizertofail: method, define two tap gestures to be triggered by clicking and double clicking, and clicking the event requires double-click Failed to trigger. When the double-click event fails, the Click event is triggered.
The second is to not directly execute the relevant logic when clicked, but use Performselector::: The delay method, the logical execution lag, and then if the double-click event is triggered, in the double-click event, the previous delay execution method is canceled, the cancellation method is NSObject class method, The specific implementation is as follows.

- (void) touchesended: (Nsset<uitouch *> *) touches withevent: (Uievent *) Event {Uitouch *touch = [touches anyObject];NsintegerTapcount = Touch. Tapcount;Switch(Tapcount) { Case 1://Click logical Delay Execution[ SelfPerformselector:@selector(HANDLESINGLETAP) Withobject:NilAfterdelay:0.2]; Break; Case 2://Double-click Logic[ SelfHANDLEDOUBLETAP]; Break;default: Break; }    [[ SelfNextresponder] touchesended:touches withevent:event];} - (void) Handledoubletap {//Cancel the logic of the Click event[NSObjectCancelpreviousperformrequestswithtarget: Self];//Flip the original image of the picture and adapt to the screen status[ SelfTogglestate:YES];}

Scaling processing

Each Sgzoomingimageview image is externally responsible for the incoming, if the width of the screen to adjust the ImageView, so that the picture is equal to the width of the screen, it is adapted to screen display mode, the implementation code is as follows.

-(void) scaletofitanimated: (BOOL) animated {self. State= Sgimageviewstatefit;_animationduration =0.3F;UIImage *image = Self. Innerimageview. Image;CGFloat Imagew = Image. Size. Width;CGFloat Imageh = Image. Size. Height;Cgsize visiblesize = [UIScreen mainscreen]. Bounds. Size;Calculate equal than zoom to picture width equals screen width cgfloat scale = Visiblesize. Width/Imagew;Imagew = Visiblesize. Width;Imageh = Imageh * scale;Adjust the contentsize, calculate the position of the ImageView on the ScrollView, and two calls to use the animation, so save the code block Void (^modifyblock) () = ^{//To fit the display of the screen using block Mode as the scale datum self. Zoomscale=1.0F;Self. Contentsize= Self. Bounds. Size;CGRect frame = Self. Innerimageview. Frame;Frame. Size. Width= Imagew;Frame. Size. Height= Imageh;Frame. Origin. x= (self. Contentsize. Width-Imagew) *0.5F;Frame. Origin. Y= (self. Contentsize. Height-Imageh) *0.5F;Self. Innerimageview. Frame= Frame;};if (animated) {[UIView animatewithduration:_animationduration animations:^{Modifyblock ();}];} else {Modifyblock ();}}

According to the size of the image to display, is the original image mode, the way to implement this mode is to obtain the size of the ImageView, and set the size and contentsize of the image size, the location of the Contentsize center of ScrollView, The implementation code is as follows.

-(void) Scaletooriginsize: (BOOL) animated {self. State= Sgimageviewstateorigin;UIImage *image = Self. Innerimageview. Image;CGFloat Imagew = Image. Size. Width;Zoom ratio cgfloat scale = imagew/self when calculating the original image. Bounds. Size. Width;Update ScrollView The maximum zoom ratio for the original image when the zoom ratio is self. Maximumzoomscale= Scale;void (^modifyblock) () = ^{Self. Zoomscale= Scale;Self. Innerimageview. Center= Cgpointmake (self. Contentsize. Width*0.5F, Self. Contentsize. Height*0.5F;Self. Contentoffset= Cgpointmake (self. Contentsize. Width-Self. Bounds. Size. Width) *0.5F, (self. Contentsize. Height-Self. Bounds. Size. Height) *0.5F;};if (animated) {[UIView animatewithduration:0.3animations:^{Modifyblock ();}];} else {Modifyblock ();}}

The principle of picture switching

The previous section describes the class Sgzoomingimageview to display each picture, and to switch the picture, a paging scrollview is required to accommodate each sgzoomingscrollview, as shown in the structure.

The problem is that there is no space between the two pictures, in order to solve this problem, we let the ScrollView boundwidth is larger than the screen a D spacing, so that each sgzoomingscrollview width increase of 2d, and set the left and right indent each d, You can leave a space of D between each picture, when the picture is not aligned on the screen, but the right deviates from D, so you need to set the X coordinate of the ScrollView to-D to align the screen with the edge of the picture, as follows.

To set the spacing between photos as Photogutt, the code for implementing the interval is as follows.

When you need to pass in the photo browser Object Browser, according to the browser data source to generate multiple pictures on the ScrollView to achieve scrolling, the method in the following code is the setter of browser, it belongs to the original Browse Controller view Sgphotoview ( inherited the Uiscrollview), details are described in the following article, just to illustrate the calculation process with the spacing picture.

- (void) Setbrowser: (Sgphotobrowser *) Browser {_browser = browser;//By using the block callback of the photo browser data source to get the number of photo model data, an introduction to the data source can be found in the previous article.     NsintegerCount = Browser. Numberofphotoshandler();//Get screen size as a benchmark for photo display, there is no horizontal screen fit for the moment    cgsizeVisiblesize = [UIScreen mainscreen]. Bounds. Size;Nsmutablearray*imageviews = @[]. Mutablecopy;//Widen the photo 2d first    CGFloatImageviewwidth = Visiblesize. Width+ Photogutt *2;//page width more than photo width D, extra d is photo interval, outside the screen, when you switch pictures to see_pagew = Imageviewwidth-photogutt;//Calculate ScrollView total width     Self. Contentsize= Cgsizemake (Count * imageviewwidth,0); for(Nsuinteger i =0; I < count;        i++) {Sgzoomingimageview *imageview = [Sgzoomingimageview new]; Sgphotomodel *model = Self. Browser. Photoatindexhandler(i);//According to the thumbnail URL of the data model, the Sg_setimagewithurl: method can handle different URL types, and for file URL loading directly, the network URL is loaded asynchronously after downloading via sdwebimage[ImageView. InnerimageviewSg_setimagewithurl:model. Thumburl];//To identify whether the load is the original, in order to optimize memory, preload thumbnails, so noImageView. Isorigin=NO;//Calculate the position of each picture in ScrollView, when the width of the picture is 2d more than the actual        CGRectframe = (CGRect) {Imageviewwidth * I,0, Imageviewwidth, Visiblesize. Height};//Cgrectinset calculates the rect of the left and right inward indent D and sets it to the pictureImageView. Frame= Cgrectinset (frame, Photogutt,0);        [Imageviews Addobject:imageview]; [ SelfAddsubview:imageview];//default display artwork[ImageView scaletofitanimated:NO]; } Self. Imageviews= Imageviews;}

After this calculation, all the pictures on the left side of D's black edge, which need to offset the scrollview to the left-D coordinates to the black edge on the screen, that is, set X to-D, while adjusting the ScrollView page width of the screen width +2d, the code is as follows.

This code is located in the original controller Sgphotoviewcontroller, to add the original controller view Sgphotoview, and to the left offset-D, the page width of the screen width +2d.

Sgphotoview *photoview = [Sgphotoview new];Self. PhotoView= PhotoView;Self. PhotoView. Controller= Self;[Self. ViewAddsubview:photoview];CGFloatx=-photogutt;CGFloaty=0;CGFloat w = self. View. Bounds. Size. Width+2* Photogutt;CGFloat h = Self. View. Bounds. Size. Height;Self. PhotoView. Frame= CGRectMake (x,y, W, h);

Summarize

This article mainly introduces the implementation details of the picture zoom and the sliding switch picture with the spacing, the next article will focus on the technical details of the slide switch picture, the source of the project can be found in the text, welcome to follow the project.

iOS open source encrypted album agony implementation (VI)