工作快一年来,第一次想写文章,想想还有点小激动。主要是想把自己开发中的一点经历写下来。以供自己查看。也让广大同行参考,指正。
好了,作为码农,话不多说。先来看下生成的效果图:
生成的方法很简单。直接上代码:
/**
根据网络图片,得到群组头像
如果是网络图片,需要先把图片下载好。
@param URLArray 头像地址
@param bgColor 图片填充色
@return 群组头像
*/
+ (UIImage *)groupImageWithURLS:(NSArray<NSString *> *)URLArray backgroundColor:(UIColor *)bgColor imageWidth:(CGFloat)imageWidth{
if (!URLArray) return nil;
NSMutableArray<UIImage *> *imageArray = [NSMutableArray arrayWithCapacity:URLArray.count];
for (NSString *urlStr in URLArray) {
NSData *imageData = [[NSData alloc] initWithContentsOfURL:[NSURL URLWithString:urlStr]];
UIImage *image = [[UIImage alloc] initWithData:imageData];
if (imageData != nil)
[imageArray addObject:image];
}
if (imageArray.count == 1) {
return imageArray.firstObject;
}
return [UIImage groupImageWithImages:imageArray backgroundColor:bgColor imageSize:imageWidth];
}
根据下载好的图片,来绘制图片
/**
根据图片合成群组头像
@param imageArray 图片数组
@param bgColor 填充色
@param imageWidth 图片宽度
@return 群组头像
*/
+ (UIImage *)groupImageWithImages:(NSArray<UIImage *> *)imageArray backgroundColor:(UIColor *)bgColor imageSize:(CGFloat)imageWidth {
if (imageArray == nil) return nil;
if (imageArray.count < 2) return imageArray.firstObject;
UIColor *drawBackgroundColor = bgColor==nil?[UIColor groupTableViewBackgroundColor]:bgColor;
// 计算各个图片的位置
NSArray<NSString *> *rectArray = [UIImage imageRectWithCount:imageArray.count drawSize:imageWidth];
// 布局画布
UIGraphicsBeginImageContextWithOptions(CGSizeMake(imageWidth, imageWidth), NO, [UIScreen mainScreen].scale);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, drawBackgroundColor.CGColor);
CGContextSetStrokeColorWithColor(context, drawBackgroundColor.CGColor);
CGContextSetLineWidth(context, 1.f);
CGContextMoveToPoint(context, 0, 0);
CGContextAddLineToPoint(context, 0, imageWidth);
CGContextAddLineToPoint(context, imageWidth, imageWidth);
CGContextAddLineToPoint(context, imageWidth, 0);
CGContextAddLineToPoint(context, 0, 0);
CGContextClosePath(context);
CGContextDrawPath(context, kCGPathFillStroke);
for (int i = 0; i<imageArray.count; i++) {
UIImage *image = imageArray[i];
CGRect rect = CGRectFromString(rectArray[i]);
[image drawInRect:rect];
}
UIImage *groupIconImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return groupIconImage;
}
这里图片等间距给定8像素,所以图片等宽度需要大一点。
下面是最主要的计算每张图片的位置。
// 根据图片的数量得到每张图片对应的位置
+ (NSArray<NSString *> *)imageRectWithCount:(NSInteger)count drawSize:(CGFloat)size {
NSMutableArray *rectArray = [NSMutableArray arrayWithCapacity:count];
CGFloat drawWidth = size?size:100.f;
CGFloat padding = 8.f; //图片之间的边距
CGFloat imageWidth = 0.f; //图片宽度
NSInteger row = 0; //行
NSInteger column = 0; //列
NSInteger remainder = 0; //余数
// 处理图片宽度
if (count <= 4) {
imageWidth = (drawWidth - padding*3)/2;
row = count/2;
column = 2;
remainder = count%2;
}else{
imageWidth = (drawWidth - padding*4)/3;
row = count/3;
column = 3;
remainder = count%3;
}
CGFloat topMargin = 0.f;
if (remainder > 0) { //有多余行,先布局多出来的一行
CGFloat rowFirstY = (size - ((row + 1)*imageWidth + row*padding))/2;
CGFloat rowFirstX = (size - (remainder*imageWidth + (remainder - 1)*padding))/2;
for (int i = 0; i<remainder; i++) {
CGFloat x = rowFirstX + (imageWidth+padding)*i;
CGFloat y = rowFirstY;
CGRect rect = CGRectMake(x, y, imageWidth, imageWidth);
NSString *imageRectStr = NSStringFromCGRect(rect);
[rectArray addObject:imageRectStr];
}
topMargin = rowFirstY + imageWidth + padding;
}else{ // 没有多余行,顶部边距根据行数正常计算
topMargin = (size - (imageWidth*row + (row-1)*padding))/2;
}
//布局其他正常的位置
for (int i = 0; i<row; i++) {
for (int j = 0; j<column; j++) {
CGFloat x = padding + (imageWidth + padding)*j;
CGFloat y = topMargin + (imageWidth + padding)*i;
CGRect rect = CGRectMake(x, y, imageWidth, imageWidth);
NSString *imageRectStr = NSStringFromCGRect(rect);
[rectArray addObject:imageRectStr];
}
}
return rectArray;
}
到此。你就能和微信一样生成群组头像了。是不是很简单。
第一篇文章是个好的开始。以后有时间,会多写文章的。大家一起加油~~~qwq