Objective-C下iOS高效绘制并更新颜色网格的方案咨询

嘿，我之前做类似的动态颜色网格需求时，也踩过CAShapeLayer、UIView堆出来的性能坑，给你几个亲测有效的替代思路，不用碰底层图形框架，就能比你现在的方案快不少：

1. 直接操作像素生成UIImage（最推荐） #

这是我试过的最快的纯UIKit方案——直接在内存里构建像素缓冲区，生成一张完整的网格图片，然后用一个UIImageView显示。比起创建几百上千个UIView或者ShapeLayer，这种方式只需要维护一个视图，更新时也只是替换图片内容，开销小很多。

核心代码示例： #

// 假设网格尺寸是50x50，每个格子大小可根据需求调整
NSInteger gridSize = 50;
CGFloat cellWidth = 10.0f;
CGFloat cellHeight = 10.0f;
CGSize imageSize = CGSizeMake(gridSize * cellWidth, gridSize * cellHeight);

// 创建可复用的像素缓冲区，避免频繁内存分配
NSUInteger bytesPerPixel = 4;
NSUInteger bytesPerRow = imageSize.width * bytesPerPixel;
NSUInteger totalBytes = bytesPerRow * imageSize.height;
unsigned char *pixelBuffer = malloc(totalBytes);

// 填充像素（示例为随机颜色，实际替换成你的颜色逻辑）
for (NSInteger y = 0; y < gridSize; y++) {
    for (NSInteger x = 0; x < gridSize; x++) {
        NSUInteger pixelIndex = (y * gridSize + x) * bytesPerPixel;
        pixelBuffer[pixelIndex] = arc4random_uniform(256);       // R通道
        pixelBuffer[pixelIndex + 1] = arc4random_uniform(256);   // G通道
        pixelBuffer[pixelIndex + 2] = arc4random_uniform(256);   // B通道
        pixelBuffer[pixelIndex + 3] = 255;                       // Alpha通道（不透明）
    }
}

// 创建位图上下文生成图片
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = CGBitmapContextCreate(pixelBuffer,
                                             imageSize.width,
                                             imageSize.height,
                                             8,
                                             bytesPerRow,
                                             colorSpace,
                                             kCGImageAlphaPremultipliedLast);

CGImageRef cgImage = CGBitmapContextCreateImage(context);
UIImage *gridImage = [UIImage imageWithCGImage:cgImage];

// 释放资源
CGImageRelease(cgImage);
CGContextRelease(context);
CGColorSpaceRelease(colorSpace);
free(pixelBuffer);

// 主线程更新UI，避免卡顿
dispatch_async(dispatch_get_main_queue(), ^{
    self.gridImageView.image = gridImage;
});

优化点：

• 复用pixelBuffer和颜色空间，减少内存分配开销
• 把像素填充逻辑放到后台线程执行，主线程仅负责更新UI
• 若网格尺寸固定，可提前创建上下文，无需每次绘制都重新生成

2. 批量绘制矩形到自定义UIView的drawRect: #

如果不想直接操作像素，也可以在自定义UIView的drawRect:方法里，用CGContextFillRects批量绘制所有网格单元格。这个方法比逐个添加CAShapeLayer或UIBezierPath快很多，因为它是一次性提交绘制命令给GPU。

核心代码示例： #

@interface GridView : UIView
@property (nonatomic, strong) NSArray<UIColor *> *cellColors; // 存储50x50的颜色数组
@property (nonatomic, assign) NSInteger gridSize;
@end

@implementation GridView

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGFloat cellWidth = self.bounds.size.width / self.gridSize;
    CGFloat cellHeight = self.bounds.size.height / self.gridSize;
    
    // 提前计算所有单元格的位置和颜色
    for (NSInteger y = 0; y < self.gridSize; y++) {
        for (NSInteger x = 0; x < self.gridSize; x++) {
            CGRect cellRect = CGRectMake(x * cellWidth, y * cellHeight, cellWidth, cellHeight);
            UIColor *color = self.cellColors[y * self.gridSize + x];
            
            CGContextSetFillColorWithColor(context, color.CGColor);
            CGContextFillRect(context, cellRect);
        }
    }
}

// 更新颜色后触发重绘
- (void)updateCellColors:(NSArray<UIColor *> *)newColors {
    self.cellColors = newColors;
    [self setNeedsDisplay];
}

@end

注意：若需要频繁更新，尽量把单元格位置计算逻辑移到drawRect:外，避免每次绘制都重复计算。

3. 复用UICollectionViewCell（适合需要交互的场景） #

如果你的网格需要支持点击、选中之类的交互，UICollectionView是个不错的选择。通过cell复用机制，不会一次性创建2500个cell，只会生成屏幕可见数量的cell，内存占用更低。更新颜色时，仅需刷新对应的cell即可。

优化点： #

• 开启UICollectionView的预加载和复用优化
• 直接用cell的contentView.backgroundColor设置颜色，避免复杂子视图
• 批量刷新时使用performBatchUpdates:，减少UI刷新次数

这些方案都不用依赖OpenGL/Metal，性能上比你之前测试的几种方法提升明显，尤其是第一种直接生成UIImage的方式，后续扩展到更大的网格（比如100×100）也能保持不错的帧率。

内容的提问来源于stack exchange，提问作者Andrew Savage