1.简介
项目中有微信分享的相关内容,要求分享长截图到微信,要求截取 tableView 的全部内容并且底部加上二维码。做的过程中有一些问题,做下记录。
2.步骤
1.截取 tableView 的内容,并且生成一张图片
2.生成底部的分享二维码的图片
3.对这些图片进行拼接
4.分享
3.过程中遇到的一些问题
1.如何生成 tableView 的长截图
TYSnapshotScroll,前人已经为你准备好了工具,直接使用即可
如何自己绘制这张长截图
我们可以使用 Quartz2D 提供的相关 API进行绘制。下文中的 self
指代的是 tableView
1.创建上下文,设置这个 bitmap 的size 、opaque和scale。
注:(scale 建议设置为[UIScreen mainScreen].scale
),如果scale
设置的不对,那么你最后得到的图片就会很模糊。
UIGraphicsBeginImageContextWithOptions(self.bounds.size,NO,[UIScreen mainScreen].scale);
2.将 layer 渲染到当前的上下文中
[self.layer renderInContext: UIGraphicsGetCurrentContext()];
3.从上下文获取制作好的图片,这就是你需要的
snapshotImage = UIGraphicsGetImageFromCurrentImageContext();
4.关闭这个上下文
UIGraphicsEndImageContext();
2.我们的二维码是UI给的图,我们需要做的就是将这两个 image 合成为一张
如何合成
直接使用TYSnapshotScroll,有个 UIImage 的扩展方法,可以直接使用图片集合将好几张图合成为一张。(这里有个坑,就是两张 image 可以合成,但是他们都会保持自己的大小,你可能会发现你的截屏图片的宽度==屏幕宽度,但是 UI 给的二维码图 != 屏幕宽度)
徒手绘制
思路
1.创建一个 size ,计算两个图片的总长度
2.创建一个用来绘制的上下文
3.绘制这两张图片到上下文
4.拿出合成后的图片
5.关闭上下文
CGSize contentSize = CGSizeMake(snapshotImage.size.width, snapshotImage.size.height + 80);
UIGraphicsBeginImageContextWithOptions(contentSize, NO, [UIScreen mainScreen].scale);
[snapshotImage drawInRect:CGRectMake(0, 0, snapshotImage.size.width, snapshotImage.size.height)];
[footerImage drawInRect:CGRectMake(0,snapshotImage.size.height, snapshotImage.size.width, 80)];
UIImage *resultingImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
如何在 debug 的时候查看绘制好的这个图片
4.微信分享
- (void)WXShareImageWithSence:(BOOL)isSession{
WXMediaMessage *message = [WXMediaMessage message];
WXImageObject *ext = [WXImageObject object];
//图片
NSData *imageData = UIImagePNGRepresentation(self.shareImage);
//缩略图
UIImage *tubmbImage = [self compressImage:self.shareImage toByte:31 *1024];
ext.imageData = imageData;
// 缩略图 小于32KB
message.mediaObject = ext;
[message setThumbImage:tubmbImage];
SendMessageToWXReq *req = [[SendMessageToWXReq alloc] init];
req.bText = NO;
req.scene = isSession ? WXSceneSession : WXSceneTimeline;
req.message = message;
[WXApi sendReq:req];
}