iOS开发UI篇—Quartz2D(六) 图片水印,裁剪圆边框,屏幕截图 图片截屏 图片擦除

一.图片水印,裁剪圆边框

给UIImage添加分类

//
//  UIImage+CZ.h
//  B06.图片水印
//
//  Created by Apple on 15/1/2.
//  Copyright (c) 2015年 itcast. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface UIImage (CZ)

/**
*
*  @param bgImageName    背景图片
*  @param waterImageName 水印图片
*  @param scale 图片生成的比例
*  @return 添加了水印的背景图片
*/
+(UIImage *)waterImageWithBgImageName:(NSString *)bgImageName waterImageName:(NSString *)waterImageName scale:(CGFloat)scale;

/**
*
*  @param imageName    需要裁剪的图片
*  @param borderColor 边框的颜色
*  @param borderWidth 边框的宽度
*  @return 一个裁剪 带有边框的圆形图片
*/
+(UIImage *)circleImageWithImageName:(NSString *)imageName borderColor:(UIColor *)borderColor borderWidth:(CGFloat)borderWidth;

@end

实现方法

//
//  UIImage+CZ.m
//  B06.图片水印
//
//  Created by Apple on 15/1/2.
//  Copyright (c) 2015年 itcast. All rights reserved.
//

#import "UIImage+CZ.h"

@implementation UIImage (CZ)

+(UIImage *)waterImageWithBgImageName:(NSString *)bgImageName waterImageName:(NSString *)waterImageName scale:(CGFloat)scale{
// 生成一张有水印的图片，一定要获取UIImage对象 然后显示在imageView上

//创建一背景图片
UIImage *bgImage = [UIImage imageNamed:bgImageName];
//NSLog(@"bgImage Size: %@",NSStringFromCGSize(bgImage.size));
// 1.创建一个位图【图片】，开启位图上下文
// size:位图大小
// opaque: alpha通道 YES:不透明/ NO透明 使用NO,生成的更清析
// scale 比例 设置0.0为屏幕的比例
// scale 是用于获取生成图片大小 比如位图大小：20X20 / 生成一张图片：（20 *scale X 20 *scale)
//NSLog(@"当前屏幕的比例 %f",[UIScreen mainScreen].scale);
UIGraphicsBeginImageContextWithOptions(bgImage.size, NO, scale);

// 2.画背景图
[bgImage drawInRect:CGRectMake(0, 0, bgImage.size.width, bgImage.size.height)];

// 3.画水印
// 算水印的位置和大小
// 一般会通过一个比例来缩小水印图片
UIImage *waterImage = [UIImage imageNamed:waterImageName];
#warning 水印的比例，根据需求而定
CGFloat waterScale = 0.4;
CGFloat waterW = waterImage.size.width * waterScale;
CGFloat waterH = waterImage.size.height * waterScale;
CGFloat waterX = bgImage.size.width - waterW;
CGFloat waterY = bgImage.size.height - waterH;

[waterImage drawInRect:CGRectMake(waterX, waterY, waterW, waterH)];

// 4.从位图上下文获取 当前编辑的图片
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

// 5.结束当前位置编辑
UIGraphicsEndImageContext();

return newImage;
}

+(UIImage *)circleImageWithImageName:(NSString *)imageName borderColor:(UIColor *)borderColor borderWidth:(CGFloat)borderWidth{

//需求：从位图上下文，裁剪图片[裁剪成圆形，也添加圆形的边框]，生成一张图片

// 获取要裁剪的图片
UIImage *img = [UIImage imageNamed:imageName];
CGRect imgRect = CGRectMake(0, 0, img.size.width, img.size.height);

// 1.开启位图上下文 (开启位图上下文的目的就是为了获得当前位图上下文的图片)
UIGraphicsBeginImageContextWithOptions(img.size, NO, 0.0);

#warning 在自定义的view的drawRect方法里，调用UIGraphicsGetCurrentContext获取的上下文，是图层上下文(Layer Graphics Context)
// 1.1 获取位图上下文
CGContextRef bitmapContext = UIGraphicsGetCurrentContext();

// 2.往位图上下裁剪图片

// 2.1 指定一个圆形的路径，把圆形之外的剪切掉
CGContextAddEllipseInRect(bitmapContext, imgRect);
CGContextClip(bitmapContext);

// 2.2 添加图片
[img drawInRect:imgRect];

// 2.3 添加边框
// 设置边框的宽度
CGContextSetLineWidth(bitmapContext, borderWidth);
// 设置边框的颜色
[borderColor set];
CGContextAddEllipseInRect(bitmapContext, imgRect);
CGContextStrokePath(bitmapContext);

// 3.获取当前位图上下文的图片
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

// 4.结束位图编辑
UIGraphicsEndImageContext();

return newImage;
}

@end

二,屏幕截图

//
// ViewController.m
// A01.图片的裁剪【位图上下文】
//
// Created by apple on 15-1-2.
// Copyright (c) 2015年 apple. All rights reserved.
//

#import "ViewController.h"
#import "UIImage+CZ.h"

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIImageView *imageView;

@end

@implementation ViewController

- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.

}

//屏幕截图
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{

//截取当前vie成为一张图片

// 使用位图上下文
// 1.开启位图上下文
UIGraphicsBeginImageContext(self.view.bounds.size);

// 2.当前控制器的view画在位图上下文
// render 渲染
[self.view.layer renderInContext:UIGraphicsGetCurrentContext()];

// 3.获取图片
UIImage *captureImg = UIGraphicsGetImageFromCurrentImageContext();

// 4.结束位图编辑
UIGraphicsEndImageContext();

// save Image
NSData *imgData = UIImagePNGRepresentation(captureImg);
#warning 平时开发过程，图片保存是沙盒
[imgData writeToFile:@"/Users/apple/Desktop/capture.png" atomically:YES];

}
@end
3.图片截屏

// ViewController.m
// 04-图片截屏
//
// Created by xiaomage on 16/1/23.
// Copyright © 2016年 XU. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIImageView *imageV;

//开始时手指的点
/** <#注释#> */
@property (nonatomic, assign) CGPoint startP;

/** <#注释#> */
@property (nonatomic, weak) UIView *coverV;

@end

@implementation ViewController

/**
* 懒加载coverV
* 1.能够保证超始至终只有一份
* 2.什么时候用到什么时候才去加载
*/
-(UIView *)coverV {

if (_coverV == nil) {

//添加一个UIView
UIView *coverV = [[UIView alloc] init];
coverV.backgroundColor = [UIColor blackColor];
coverV.alpha = 0.7;
_coverV = coverV;
[self.view addSubview:coverV];
}
return _coverV;
}

- (void)viewDidLoad {
[super viewDidLoad];

self.imageV.userInteractionEnabled = YES;
} //添加手势之后调用的方法
- (IBAction)pan:(UIPanGestureRecognizer *)pan {

//判断手势的状态
CGPoint curP = [pan locationInView:self.imageV];
if(pan.state == UIGestureRecognizerStateBegan) {
self.startP = curP;
} else if(pan.state == UIGestureRecognizerStateChanged) {

CGFloat x = self.startP.x;
CGFloat y = self.startP.y;
CGFloat w = curP.x - self.startP.x;
CGFloat h = curP.y - self.startP.y;
CGRect rect = CGRectMake(x, y, w, h);

//添加一个UIView
self.coverV.frame = rect;

} else if (pan.state == UIGestureRecognizerStateEnded) {

//把超过coverV的frame以外的内容裁剪掉
//生成了一张图片,把原来的图片给替换掉.
UIGraphicsBeginImageContextWithOptions(self.imageV.bounds.size, NO, 0);

//把ImageV绘制到上下文之前,设置一个裁剪区域
UIBezierPath *clipPath = [UIBezierPath bezierPathWithRect:self.coverV.frame];
[clipPath addClip];

//把当前的ImageView渲染到上下文当中
CGContextRef ctx = UIGraphicsGetCurrentContext();
[self.imageV.layer renderInContext:ctx];
//.从上下文当中生成 一张图片
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
//关闭上下文
UIGraphicsEndImageContext();

self.imageV.image = newImage;
}
}

- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

@end

4.图片擦除

//  ViewController.m
//  05-图片擦除
//
//  Created by xiaomage on 16/1/23.
//  Copyright © 2016年 XU. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIImageView *imageV;

@end

@implementation ViewController

- (void)viewDidLoad {
[super viewDidLoad];

//添加手势
UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];

[self.imageV addGestureRecognizer:pan];

}

- (void)pan:(UIGestureRecognizer *)pan {

//获取当前手指的点
CGPoint curP =  [pan locationInView:self.imageV];

//确定擦除区域
CGFloat rectWH = 30;
CGFloat x = curP.x - rectWH * 0.5;
CGFloat y = curP.y - rectWH * 0.5;
CGRect rect = CGRectMake(x, y, rectWH, rectWH);

//生成一张带有透明擦除区域的图片

//1.开启图片上下文
UIGraphicsBeginImageContextWithOptions(self.imageV.bounds.size, NO, 0);

//2.把UIImageV内容渲染到当前的上下文当中
CGContextRef ctx = UIGraphicsGetCurrentContext();
[self.imageV.layer renderInContext:ctx];

//3.擦除上下文当中的指定的区域
CGContextClearRect(ctx, rect);

//4.从上下文当中取出图片
UIImage *newImage =  UIGraphicsGetImageFromCurrentImageContext();

//替换之前ImageView的图片
self.imageV.image = newImage;

}

- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

@end