JPImageresizerView Specification

2019-02-16  本文已影响39人  健了个平_24

GitHub:https://github.com/Rogue24/JPImageresizerView

JPImageresizerView


Brief introduction

A small tool that mimics the clipping function in Wechat.

Current functions:
    1.Zooming of area that can be tailored adaptively;
    2.The parameters are set with high degrees of freedom, include spacing of clipping area, cutting aspect ratio, whether to scale adaptively;
    3.Supports up to eight drag and drop direction;
    4.Support rotation;
    5.Support horizontal and vertical mirror flip;
    6.Two border styles;
    7.Custom mask color, or two Gaussian blurred masks.

Note:
    1.Because automatic layout is not conducive to gesture control, frame layout is currently used, and automatic layout is not supported for the time being;
    2.At present, only vertical screen operation is supported.
    
Subsequent updates:
    1.Swift version;
    2.Adapt horizontal and vertical screen switching;
    3.More new border and mask styles;
    4.More parameter setting;
    5.To achieve the effect of free dragging rotation direction.
Effect.gif

How to use

Initialization

// Method 1: Configuring parameters using factory method
// Settable parameters: clipping picture, frame, mask style, border style, animation curve, clipping line color, background color, transparency of the mask, vertical and horizontal spacing, width-height ratio of the clipping frame, whether the clipping frame border can be dragged, whether the clipping area can be reset, whether ready to zoom back.

JPImageresizerView *imageresizerView = [[JPImageresizerView alloc]
                        initWithResizeImage:[UIImage imageNamed:@"Girl.jpg"]
                        frame:frame
                        maskType:JPConciseFrameType
                        frameType:JPConciseFrameType
                        animationCurve:JPAnimationCurveLinear
                        strokeColor:[UIColor whiteColor]
                        bgColor:[UIColor blackColor]
                        maskAlpha:0.75
                        verBaseMargin:10
                        horBaseMargin:10
                        resizeWHScale:0
                        contentInsets:UIEdgeInsetsZero
                        imageresizerIsCanRecovery:^(BOOL isCanRecovery) {
                            // You can listen here to see if you can reset it.
                            // If you don't need to reset (isCanRecovery is NO), you can do the corresponding processing here, such as setting the reset button to be non-point or hidden
                            // Specific operation can refer to Demo
                            // Pay attention to circular references
                        }
                        imageresizerIsPrepareToScale:^(BOOL isPrepareToScale) {
                            // Here you can monitor whether the clipping area is ready to be scaled to the appropriate size.
                            // If isPrepareToScale is YES, the clipping, rotation, and mirroring functions are not available at this time, the corresponding processing can be done here, such as setting the corresponding button to be non-point or hidden.
                            // Specific operation can refer to Demo
                            // Pay attention to circular references
                        }];

// Method 2: Use JPImageresizerConfigure to configure parameters and create them again

JPImageresizerConfigure *configure = [JPImageresizerConfigure defaultConfigureWithResizeImage:image make:^(JPImageresizerConfigure *configure) {
    // Now that you have the default parameter values, you can set the parameters you want here (using chain programming)
    configure.jp_resizeImage([UIImage imageNamed:@"Kobe.jpg"]).
    jp_maskAlpha(0.5).
    jp_strokeColor([UIColor yellowColor]).
    jp_frameType(JPClassicFrameType).
    jp_contentInsets(contentInsets).
    jp_bgColor([UIColor orangeColor]).
    jp_isClockwiseRotation(YES).
    jp_animationCurve(JPAnimationCurveEaseOut);
}];

JPImageresizerView *imageresizerView = [JPImageresizerView imageresizerViewWithConfigure:self.configure imageresizerIsCanRecovery:^(BOOL isCanRecovery) {
    // You can listen here to see if you can reset it.
    // If you don't need to reset (isCanRecovery is NO), you can do the corresponding processing here, such as setting the reset button to be non-point or hidden
    // Specific operation can refer to Demo
    // Pay attention to circular references
} imageresizerIsPrepareToScale:^(BOOL isPrepareToScale) {
    // Here you can monitor whether the clipping area is ready to be scaled to the appropriate size.
    // If isPrepareToScale is YES, the clipping, rotation, and mirroring functions are not available at this time, the corresponding processing can be done here, such as setting the corresponding button to be non-point or hidden.
    // Specific operation can refer to Demo
    // Pay attention to circular references
}];

// Add to view
[self.view addSubview:imageresizerView];
self.imageresizerView = imageresizerView;

// Note: For systems under iOS 11, it is best for the controller to set automaticallyAdjustsScrollViewInsets to NO, otherwise it will be offset with the change of navigation bar or status bar.
if (@available(iOS 11.0, *)) {

} else {
    self.automaticallyAdjustsScrollViewInsets = NO;
}

// After creation, you can also modify some of the above parameters (except maskType and contentInsets)
self.imageresizerView.resizeImage = [UIImage imageNamed:@"Kobe.jpg"];
self.imageresizerView.resizeWHScale = 16.0 / 9.0;

Change border style

Concise Classic
// Only two border styles are available, concise style(JPConciseFrameType) and classic style(JPClassicFrameTypeCurrently).
// You can modify the border style by initializing or directly setting frameType properties
self.imageresizerView.frameType = JPClassicFrameType;

Mirror reversal

Effect.gif
// Vertical Mirror, YES -> Rotates 180 degrees along Y axis, NO -> Reduction
BOOL isVerticalityMirror = !self.imageresizerView.verticalityMirror;
[self.imageresizerView setVerticalityMirror:isVerticalityMirror animated:YES];

// Horizontal Mirror, YES -> Rotates 180 Degrees along X-axis, NO -> Reduction
BOOL isHorizontalMirror = !self.imageresizerView.horizontalMirror;
[self.imageresizerView setHorizontalMirror:isHorizontalMirror animated:YES];

Rotate

// Default counterclockwise rotation, rotation angle is 90 degrees
[self.imageresizerView rotation];

// Set the isClockwiseRotation property to YES if clockwise rotation is required
self.imageresizerView.isClockwiseRotation = YES;

Reset

// Reset to the initial state, vertically upward
[self.imageresizerView recovery];

Tailoring

// The clipping process is executed in the sub-thread, and the callback is cut back to the main thread for execution.
// If it is a HD image, HUD prompt can be added before calling.
// referenceWidth: The reference width of the clipped image, for example, is set to 375. If the clipping area is half the width of the image, the width of the clipped image is 187.5, and the height is determined by the aspect ratio. The maximum and minimum width of the clipped image does not exceed the width of the original image and the imageView.

// 1.The default is to clip with the width of the imageView as the reference width
[self.imageresizerView imageresizerWithComplete:^(UIImage *resizeImage) {
    // When the clipping is completed, resizeImage is the clipped image.
    // Pay attention to circular references
}];

// 2.Customize the reference width for clipping (e.g. by screen width)
[self.imageresizerView imageresizerWithComplete:^(UIImage *resizeImage) {
    // When the clipping is completed, resizeImage is the clipped image.
    // Pay attention to circular references
} referenceWidth:[UIScreen mainScreen].bounds.size.width];

// 3.Cutting with original size
[self.imageresizerView originImageresizerWithComplete:^(UIImage *resizeImage) {
    // When the clipping is completed, resizeImage is the clipped image.
    // Pay attention to circular references
}];

Other

// Lock the clipping area. After locking, the clipping area cannot be dragged. NO unlocks the clipping area.
self.imageresizerView.isLockResizeFrame = YES;

// Whether to Adapt the Cutting Area Size when Rotating to Horizontal Direction
// When the width of the picture is smaller than the height of the picture, this property defaults to YES and can be manually set to NO.
self.imageresizerView.isAutoScale = NO;

Install

JPImageresizerView can be installed by CocoaPods, just add the following line to your podfile:

pod 'JPImageresizerView'

Feedback address

E-mail: zhoujianping24@hotmail.com
Blog: https://www.jianshu.com/u/2edfbadd451c
上一篇下一篇

猜你喜欢

热点阅读