项目中,有一个需求,是加载几张网络图片,每一张都要求宽度与屏幕宽度一样,然后高度自适应;并且几张自上而下一次排列。
这让我想到了UITableVIew,但是图片的处理成了问题,经过我多次的处理,完成了这个需求
大概的思路是:
1.重写自己的Cell,Cell中利用一个UIButton展示图片,而不是UIImageView,因为这样好控制图片的宽度与屏幕一致
2.每一个图片在未完成网络加载时,都有一张长款固定的HolderImage代替
3.UITableView cell 的height手动计算
首先是自定义Cell:
//
// PYClubPresentDetailImgTableViewCell.h
// iphone-pay
//
// Created by jinhui005 on 16/8/25.
// Copyright © 2016年 RHJX Inc. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface PYClubPresentDetailImgTableViewCell : UITableViewCell
@property (nonatomic, strong) UIButton *btn;
@end
//
// PYClubPresentDetailImgTableViewCell.m
// iphone-pay
//
// Created by jinhui005 on 16/8/25.
// Copyright © 2016年 RHJX Inc. All rights reserved.
//
#import "PYClubPresentDetailImgTableViewCell.h"
@interface PYClubPresentDetailImgTableViewCell ()
@end
@implementation PYClubPresentDetailImgTableViewCell
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
[self.contentView addSubview:self.btn];
[self.btn mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.top.right.bottom.equalTo(self.contentView);
}];
}
return self;
}
- (UIButton *)btn {
if (nil == _btn) {
_btn = [[UIButton alloc] init];
_btn.titleLabel.font = kFT3;
_btn.userInteractionEnabled = NO;
}
return _btn;
}
@end
然后是UITableView的代理方法
#pragma mark - UITableViewDelegate, UITableViewDataSource
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return self.imgArray.count;//图片URL以数组的形式存在
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
// 先从缓存中查找图片
UIImage *image = [[SDImageCache sharedImageCache] imageFromDiskCacheForKey: self.imgArray[indexPath.row]];
// 没有找到已下载的图片就使用默认的占位图,当然高度也是默认的高度了,除了高度不固定的文字部分。
if (!image) {
image = [UIImage imageNamed:kDownloadImageHolder];
}
//手动计算cell
CGFloat imgHeight = image.size.height * [UIScreen mainScreen].bounds.size.width / image.size.width;
return imgHeight;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *imgID = @"pictureCellID";
PYClubPresentDetailImgTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:imgID];
if (nil == cell) {
cell = [[PYClubPresentDetailImgTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:imgID];
}
[self configureCell:cell atIndexPath:indexPath];
cell.userInteractionEnabled = NO;
return cell;
}
- (void)configureCell:(PYClubPresentDetailImgTableViewCell *)cell atIndexPath:(NSIndexPath *)indexPath {
NSString *imgURL = self.imgArray[indexPath.row];
UIImage *cachedImage = [[SDImageCache sharedImageCache] imageFromDiskCacheForKey:imgURL];
if ( !cachedImage ) {
[self downloadImage:self.imgArray[indexPath.row] forIndexPath:indexPath];
[cell.btn setBackgroundImage:[UIImage imageNamed:kDownloadImageHolder] forState:UIControlStateNormal];
} else {
[cell.btn setBackgroundImage:cachedImage forState:UIControlStateNormal];
}
}
- (void)downloadImage:(NSString *)imageURL forIndexPath:(NSIndexPath *)indexPath {
// 利用 SDWebImage 框架提供的功能下载图片
[[SDWebImageDownloader sharedDownloader] downloadImageWithURL:[NSURL URLWithString:imageURL] options:SDWebImageDownloaderUseNSURLCache progress:^(NSInteger receivedSize, NSInteger expectedSize) {
// do nothing
} completed:^(UIImage *image, NSData *data, NSError *error, BOOL finished) {
[[SDImageCache sharedImageCache] storeImage:image forKey:imageURL toDisk:YES];
dispatch_async(dispatch_get_main_queue(), ^{
[self.tableView reloadData];
});
}];
}