欢迎光临
我们一直在努力

体验更友好的拼图验证控件 TTGPuzzleVerify

建站超值云服务器,限时71元/月

体验更友好的拼图验证控件 TTGPuzzleVerify

项目介绍:

TTGPuzzleVerify

Screenshot

Gif

What 这个是什么?

通过完成图像拼图游戏,TTGPuzzleVerify是一个更加用户友好的验证工具,它是高度可定制和易于使用。 它支持方形,圆形,经典或自定义的拼图形状。 用户可以通过水平,垂直或直接拖动拼图块完成验证。

Features 功能

*用户体验好
*高度可定制
*经典,方形,圆形或自定义拼图的形状
*水平或垂直滑动或直接拖动拼图

Example 示例

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

Requirements 环境要求

iOS 7 and later.

Installation安装方式

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

pod "TTGPuzzleVerify"

Usage

TTGPuzzleVerifyView

Basic use

// Import
#import <TTGPuzzleVerify/TTGPuzzleVerifyView.h>

- (void)viewDidLoad {
    [super viewDidLoad];
    
    // Create TTGPuzzleVerifyView instance
    _puzzleVerifyView = [[TTGPuzzleVerifyView alloc] initWithFrame:CGRectMake(20, 20, 320, 200)];
    [self.view addSubview:_puzzleVerifyView];
    
    // Set image
    _puzzleVerifyView.image = [UIImage imageNamed:@"pic"];
    
    // Set the puzzle blank position
    _puzzleVerifyView.puzzleBlankPosition = CGPointMake(200, 40);
    
    // Set init puzzle position
    _puzzleVerifyView.puzzlePosition = CGPointMake(10, 40);
    
    // Callback
    [_puzzleVerifyView setVerificationChangeBlock:^(TTGPuzzleVerifyView *view, BOOL isVerified) {
        if (isVerified) {
            // User complete the verification
        }
    }];
}

// On slide changed
- (IBAction)onSliderChange:(UISlider *)sender {
    // Update position
    _puzzleVerifyView.puzzleXPercentage = sender.value;
}

API

Puzzle pattern types

/**
 * TTGPuzzleVerifyView pattern type
 */
typedef NS_ENUM(NSInteger, TTGPuzzleVerifyPattern) {
    TTGPuzzleVerifyClassicPattern = 0, // Default
    TTGPuzzleVerifySquarePattern,
    TTGPuzzleVerifyCirclePattern,
    TTGPuzzleVerifyCustomPattern
};

// Puzzle pattern, default is TTGPuzzleVerifyClassicPattern
@property (nonatomic, assign) TTGPuzzleVerifyPattern puzzlePattern;

// Custom path for puzzle shape. Only work when puzzlePattern is TTGPuzzleVerifyCustomPattern
@property (nonatomic, strong) UIBezierPath *customPuzzlePatternPath;

Complete the puzzle with animation

/**
 Complete verification. Call this with set the puzzle to its original position and fill the blank.

 @param withAnimation if show animation
 */
- (void)completeVerificationWithAnimation:(BOOL)withAnimation;

Callback

/**
 * Verification changed callback delegate
 */
@protocol TTGPuzzleVerifyViewDelegate <NSObject>
@optional
- (void)puzzleVerifyView:(TTGPuzzleVerifyView *)puzzleVerifyView didChangedVerification:(BOOL)isVerified;

- (void)puzzleVerifyView:(TTGPuzzleVerifyView *)puzzleVerifyView didChangedPuzzlePosition:(CGPoint)newPosition
             xPercentage:(CGFloat)xPercentage yPercentage:(CGFloat)yPercentage;
@end

// Callback block and delegate
@property (nonatomic, weak) id <TTGPuzzleVerifyViewDelegate> delegate; // Callback delegate
@property (nonatomic, copy) void (^verificationChangeBlock)(TTGPuzzleVerifyView *puzzleVerifyView, BOOL isVerified); // verification changed callback block

Puzzle image

@property (nonatomic, strong) UIImage *image; // Image for verification

Puzzle size and position

// Puzzle rect size,not for TTGPuzzleVerifyCustomPattern pattern
@property (nonatomic, assign) CGSize puzzleSize;

// Puzzle blank position
@property (nonatomic, assign) CGPoint puzzleBlankPosition;

// Puzzle current position
@property (nonatomic, assign) CGPoint puzzlePosition;

// Puzzle current X and Y position percentage, range: [0, 1]
@property (nonatomic, assign) CGFloat puzzleXPercentage;
@property (nonatomic, assign) CGFloat puzzleYPercentage;

Puzzle verification

// Verification
@property (nonatomic, assign) CGFloat verificationTolerance; // Verification tolerance, default is 8
@property (nonatomic, assign, readonly) BOOL isVerified; // Verification boolean

Style

/**
 * Style
 */

// Puzzle blank alpha, default is 0.5
@property (nonatomic, assign) CGFloat puzzleBlankAlpha;

// Puzzle blank inner shadow
@property (nonatomic, strong) UIColor *puzzleBlankInnerShadowColor; // Default: black
@property (nonatomic, assign) CGFloat puzzleBlankInnerShadowRadius; // Default: 4
@property (nonatomic, assign) CGFloat puzzleBlankInnerShadowOpacity; // Default: 0.5
@property (nonatomic, assign) CGSize puzzleBlankInnerShadowOffset; // Default: (0, 0)

// Puzzle shadow
@property (nonatomic, strong) UIColor *puzzleShadowColor; // Default: black
@property (nonatomic, assign) CGFloat puzzleShadowRadius; // Default: 4
@property (nonatomic, assign) CGFloat puzzleShadowOpacity; // Default: 0.5
@property (nonatomic, assign) CGSize puzzleShadowOffset; // Default: (0, 0)

Author

zekunyan, zekunyan@163.com

code4app

赞(0)
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com 特别注意:本站所有转载文章言论不代表本站观点! 本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。未经允许不得转载:IDC资讯中心 » 体验更友好的拼图验证控件 TTGPuzzleVerify
分享到: 更多 (0)