3

我正在开发聊天应用程序,我需要在其中显示从 json 获取的文本、图像、视频。显示图像数据在 JSQ 框架中有一个方法:

 NSData *data = [NSData dataWithContentsOfURL:[NSURL URLWithString:entity.image.imageUrl]];
 UIImage *imageFromUrl = [UIImage imageWithData:data];
JSQPhotoMediaItem *photoItem = [[JSQPhotoMediaItem alloc] initWithImage:imageFromUrl];
JSQMessage *photoMessage = [[JSQMessage alloc] initWithSenderId:senderId senderDisplayName:displayName date:entity.messageDate media:photoItem];

但这需要很长时间才能加载,因为我必须显示大量图像。那么如何在聊天异步中显示来自url的图像?

4

2 回答 2

11

我就是这样做的:

#import "JSQPhotoMediaItem.h"

@interface ChatAsyncPhoto : JSQPhotoMediaItem

@property (nonatomic, strong) UIImageView *asyncImageView;

- (instancetype)initWithURL:(NSURL *)URL;

@end

#import "ChatAsyncPhoto.h"
#import "UIColor+JSQMessages.h"
#import "JSQMessagesMediaPlaceholderView.h"
#import "UIImageView+WebCache.h"

@implementation ChatAsyncPhoto

- (instancetype)init
{
    return [self initWithMaskAsOutgoing:YES];
}

- (instancetype)initWithURL:(NSURL *)URL {
    self = [super init];
    if (self) {
        CGSize size = [self mediaViewDisplaySize];

        self.asyncImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, size.width, size.height)];
        self.asyncImageView.contentMode = UIViewContentModeScaleToFill;
        self.asyncImageView.clipsToBounds = YES;
        self.asyncImageView.layer.cornerRadius = 20;
        self.asyncImageView.backgroundColor = [UIColor jsq_messageBubbleLightGrayColor];

        UIView *activityIndicator = [JSQMessagesMediaPlaceholderView viewWithActivityIndicator];
        activityIndicator.frame = self.asyncImageView.frame;

        [self.asyncImageView addSubview:activityIndicator];

        UIImage *image = [[SDImageCache sharedImageCache] imageFromDiskCacheForKey:URL.absoluteString];
        if(image == nil)
        {
            [self.asyncImageView sd_setImageWithURL:URL completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, NSURL *imageURL) {
                if (error == nil) {
                    [self.asyncImageView setImage:image];
                    [activityIndicator removeFromSuperview];
                } else {
                    NSLog(@"Image downloading error: %@", [error localizedDescription]);
                }
            }];
        } else {
            [self.asyncImageView setImage:image];
            [activityIndicator removeFromSuperview];
        }
    }

    return self;
}

#pragma mark - JSQMessageMediaData protocol
- (UIView *)mediaView
{
    return self.asyncImageView;
}

#pragma mark - NSCoding
- (instancetype)initWithCoder:(NSCoder *)aDecoder
{
    NSLog(@"init coder has not been implemented");

    return self;
}

@end

然后您可以按如下方式使用该类:

ChatAsyncPhoto *photoItem = [[ChatAsyncPhoto alloc] initWithURL:[NSURL URLWithString:messageItem.content]];
JSQMessage *message = [[JSQMessage alloc] initWithSenderId:messageItem.userInfo.id
                                         senderDisplayName:messageItem.userInfo.username
                                                      date:[DateUtil getTimeDateStringFromDate:messageItem.createdDate]
                                                     media:photoItem];
[self.chatData.messages addObject:message];
于 2016-06-13T05:36:56.497 回答
-1

我会看看

self.sd_setImageWithURL(NSURL!, forState: UIControlState, placeholderImage: UIImage!, options: SDWebImageOptions)

在这种情况下, self 将是您的图像视图。有几种不同的方法和不同的选项。这是一个异步调用,因此它不会阻止您的 UI,如果您使用.RefreshCachedoptions:,它将在调用返回时更新。

于 2016-02-11T17:45:39.513 回答