（五十）Quartz2D生成图片的一些应用

2023-08-17 17:56:28

应用一：给图片打水印，不应该是画到View的Layer上，而应该画到Bitmap上，产生一张新的图片。

1.首先读入背景图，然后开启一个位图上下文，并将它画在位图上下文上：

    UIImage *bgImage = [UIImage imageNamed:@"scene"];

    /**

     *  创建基于位图的上下文

     *

     *  @param size#>   图片的尺寸 description#>

     *  @param opaque#> 是否不透明 YES为不透明、NO透明 description#>

     *  @param scale#>  伸缩尺寸，写0.0是按默认尺寸 description#>

     *

     *  @return void

     *

     *  执行完毕后就相当于创建了一个新的UIImage，尺寸就是传入的size

     */

    UIGraphicsBeginImageContextWithOptions(bgImage.size, NO, 0.0);

    // 画背景

    [bgImage drawInRect:CGRectMake(0, 0, bgImage.size.width, bgImage.size.height)];

2.接下来计算要打的水印的位置，并且进行尺寸的缩放：

    // 画右下角的水印

    UIImage *waterImage = [UIImage imageNamed:@"logo"];

    CGFloat scale = 0.2;

    CGFloat margin = 5;

    CGFloat waterW = waterImage.size.width * scale;

    CGFloat waterH = waterImage.size.height * scale;

    CGFloat waterX = bgImage.size.width - waterW - margin;

    CGFloat waterY = bgImage.size.height - waterH - margin;

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

3.从上下文中取出画好的图片，然后结束上下文：

    // 从上下文中取得制作完毕的UIImage对象

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    // 结束上下文

    UIGraphicsEndImageContext();

4.保存图片：转为二进制数据（压缩为JPEG或者PNG图片数据，JPEG可以选择压缩质量0-1，PNG默认最好的质量）。

JPEG：第二个参数为质量

UIImageJPEGRepresentation(<#UIImage *image#>, <#CGFloat compressionQuality#>)

PNG：只有一个参数

NSData *data = UIImagePNGRepresentation(newImage);

通过搜索的方式查找Documents文件夹的方法：注意找到的路径是个数组，iOS系统只有一个路径，因此使用lastObject就可以取到。

NSString *path = [[NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES) lastObject] stringByAppendingPathComponent:@"文件名.拓展名"];

应用二：生成圆形头像图片。

先开启位图上下文，然后取得这个上下文（同以前一样）画一个圆，并且开启裁剪（先开启裁剪后面的才会收到裁剪的影响）。

为了产生一个白框，应该先画一个大圆，然后在期内画一个小圆，这时候执行裁剪，因为只有这后面的部分才会执行裁剪，因此就会出现一个大圆和小圆之间的环，一般取为白色。

    // 1.加载原图

    UIImage *oldImage = [UIImage imageNamed:@"me"];

    // 2.开启上下文

    CGFloat borderW = 2; // 圆环的宽度

    CGFloat imageW = oldImage.size.width + 2 * borderW;

    CGFloat imageH = oldImage.size.height + 2 * borderW;

    CGSize imageSize = CGSizeMake(imageW, imageH);

    UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0.0);

    // 3.取得当前的上下文

    CGContextRef ctx = UIGraphicsGetCurrentContext();

    // 4.画边框(大圆)

    [[UIColor whiteColor] set];

    CGFloat bigRadius = imageW * 0.5; // 大圆半径

    CGFloat centerX = bigRadius; // 圆心

    CGFloat centerY = bigRadius;

    CGContextAddArc(ctx, centerX, centerY, bigRadius, 0, M_PI * 2, 0);

    CGContextFillPath(ctx); // 画圆

    // 5.小圆

    CGFloat smallRadius = bigRadius - borderW;

    CGContextAddArc(ctx, centerX, centerY, smallRadius, 0, M_PI * 2, 0);

    // 裁剪(后面画的东西才会受裁剪的影响)

    CGContextClip(ctx);

    // 6.画图

    [oldImage drawInRect:CGRectMake(borderW, borderW, oldImage.size.width, oldImage.size.height)];

    // 7.取图

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    // 8.结束上下文

    UIGraphicsEndImageContext();

    // 9.显示图片

    self.iconView.image = newImage;

    // 10.写出文件

    NSData *data = UIImagePNGRepresentation(newImage);

    NSString *path = [[NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES) lastObject] stringByAppendingPathComponent:@"new.png"];

    [data writeToFile:path atomically:YES];

应用三：屏幕截图

截图的原理：将View的layer渲染到上下文，然后取出图片保存。

一个细节：应该延迟截图，让按钮恢复非点击状态。

作为ImageView的一个功能，将屏幕截图作为分类扩充方法：注意从layer捕捉的方法

#import "UIImage+MJ.h"

@implementation UIImage (MJ)

+ (instancetype)captureWithView:(UIView *)view

{

    // 1.开启上下文

    UIGraphicsBeginImageContextWithOptions(view.frame.size, NO, 0.0);

    // 2.将控制器view的layer渲染到上下文

    [view.layer renderInContext:UIGraphicsGetCurrentContext()];

    // 3.取出图片

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    // 4.结束上下文

    UIGraphicsEndImageContext();

    return newImage;

}

@end

如果要存入系统相册，应该调用UIImageWriteToSavedPhotoAlbum方法，注意回调函数应该用官方建议的方法：

UIImageWriteToSavedPhotosAlbum(img, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);

回调函数的写法：

- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo

{

    if (error) { // 保存失败

        [MBProgressHUD showError:@"保存失败"];

    } else { // 保存成功

        [MBProgressHUD showSuccess:@"保存成功"];

    }

}

应用四：背景平铺。

使用Quartz2D可以将一个小图片完全平铺到背景：注意到colorWithPatternImage可以设置背景图。

    UIImage *oldImage = [UIImage imageNamed:@"me"];

    UIGraphicsBeginImageContextWithOptions(self.view.frame.size, NO, 0.0);

    [oldImage drawInRect:self.view.bounds];

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    self.view.backgroundColor = [UIColor colorWithPatternImage:newImage];

总结：

1.因为只有drawRect:方法中才能取出上下文，因此应该在这里绘图。

2.View内部有一个layer层，drawRect:方法获取的是view的layer，view显示全靠layer，view还有一个响应事件的作用。

3.产生图片的方法：

先开启图形上下文

UIGraphicsBeginImageContextWithOptions...

然后可以在需要绘图时按原来的方法获取上下文

然后取图：UIImage *newImage =UIGraphicsGetImageFromCurrentImageContext();

最后不要忘了结束上下文：UIGraphicsEndImageContext();

码农公寓

相关文章