最近在做GPU图层显示的优化，其中关于Color Misaligned Images优化文章有很多，但在具体优化的时候还是遇到了点的问题，特此记录。

检测方式

以下两种方式均可发现存在Misaligned Images问题的地方：

• 模拟器调试时，打开模拟器的Debug - Color Misaligned Images菜单选项。最快捷，但仅限模拟器上查看。
• Instrument性能检测时，选中Core Animation模板，在Display Settings中勾选Color Misaligned Images选项。可针对模拟器和真机，可查看真机上所有应用的像素混合情况。

问题定义

打开开关后，看到部分视图会有黄色或洋红色（Magenta）的图层标记，代表其像素不对齐。
不对齐：视图或图片的点数(point)，不能换算成整数的像素值（pixel），导致显示视图的时候需要对没对齐的边缘进行额外混合计算，影响性能。
洋红色：UIView的frame像素不对齐，即不能换算成整数像素值。
黄色：UIImageView的图片像素大小与其frame.size不对齐，图片发生了缩放造成。

优化方式

frame像素不对齐

像素不对称齐的元素一般为UILabel或UIImageView。
特别注意，上图中UILabel宽度不为整数时并没有有像素不对齐，但x、y、height不为整数就会导致像素不对齐。

图片像素不对齐

上图的前4个UIImageView，显示的是同一张图片，该图片@2x像素为128x128px，@3x像素为192x192px，仅当UIImageView的size为64x64的时候才没有像素不对齐。
遇到这种情况需要严格约束Icon图片和UIImageView的尺寸。

还有种情况即图片是从服务端获取到的，大小不规则。直接在UIImageView上显示容易出现像素不对齐。
解决方法：将下载到的图片，缩放到与UIImageView对应的尺寸，再显示出来。
多种图片缩放方式及其性能比较可参考《Image Resizing Techniques》，此处提供一个简单实现：

@implementation UIImage(Resize)

/**
 将UIImage缩放到指定大小

 @param boxSize 一般为UIImageView的size
 @return 缩放后的UIImage
 */
- (UIImage *)imageShowInSize:(CGSize)boxSize {
    if (CGSizeEqualToSize(boxSize, self.size)) {
        return self;
    }
    
    CGFloat screenScale = [[UIScreen mainScreen] scale];
    CGFloat rate = MAX(boxSize.width / self.size.width, boxSize.height / self.size.height);
    CGSize resize = CGSizeMake(self.size.width * rate , self.size.height * rate );
    CGRect drawRect = CGRectMake(-(resize.width - boxSize.width) / 2.0 ,
                                 -(resize.height - boxSize.height) / 2.0 ,
                                 resize.width,
                                 resize .height);
    boxSize = CGSizeMake(boxSize.width, boxSize.height);
    UIGraphicsBeginImageContextWithOptions(boxSize, YES, screenScale);
    [self drawInRect:drawRect];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}
@end

注意：

• 具体使用时，可能需要根据UIImageView的contentMode属性调整缩放方式。
• 该方法执行会花费一定的时间，在列表上显示需要缩放的图片，为了不影响列表滚动流程体验，该操作应放到非主线进行，并考虑将缩放后的结果缓存以便下次直接使用。
• 根据原始图片尺寸大小，当前状况是否明显影响列表滚动等具体情况再决定是否优化，比如目前微博首页的用户头像和九宫格图片不存在像素不对齐情况，而微信朋友圈的用户头像和图片是染成黄色的像素不对齐。

UITableview上UILabel的不对齐

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
    return CGFLOAT_MIN;
}

避免使用0.01这样的具体数值(0.01还不足够小，0.0001就能避免此处的不对齐)，直接使用系统给的CGFLOAT_MIN，这个足够小的值既能避免上述情况，又能让代码更直观。
隐藏header的其它方法和原理可参考：0代码隐藏GroupedTableView上边多余的间隔。

参考文章：

• 《Aligned UIViews》
• 《Image Resizing Techniques》
• 0代码隐藏GroupedTableView上边多余的间隔

我的博客原址：iOS Color Misaligned Images优化