如何将 JSON 中返回的图像 URL 显示为 UITableViewCell 的缩略图

Posted 2023-03-04

【中文标题】如何将 JSON 中返回的图像 URL 显示为 UITableViewCell 的缩略图

【英文标题】：How to display image URLs being returned in JSON as thumbnails of UITableViewCell

【发布时间】：2014-06-10 21:01:28

【问题描述】：

我有将 JSON 返回到我的 ios 应用程序的 Parse 云代码。从下面的 JSON 中可以看出，每个项目都有一个 Image URL 属性。我想要做的是将每个 UITableViewCell 的缩略图设置为项目各自的Image URL。

我知道这涉及处理异步行为，因此单元格必须等待图像加载后才能显示它们。我已经用谷歌搜索了如何执行此任务，但我无法理解如何执行此任务。

我在下面的尝试使用

 NSData *imageData = [NSData dataWithContentsOfURL:[NSURL [*matchCenterDictionary objectForKey:@"Image URL"]]];
    [[cell imageView] setImage:[UIImage imageWithData:imageData]];

给我一​​个错误说明expected identifier。

MatchCenterViewController.m：

#import "MatchCenterViewController.h"
#import <UIKit/UIKit.h>

@interface MatchCenterViewController () <UITableViewDataSource, UITableViewDelegate>
@property (nonatomic, strong) UITableView *matchCenter;
@end

@implementation MatchCenterViewController


- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil

    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
    if (self) 
    
    return self;



- (void)viewDidLoad

    [super viewDidLoad];

    self.matchCenter = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewCellStyleSubtitle];
    self.matchCenter.frame = CGRectMake(0,50,320,self.view.frame.size.height-200);
    _matchCenter.dataSource = self;
    _matchCenter.delegate = self;
    [self.view addSubview:self.matchCenter];

    self.matchCenterArray = [[NSArray alloc] init];


- (void)viewDidAppear:(BOOL)animated

    self.matchCenterArray = [[NSArray alloc] init];

    [PFCloud callFunctionInBackground:@"MatchCenter"
                       withParameters:@
                                        @"test": @"Hi",
                                        
                                block:^(NSDictionary *result, NSError *error) 

                                    if (!error) 
                                         self.matchCenterArray = [result objectForKey:@"Top 3"];

                                        dispatch_async(dispatch_get_main_queue(), ^
                                            [_matchCenter reloadData];
                                        );

                                        NSLog(@"Test Result: '%@'", result);
                                    
                                ];





- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

    return 1;


- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

     return [self.matchCenterArray count];



- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

    // Initialize cell
    static NSString *CellIdentifier = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (!cell) 
        // if no cell could be dequeued create a new one
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];
    

    // populate dictionary with results
    NSDictionary *matchCenterDictionary= [self.matchCenterArray objectAtIndex:indexPath.row];

    // title of the item
    cell.textLabel.text = [matchCenterDictionary objectForKey:@"Title"];
    // price of the item
    cell.detailTextLabel.text = [matchCenterDictionary objectForKey:@"Price"];



    NSData *imageData = [NSData dataWithContentsOfURL:[NSURL [*matchCenterDictionary objectForKey:@"Image URL"]]];
    [[cell imageView] setImage:[UIImage imageWithData:imageData]];




    return cell;


- (void)didReceiveMemoryWarning

    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.



/*
#pragma mark - Navigation


- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender

    // Get the new view controller using [segue destinationViewController].
    // Pass the selected object to the new view controller.

*/

@end

正在返回的 JSON：

    "Top 3" =     (
                
            "Image URL" = "http://thumbs1.ebaystatic.com/m/m43q-_-W_kKrSuwWbIO7msg/140.jpg";
            "Item URL" = "http://www.ebay.com/itm/New-AT-T-Moto-X-XT1058-android-Smartphone-Black-16GB-/141304035108?pt=Cell_Phones";
            Price = "289.95";
            Title = "New AT&T Moto X XT1058 Android Smartphone Black 16GB";
        ,
                
            "Image URL" = "http://thumbs2.ebaystatic.com/m/mP5Gx55JuDEVZlmFodzuUow/140.jpg";
            "Item URL" = "http://www.ebay.com/itm/New-AT-T-Moto-X-XT1058-Android-Smartphone-White-16GB-/141302889485?pt=Cell_Phones";
            Price = "289.95";
            Title = "New AT&T Moto X XT1058 Android Smartphone White 16GB";
        ,
                
            "Image URL" = "http://thumbs2.ebaystatic.com/m/mDMiorn4BLSRBcU1EpbFPaA/140.jpg";
            "Item URL" = "http://www.ebay.com/itm/New-Motorola-Moto-X-16GB-White-10MP-AT-T-Branded-Unlocked-Android-Smartphone-/131194435025?pt=Cell_Phones";
            Price = "339.99";
            Title = "New Motorola Moto X 16GB White 10MP AT&T Branded Unlocked Android Smartphone";
        
    );

【参考方案1】：

这段代码：

[NSURL [*matchCenterDictionary objectForKey:@"Image URL"]]

对我来说似乎是罪魁祸首......我会尝试：

[NSURL URLWithString:[matchCenterDictionary objectForKey:@"Image URL"]]

这不包括你提到的异步网络调用......为此，我建议使用 Parse 提供的PFImageView，而不是 UITableViewCell 中内置的imageView。但是有几种方法可以完成这项任务...

【参考方案2】：

你的方法很好。但是在重新加载 tableview 期间，您的方法并不好。所以你必须在 UITableViewCell 的 imageview 中异步加载图像。请点击此链接Loading an image into UIImage asynchronously