ios - 带有图像的 UITableView 在滚动时会暂时显示错误的图像

Question

我有一个 UITableView，它有很多行，每一行只有一张图片。为了防止延迟，我使用了下面的代码。但是现在，当我滚动时，它会暂时显示前几行的照片，然后自行更正。如何解决这个问题？

- (void)loadImageNamed:(NSString *)name {
    dispatch_async(dispatch_get_global_queue( DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^(void){
        // Determine path to image depending on scale of device's screen,
        // fallback to 1x if 2x is not available
        NSString *pathTo1xImage = [[NSBundle mainBundle] pathForResource:name ofType:@"jpg"];

        NSString *pathToImage = pathTo1xImage;

        UIImage *uiImage = nil;

        if (pathToImage) {
            // Load the image
            CGDataProviderRef imageDataProvider = CGDataProviderCreateWithFilename([pathToImage fileSystemRepresentation]);
            CGImageRef image = CGImageCreateWithJPEGDataProvider(imageDataProvider, NULL, NO, kCGRenderingIntentDefault);


            // Create a bitmap context from the image's specifications
            // (Note: We need to specify kCGImageAlphaPremultipliedFirst | kCGBitmapByteOrder32Little
            // because PNGs are optimized by Xcode this way.)
            CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
            CGContextRef bitmapContext = CGBitmapContextCreate(NULL, CGImageGetWidth(image), CGImageGetHeight(image), CGImageGetBitsPerComponent(image), CGImageGetWidth(image) * 4, colorSpace, kCGImageAlphaPremultipliedFirst | kCGBitmapByteOrder32Little);


            // Draw the image into the bitmap context
            CGContextDrawImage(bitmapContext, CGRectMake(0, 0, CGImageGetWidth(image), CGImageGetHeight(image)), image);

            //  Extract the decompressed image
            CGImageRef decompressedImage = CGBitmapContextCreateImage(bitmapContext);


            // Create a UIImage
            uiImage = [[UIImage alloc] initWithCGImage:decompressedImage];


            // Release everything
            CGImageRelease(decompressedImage);
            CGContextRelease(bitmapContext);
            CGColorSpaceRelease(colorSpace);
            CGImageRelease(image);
            CGDataProviderRelease(imageDataProvider);
        }


        // Configure the UI with pre-decompressed UIImage
        dispatch_async(dispatch_get_main_queue(), ^{
            self.categoryImageLabel.image = uiImage;
        });
    });
}

Answer 1

其他答案会告诉您该做什么，但不会告诉您为什么。

将单元格想象成您必须在医生办公室候诊室填写的表格。想象一下，办公室重复使用这些表格，每位患者在填写信息之前必须删除表格上的所有数据。

如果您没有任何过敏症，您可能会想跳过过敏部分，因为它们不适用于您。但是，如果最后一个人有过敏症，而您没有删除他们的答案，他们的答案仍会显示在表格上。

同样，当您将回收单元出列时，您必须清除所有字段，即使是那些不适用于您的字段。您应该将图像设置为 nil 或它们的起始占位符值。

请注意，如果您异步加载数据，您仍应首先将字段重置为其默认值，因为旧值会在异步加载完成之前显示。这就是您的情况。

您可以在 cellForRowIndexPath 或 prepareForReuse 中将图像设置为 nil/placeholder，但您需要在其中一个位置重置它，否则您会看到剩余的图像，直到新图像完成加载。