iOS 多种截屏功能代码[UIKit and opengles]

在以前的ios项目中都是用的下面的方式截屏：

CGSize imageSize = [[UIScreen mainScreen] bounds].size;

if (NULL != UIGraphicsBeginImageContextWithOptions) {

UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0);

}

else

{

UIGraphicsBeginImageContext(imageSize);

}

[[self.view layer] renderInContext:UIGraphicsGetCurrentContext()];

UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

最近在做一个项目，有lbs内容，用到了百度地图。

需要对当前坐标位置做标志，然后分享截图，同样使用上面的方式，碰到问题。

然后使用以下苹果开发文档写的截屏方式，也始终不行，

只能得到地区上自定义的一个位置tip图片，后面的地图内容都是白色的。

苹果文档的内容：http://developer.apple.com/library/ios/#qa/qa1703/_index.html

Screen Capture in UIKit Applications

Q: How do I take a screenshot in my UIKit application?

- (UIImage*)screenshot

{

// Create a graphics context with the target size

// On iOS 4 and later, use UIGraphicsBeginImageContextWithOptions to take the scale into consideration

// On iOS prior to 4, fall back to use UIGraphicsBeginImageContext

CGSize imageSize = [[UIScreen mainScreen] bounds].size;

if (NULL != UIGraphicsBeginImageContextWithOptions)

UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0);

else

UIGraphicsBeginImageContext(imageSize);

CGContextRef context = UIGraphicsGetCurrentContext();

// Iterate over every window from back to front

for (UIWindow *window in [[UIApplication sharedApplication] windows])

{

if (![window respondsToSelector:@selector(screen)] || [window screen] == [UIScreen mainScreen])

{

// -renderInContext: renders in the coordinate space of the layer,

// so we must first apply the layer's geometry to the graphics context

CGContextSaveGState(context);

// Center the context around the window's anchor point

CGContextTranslateCTM(context, [window center].x, [window center].y);

// Apply the window's transform about the anchor point

CGContextConcatCTM(context, [window transform]);

// Offset by the portion of the bounds left of and above the anchor point

CGContextTranslateCTM(context,

-[window bounds].size.width * [[window layer] anchorPoint].x,

-[window bounds].size.height * [[window layer] anchorPoint].y);

// Render the layer hierarchy to the current context

[[window layer] renderInContext:context];

// Restore the context

CGContextRestoreGState(context);

}

}

// Retrieve the screenshot image

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return image;

}

仔细想了下，百度地图不是用UIKit实现的，所以用上面的方式截图行不通。

从说明文档中，链接到OpenGL ES View Snapshot，找到了问题解决方法。

苹果文档的内容：http://developer.apple.com/library/ios/#qa/qa1704/_index.html

OpenGL ES View Snapshot

Q: How do I take a snapshot of my OpenGL ES view and save the result in a UIImage?

// IMPORTANT: Call this method after you draw and before -presentRenderbuffer:.

- (UIImage*)snapshot:(UIView*)eaglview

{

GLint backingWidth, backingHeight;

// Bind the color renderbuffer used to render the OpenGL ES view

// If your application only creates a single color renderbuffer which is already bound at this point,

// this call is redundant, but it is needed if you're dealing with multiple renderbuffers.

// Note, replace "_colorRenderbuffer" with the actual name of the renderbuffer object defined in your class.

glBindRenderbufferOES(GL_RENDERBUFFER_OES, _colorRenderbuffer);

// Get the size of the backing CAEAGLLayer

glGetRenderbufferParameterivOES(GL_RENDERBUFFER_OES, GL_RENDERBUFFER_WIDTH_OES, &backingWidth);

glGetRenderbufferParameterivOES(GL_RENDERBUFFER_OES, GL_RENDERBUFFER_HEIGHT_OES, &backingHeight);

NSInteger x = 0, y = 0, width = backingWidth, height = backingHeight;

NSInteger dataLength = width * height * 4;

GLubyte *data = (GLubyte*)malloc(dataLength * sizeof(GLubyte));

// Read pixel data from the framebuffer

glPixelStorei(GL_PACK_ALIGNMENT, 4);

glReadPixels(x, y, width, height, GL_RGBA, GL_UNSIGNED_BYTE, data);

// Create a CGImage with the pixel data

// If your OpenGL ES content is opaque, use kCGImageAlphaNoneSkipLast to ignore the alpha channel

// otherwise, use kCGImageAlphaPremultipliedLast

CGDataProviderRef ref = CGDataProviderCreateWithData(NULL, data, dataLength, NULL);

CGColorSpaceRef colorspace = CGColorSpaceCreateDeviceRGB();

CGImageRef iref = CGImageCreate(width, height, 8, 32, width * 4, colorspace, kCGBitmapByteOrder32Big | kCGImageAlphaPremultipliedLast,

ref, NULL, true, kCGRenderingIntentDefault);

// OpenGL ES measures data in PIXELS

// Create a graphics context with the target size measured in POINTS

NSInteger widthInPoints, heightInPoints;

if (NULL != UIGraphicsBeginImageContextWithOptions) {

// On iOS 4 and later, use UIGraphicsBeginImageContextWithOptions to take the scale into consideration

// Set the scale parameter to your OpenGL ES view's contentScaleFactor

// so that you get a high-resolution snapshot when its value is greater than 1.0

CGFloat scale = eaglview.contentScaleFactor;

widthInPoints = width / scale;

heightInPoints = height / scale;

UIGraphicsBeginImageContextWithOptions(CGSizeMake(widthInPoints, heightInPoints), NO, scale);

}

else {

// On iOS prior to 4, fall back to use UIGraphicsBeginImageContext

widthInPoints = width;

heightInPoints = height;

UIGraphicsBeginImageContext(CGSizeMake(widthInPoints, heightInPoints));

}

CGContextRef cgcontext = UIGraphicsGetCurrentContext();

// UIKit coordinate system is upside down to GL/Quartz coordinate system

// Flip the CGImage by rendering it to the flipped bitmap context

// The size of the destination area is measured in POINTS

CGContextSetBlendMode(cgcontext, kCGBlendModeCopy);

CGContextDrawImage(cgcontext, CGRectMake(0.0, 0.0, widthInPoints, heightInPoints), iref);

// Retrieve the UIImage from the current context

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

// Clean up

free(data);

CFRelease(ref);

CFRelease(colorspace);

CGImageRelease(iref);

return image;

}

上面的代码中存在一些定义，我直接跳过，使用了网上别人整理的一段代码，呵呵。

使用opengles截图如下：

-(UIImage *) glToUIImage {

NSInteger myDataLength = 1024 * 768 * 4; //1024-width，768-height

// allocate array and read pixels into it.

GLubyte *buffer = (GLubyte *) malloc(myDataLength);

glReadPixels(0, 0, 1024, 768, GL_RGBA, GL_UNSIGNED_BYTE, buffer);

// gl renders "upside down" so swap top to bottom into new array.

// there's gotta be a better way, but this works.

GLubyte *buffer2 = (GLubyte *) malloc(myDataLength);

for(int y = 0; y <768; y++)

{

for(int x = 0; x <1024 * 4; x++)

{

buffer2[(767 - y) * 1024 * 4 + x] = buffer[y * 4 * 1024 + x];

}

}

// make data provider with data.

CGDataProviderRef provider = CGDataProviderCreateWithData(NULL, buffer2, myDataLength, NULL);

// prep the ingredients

int bitsPerComponent = 8;

int bitsPerPixel = 32;

int bytesPerRow = 4 * 1024;

CGColorSpaceRef colorSpaceRef = CGColorSpaceCreateDeviceRGB();

CGBitmapInfo bitmapInfo = kCGBitmapByteOrderDefault;

CGColorRenderingIntent renderingIntent = kCGRenderingIntentDefault;

// make the cgimage

CGImageRef imageRef = CGImageCreate(1024, 768, bitsPerComponent, bitsPerPixel, bytesPerRow, colorSpaceRef, bitmapInfo, provider, NULL, NO, renderingIntent);

// then make the uiimage from that

UIImage *myImage = [UIImage imageWithCGImage:imageRef];

return myImage;

}

通过上面的代码终于是截屏能够得到百度地图的内容了。不过还有个小问题，就是opengles截图不能得到UIKit的图片内容。

所以我又做了个小处理，就是截屏得到图片后，对两张图片做合成叠加处理。

//合并图片

-(UIImage *)mergerImage:(UIImage *)firstImage secodImage:(UIImage *)secondImage{

CGSize imageSize = CGSizeMake(620, 380);

UIGraphicsBeginImageContext(imageSize);

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

[secondImage drawInRect:CGRectMake(310 - 40, 190 - 60, secondImage.size.width, secondImage.size.height)];

UIImage *resultImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

return resultImage;

}

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－华丽丽的分割线－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

单独的UIKit截屏和单独的OpenGL ES截屏相信大家一看就弄好了，但是合并图片的代码个人整理了一下，代码如下：

-(UIImage *) glToUIImage {
NSInteger myDataLength = 1024 * 768 * 4;

// allocate array and read pixels into it.
GLubyte *buffer = (GLubyte *) malloc(myDataLength);
glReadPixels(0, 0, 1024, 768, GL_RGBA, GL_UNSIGNED_BYTE, buffer);

// gl renders "upside down" so swap top to bottom into new array.
// there's gotta be a better way, but this works.
GLubyte *buffer2 = (GLubyte *) malloc(myDataLength);
for(int y = 0; y <768; y++)
{
for(int x = 0; x <1024 * 4; x++)
{
buffer2[(767 - y) * 1024 * 4 + x] = buffer[y * 4 * 1024 + x];
}
}

// make data provider with data.
CGDataProviderRef provider = CGDataProviderCreateWithData(NULL, buffer2, myDataLength, NULL);

// prep the ingredients
int bitsPerComponent = 8;
int bitsPerPixel = 32;
int bytesPerRow = 4 * 1024;
CGColorSpaceRef colorSpaceRef = CGColorSpaceCreateDeviceRGB();
CGBitmapInfo bitmapInfo = kCGBitmapByteOrderDefault;
CGColorRenderingIntent renderingIntent = kCGRenderingIntentDefault;

// make the cgimage
CGImageRef imageRef = CGImageCreate(1024, 768, bitsPerComponent, bitsPerPixel, bytesPerRow, colorSpaceRef, bitmapInfo, provider, NULL, NO, renderingIntent);

// then make the uiimage from that
UIImage *myImage = [UIImage imageWithCGImage:imageRef];
return myImage;
}

-(void)handleButtonAction:(id)sender{
CGSize imageSize = [[UIScreen mainScreen] bounds].size;
if (NULL != UIGraphicsBeginImageContextWithOptions) {
UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0);
}
else
{
UIGraphicsBeginImageContext(imageSize);
}

CGContextRef context = UIGraphicsGetCurrentContext();

for (UIWindow * window in [[UIApplication sharedApplication] windows]) {
if (![window respondsToSelector:@selector(screen)] || [window screen] == [UIScreen mainScreen]) {
CGContextSaveGState(context);
CGContextTranslateCTM(context, [window center].x, [window center].y);
CGContextConcatCTM(context, [window transform]);
CGContextTranslateCTM(context, -[window bounds].size.width*[[window layer] anchorPoint].x, -[window bounds].size.height*[[window layer] anchorPoint].y);
[[window layer] renderInContext:context];

CGContextRestoreGState(context);
}
}

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

UIImage *resultImage = [self mergerImage:[self glToUIImage] secodImage:image];
UIImageWriteToSavedPhotosAlbum(resultImage, self, nil, nil);

NSLog(@"UIKit & OpenGL ES Suceeded!");

}

-(UIImage *)mergerImage:(UIImage *)firstImage secodImage:(UIImage *)secondImage{

CGSize imageSize = CGSizeMake(620, 380);
UIGraphicsBeginImageContext(imageSize);

[firstImage drawInRect:CGRectMake(0, 0, firstImage.size.width, firstImage.size.height)];
[secondImage drawInRect:CGRectMake(310 - 40, 190 - 60, secondImage.size.width, secondImage.size.height)];

UIImage *resultImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

return resultImage;
}

最后将整合后的图片存到相册中，好了，就到这里了，继续撸码去！