一张小的像素图转大图时会变得模糊
iOS 像素图转高清大图
有两种方式可以使生成的大图更清晰
- 用最近邻插值算法生成大图
- 按其宽高和像素行列去取颜色,CoreGraphics 用颜色数组画多个矩形去绘制大图
比较
随机生成 20 张原图 64px * 64px(iOS 由颜色数组生成像素图),用上诉两种方式生成大图,比对生成速度和内存峰值:内存用量几乎完全一致,而速度上,放大倍数小时最近邻插值更快,放大倍数大时 CoreGraphics 更快
因为最近邻插值算法的原理是找到原图像中对应的点后,找到离它最近的一个整数坐标的像素值作为目标图像对应位置处的像素值,当放大倍数越大,处理次数越多
而 CoreGraphics 画矩形,无论放大倍数多少,处理次数是一样的
本文给出两种方式的具体代码,读者可自行传入倍数,测试生成时间
最近邻插值
CGInterpolationQuality 插值质量
kCGInterpolationDefault
默认
kCGInterpolationNone
无插值(最近邻插值
kCGInterpolationLow
插值质量低,图像渲染速度快
kCGInterpolationMedium
插值质量中等,渲染速度中等
kCGInterpolationHigh
插值质量高,渲染速度较慢
extension UIImage {
func resize(to size: CGSize, interpolationQuality: CGInterpolationQuality = .none, isOpaque: Bool = false) -> UIImage? {
let format = imageRendererFormat
format.opaque = isOpaque
return UIGraphicsImageRenderer(size: size, format: format).image { context in
context.cgContext.interpolationQuality = interpolationQuality
draw(in: CGRect(origin: .zero, size: size))
}
}
}
CoreGraphics画矩形
- 原图转 UIColor 数组,注意行列非图片本身宽高,而是像素图行列数(一格可能有很多像素)
- 用 UIColor 数组画大图,每个 UIColor 对应一个矩形,代码在iOS 由颜色数组生成像素图,看这段代码可以理解图片宽高和像素图行列的关系(倍数关系)
extension UIImage {
/// 从 UIImage 转 colors
/// - Parameters:
/// - image: 图
/// - column: 列(宽
/// - row: 行(高
static func colors(with image: UIImage, column: Int, row: Int) -> [UIColor]? {
guard let cgImage = image.cgImage else { return nil}
let imageRef = cgImage
let width = imageRef.width
let height = imageRef.height
let colorSpace = CGColorSpaceCreateDeviceRGB()
let bytesPerPixel = 4
let bytesPerRow = bytesPerPixel * width
let bitsPerComponent = 8
let bitmapInfo: UInt32 = CGImageAlphaInfo.premultipliedLast.rawValue | CGBitmapInfo.byteOrder32Big.rawValue
guard let context = CGContext(data: nil, width: width, height: height,
bitsPerComponent: bitsPerComponent, bytesPerRow: bytesPerRow,
space: colorSpace, bitmapInfo: bitmapInfo),
let ptr = context.data?.assumingMemoryBound(to: UInt8.self) else {
return nil
}
context.draw(imageRef, in: CGRect(x: 0, y: 0, width: width, height: height))
var colors = [UIColor]()
let offset = width / column / 2
let perPixel = width / column
for y in 0..<row {
for x in 0..<column {
let i = (bytesPerRow * (y * perPixel + offset)) + (x * perPixel + offset) * bytesPerPixel
let alpha = CGFloat(ptr[i + 3]) / 255.0
let red = (CGFloat(ptr[i]) / alpha) / 255.0
let green = (CGFloat(ptr[i + 1]) / alpha) / 255.0
let blue = (CGFloat(ptr[i + 2]) / alpha) / 255.0
colors.append(UIColor(red: red, green: green, blue: blue, alpha: alpha))
}
}
return colors
}
}