天天看点

iOS 放大镜效果

生活中能够遇到很多应用有放大镜效果,那我们如何完成呢?

效果展示

iOS 放大镜效果
iOS 放大镜效果

* 别急,多说无益,上代码!*

首先我们要做的是建一个继承于UIWindow的类

我把它冠以我的名字缩写

WYHMagnifierView.h

/**************
 *            *
 * 放大镜视图类 *
 *            *
 *************/


#import <UIKit/UIKit.h>

@interface WYHMagnifierView : UIWindow

//放大框
@property(nonatomic,strong)UIView * magnifyView;

//触摸点
@property(nonatomic)CGPoint pointTomagnify;

@end
           

WYHMagnifierView.m

#import "WYHMagnifierView.h"

@interface WYHMagnifierView ()

@property (nonatomic, strong) CALayer *contentLayer;

@end



@implementation WYHMagnifierView


-(instancetype)init
{
    self = [super init];

    if (self) {

        self.frame = CGRectMake(0, 0, 100, 50);

        self.backgroundColor = [UIColor clearColor];

        self.layer.borderWidth = 1;

        self.layer.borderColor = [UIColor   lightGrayColor].CGColor;

        self.layer.cornerRadius = 5;

        self.layer.masksToBounds = YES;

        self.windowLevel = UIWindowLevelAlert;

        self.contentLayer = [CALayer layer];

        self.contentLayer.frame = self.bounds;

        self.contentLayer.delegate = self;

        self.contentLayer.contentsScale = [[UIScreen mainScreen] scale];

        [self.layer addSublayer:self.contentLayer];

    }


    return self;
}


#pragma mark set the point of magnifier
-(void)setPointTomagnify:(CGPoint)pointTomagnify
{
    _pointTomagnify = pointTomagnify;

    CGPoint center = CGPointMake(pointTomagnify.x, self.center.y);

    if (pointTomagnify.y > CGRectGetHeight(self.bounds) * 0.5) {

        center.y = pointTomagnify.y - CGRectGetHeight(self.bounds)/2;
    }

    self.center = center;

    [self.contentLayer setNeedsDisplay];
}

#pragma mark  invoke  by setNeedDisplay
-(void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx
{

    float width = CGRectGetWidth(self.frame);

    float height = CGRectGetHeight(self.frame);

    //宽高
    CGContextTranslateCTM(ctx,width * 0.5, height * 0.5);

    //缩放比例
    CGContextScaleCTM(ctx, 1.5, 1.5);

    //x y 坐标转换
    CGContextTranslateCTM(ctx, -self.pointTomagnify.x , -self.pointTomagnify.y - 20);

    //截屏并显示
    [self.magnifyView.layer renderInContext:ctx];

}
@end
           

ViewController.h

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController


@end
           

在ViewController的Storyboard上拉一个UILabel控件,

我写的text是王颜华————一个喜欢Photoshop的程序媛,backgroundColor设置的粉色,哈哈哈!

然后关联到下面的demoLabel属性。

ViewController.m

#import "ViewController.h"
#import "WYHMagnifierView.h"

@interface ViewController ()

@property (weak, nonatomic) IBOutlet UILabel *demoLabel;

//放大镜
@property (strong, nonatomic) CXYMagnifierView *magnifierView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];


    UILongPressGestureRecognizer * pressGesTure = [[UILongPressGestureRecognizer alloc]initWithTarget:self action:@selector(magniFierAction:)];


    self.demoLabel.userInteractionEnabled = YES;

    [self.demoLabel addGestureRecognizer:pressGesTure];



}

- (void)magniFierAction:(UILongPressGestureRecognizer *)gesture
{

    NSLog(@"长按手势");

    //获取手势位置

    CGPoint point = [gesture locationInView:self.view];

    switch (gesture.state) {
        case UIGestureRecognizerStateBegan:
        {

            //设置放大镜位置

            [self magnifierPosition:point];

            //显示放大镜
            [self.magnifierView makeKeyAndVisible];


            break;
        }
            case UIGestureRecognizerStateChanged:
        {

            //设置放大镜位置

            [self magnifierPosition:point];



            break;
        }
            case UIGestureRecognizerStateEnded:
        {
            //长按结束取消放大镜

            self.magnifierView.hidden  =  YES;





            break;
        }
        default:
            break;
    }



}



-(void)magnifierPosition:(CGPoint )position
{
    CGPoint  point = position;

    point.y -= 25;

    position  =  point;

    self.magnifierView.pointTomagnify = point;


}


#pragma mark lazy laod
-(CXYMagnifierView *)magnifierView
{
    if (! _magnifierView) {

        _magnifierView = [[CXYMagnifierView alloc]init];

        _magnifierView.magnifyView = self.view.window;
    }


    return _magnifierView;
}



- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];

}

@end
           

好了 快拿起代码运行一波儿看看效果吧~

注意我写的是 长按 手势哦~ 长按出效果~

iOS