另外一種方式來生成群聊圖片:
注意的點:
- 因為圖片是一張張從網絡下載而來的,所以,我們事先不知道那張圖片會先下載下來,所以,圖片的覆蓋方式可能不是我們想要的,這時候怎么辦?可以設置一個變量記錄是否都下載完,然后在調整位置。
- view自身的tag是0,上面的子view的tag不能設置為0,至少從1開始。
- 重構代碼很重要,事實上,這份代碼已經重構了2輪了,也許還能重構。
- ValueChangeDelete 方便我們用同一套代碼測試兩種方式生成群聊圖片的性能,耗時。
//
// CircleImage.swift
//
// Created by brzhang on 16/2/25.
// Copyright ? 2016年 brzhang. All rights reserved.
//
import UIKit
class GroupCirCleImage: UIView {
var borderWidth: CGFloat = 1.5
var borderColor = UIColor.greenColor()
var imageWidth: CGFloat
var imageHeight: CGFloat
var imageUrls : [String]?
var ctx: CGContextRef?
var imageCoverPx: CGFloat = 10
lazy var sdManger = SDWebImageManager.sharedManager()
var frames: [String: CGRect] = [String: CGRect]()
var countFlag = 0
init(width: CGFloat, height: CGFloat, imageUrls: [String]?) {
imageWidth = width / 2
imageHeight = width / 2
self.imageUrls = imageUrls
super.init(frame: CGRectMake(0, 0, width, height))
drawImages()
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func drawRect(rect: CGRect) {
// Drawing code
super.drawRect(rect)
}
func initFrames() {
frames["topLeft"] = CGRectMake(0, 0, imageWidth + imageCoverPx, imageCoverPx + imageHeight)
frames["topRight"] = CGRectMake(imageWidth - imageCoverPx, 0, imageWidth + imageCoverPx, imageCoverPx + imageHeight)
frames["bottomLeft"] = CGRectMake(0, imageHeight - imageCoverPx, imageWidth + imageCoverPx, imageCoverPx + imageHeight)
frames["bottomRight"] = CGRectMake(imageWidth - imageCoverPx, imageHeight - imageCoverPx, imageWidth + imageCoverPx, imageCoverPx + imageHeight)
frames["topCenter"] = CGRectMake(self.center.x - (imageWidth + imageCoverPx) / 2, 0, imageWidth + imageCoverPx, imageCoverPx + imageHeight)
}
func init_context(size: CGSize) -> CGContextRef? {
UIGraphicsBeginImageContext(size);
let ctx = UIGraphicsGetCurrentContext()
// 設置筆觸顏色
CGContextSetStrokeColorWithColor(ctx, borderColor.CGColor)
// 設置筆觸寬度
CGContextSetLineWidth(ctx, borderWidth)
// 設置填充色
CGContextSetFillColorWithColor(ctx, UIColor.purpleColor().CGColor)
CGContextSetLineJoin(ctx, .Round)
CGContextSetLineCap(ctx, .Round)
return ctx
}
func drawImages() {
initFrames()
guard imageUrls != nil && imageUrls?.count > 0 else {
return
}
let count = imageUrls!.count
switch count {
case 1:
// 畫圖
getImageFromNet(imageUrls![0], completion: { [unowned self](result) -> Void in
guard let image = result as? UIImage else {
return
}
let ctx = self.init_context(self.frame.size)
let borderRect = CGRectMake(self.borderWidth / 2, self.borderWidth / 2, self.imageWidth * 2 - self.borderWidth, self.imageHeight * 2 - self.borderWidth)
CGContextAddEllipseInRect(ctx, borderRect)
CGContextStrokePath(ctx)
let rect = CGRectMake(self.borderWidth, self.borderWidth, self.imageWidth * 2 - self.borderWidth * 2, self.imageHeight * 2 - self.borderWidth * 2)
CGContextAddEllipseInRect(ctx, rect);
// 裁剪(按照當前的路徑形狀裁剪)
CGContextClip(ctx)
image.drawInRect(rect)
let newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
self.addSubview(UIImageView.init(image: newImage))
})
case 2:
countFlag = 2
getImageFromNet(imageUrls![0], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["topLeft"], layerPosition: 2 - 0)
})
getImageFromNet(imageUrls![1], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["bottomRight"], layerPosition: 2 - 1)
})
case 3:
countFlag = 3
getImageFromNet(imageUrls![0], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["topCenter"], layerPosition: 3 - 0)
})
getImageFromNet(imageUrls![1], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["bottomRight"], layerPosition: 3 - 1)
})
getImageFromNet(imageUrls![2], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["bottomLeft"], layerPosition: 3 - 2)
})
case 4:
countFlag = 4
let startTime = NSDate().timeIntervalSince1970
hlog("start point is \(startTime)")
getImageFromNet(imageUrls![0], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["topLeft"], layerPosition: 4 - 0)
})
getImageFromNet(imageUrls![1], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["topRight"], layerPosition: 4 - 1)
})
getImageFromNet(imageUrls![2], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["bottomRight"], layerPosition: 4 - 2)
})
getImageFromNet(imageUrls![3], completion: { [unowned self](result) -> Void in
self.addToView(result, frame: self.frames["bottomLeft"], layerPosition: 4 - 3)
})
hlog("end point is \(NSDate().timeIntervalSince1970) ,it takes \(NSDate().timeIntervalSince1970 - startTime)")
default:
break
}
}
func addToView(result: AnyObject, frame: CGRect?, layerPosition: Int) {
let newImage = self.generateNewImages(result)
let uiimage = UIImageView.init(image: newImage)
uiimage.frame = frame!
uiimage.tag = layerPosition
uiimage.hidden = true
self.addSubview(uiimage)
self.countFlag--
if countFlag <= 0 {
adjustLayerPosition()
}
}
/**
重新排序,覆蓋方式,層級越大,越在上層,注意,view本身的tag是0
*/
func adjustLayerPosition() {
for i in Range(start: 1, end: 5) {
let view = self.viewWithTag(i)
if view != nil {
view!.removeFromSuperview()
view?.hidden = false
self.insertSubview(view!, atIndex: i - 1)
}
}
}
func generateNewImages(result: AnyObject) -> UIImage? {
guard let image = result as? UIImage else {
return nil
}
let ctx = self.init_context(CGSizeMake(self.imageWidth + self.imageCoverPx, self.imageHeight + self.imageCoverPx))
let borderRect = CGRectMake(self.borderWidth / 2, self.borderWidth / 2, self.imageWidth + self.imageCoverPx - self.borderWidth, self.imageHeight + self.imageCoverPx - self.borderWidth)
CGContextAddEllipseInRect(ctx, borderRect)
CGContextStrokePath(ctx)
let rect = CGRectMake(self.borderWidth, self.borderWidth, self.imageWidth + self.imageCoverPx - self.borderWidth * 2, self.imageHeight + self.imageCoverPx - self.borderWidth * 2)
CGContextAddEllipseInRect(ctx, rect);
// 裁剪(按照當前的路徑形狀裁剪)
CGContextClip(ctx)
image.drawInRect(rect)
let newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage
}
func getImageFromNet(imageUrl: String, completion: blockOne) {
sdManger.downloadImageWithURL(NSURL.init(string: imageUrl), options: SDWebImageOptions.AllowInvalidSSLCertificates, progress: nil, completed: { (image, error, cacheType, flag, nsurl) -> Void in
if error == nil {
completion(result: image)
}
})
}
}
extension GroupCirCleImage: ValueChangeDelete {
func imageCoverPxChange(newConverPx: CGFloat) {
imageCoverPx = newConverPx
for imageview in self.subviews {
imageview.removeFromSuperview()
}
drawImages()
}
func imageWidthChange(newWidth: CGFloat) {
}
func imageHeightChange(newHeight: CGFloat) {
}
}
總結,使用繪圖的方式來生成群聊圖片。
問題:
- 這種方式比之前的方式,那種會更加好,為什么?