一个小demo

如果我们要把图片也实现气泡效果的话,通常我们要写以下代码:

图片的裁剪和添加阴影，其实这并没有什么难度，但是通过实践发现很多实例代码都无法使用。以下代码是OK的

- (UIImage*) maskWithImage:(constUIImage*) maskImage {

constCGColorSpaceRefcolorSpace =CGColorSpaceCreateDeviceRGB();

constCGImageRefmaskImageRef = maskImage.CGImage;

constCGContextRefmainViewContentContext =CGBitmapContextCreate(NULL, maskImage.size.width, maskImage.size.height,8,0, colorSpace,kCGImageAlphaPremultipliedLast);

CGColorSpaceRelease(colorSpace);

if(! mainViewContentContext) {

returnnil;

}

CGFloatratio = maskImage.size.width/self.size.width;

if(ratio *self.size.height< maskImage.size.height) {

ratio = maskImage.size.height/self.size.height;

}

constCGRectmaskRect=CGRectMake(0,0, maskImage.size.width, maskImage.size.height);

constCGRectimageRect=CGRectMake(-((self.size.width* ratio) - maskImage.size.width) /2,

-((self.size.height* ratio) - maskImage.size.height) /2,

self.size.width* ratio,

self.size.height* ratio);

CGContextClipToMask(mainViewContentContext, maskRect, maskImageRef);

CGContextSetShadowWithColor(mainViewContentContext,CGSizeMake(0,0),1, [UIColorblackColor].CGColor);

CGContextDrawImage(mainViewContentContext, imageRect,self.CGImage);

CGImageRefnewImage =CGBitmapContextCreateImage(mainViewContentContext);

CGContextRelease(mainViewContentContext);

UIImage*theImage = [UIImageimageWithCGImage:newImage];

CGImageRelease(newImage);

return theImage;

}

这个方法有一个小问题CGContextSetShadowWithColor(mainViewContentContext,CGSizeMake(0,0),1, [UIColorblackColor].CGColor);设置的阴影还有些问题，阴影总是在某一侧不完整.这样的话还是不太友好.所以下面的代码才是简单又粗暴的解决方案:

- (void)drawRect:(CGRect)rect {

[super drawRect:rect];

// 获取要裁剪的图片

UIImage *tailorImage = [UIImage imageNamed:@"meinv"];

[tailorImage drawInRect:rect];

// 获取气泡图片

UIImage *buddleImage = [UIImage imageNamed:@"ReceiverTextNodeBkg"];

[buddleImage drawInRect:rect blendMode:kCGBlendModeDestinationIn alpha:1.0];

// 添加立体效果

self.layer.shadowOffset = CGSizeMake(1, 1);

self.layer.shadowOpacity = 1.0;

}

效果如下:

我们只需要一张气泡的图片就OK,然后通过这个方法就可以拿到任何图片的气泡形式了!

同时可以设置立体效果和阴影.

简单说一下图形混合模式:

在计算机上的内容是通过颜色来表示的形状是通过透明度来表示的

Color:(R G B)向量 alpha:常量向量的数乘

结果就是:颜色以相乘之前的颜色为主形状以相乘以前的形状为主这就是图形混合模式它是一个跨平台的一种模式

图形混合模式的核心就是: 上D 下S D:目标 S:来源 R:结果 R = Dc * Sa

通过图形混合模式来实现的图片裁剪.就是这么简单粗暴........

以下是blendMode其他的一些设置属性

kCGBlendModeClear, /* R = 0 */

kCGBlendModeCopy, /* R = S */

kCGBlendModeSourceIn, /* R = S*Da */

kCGBlendModeSourceOut, /* R = S*(1 - Da) */

kCGBlendModeSourceAtop, /* R = S*Da + D*(1 - Sa) */

kCGBlendModeDestinationOver, /* R = S*(1 - Da) + D */

kCGBlendModeDestinationIn, /* R = D*Sa */

kCGBlendModeDestinationOut, /* R = D*(1 - Sa) */

kCGBlendModeDestinationAtop, /* R = S*(1 - Da) + D*Sa */

kCGBlendModeXOR, /* R = S*(1 - Da) + D*(1 - Sa) */

kCGBlendModePlusDarker, /* R = MAX(0, (1 - D) + (1 - S)) */

kCGBlendModePlusLighter