UI基础之UITableView案例团购----自定义cell利用xib

一：模型数据：

#import <Foundation/Foundation.h>

@interface LLGroup : NSObject

/**
 *  icon
 */
@property (nonatomic, copy) NSString *icon;

/**
 *  title
 */
@property (nonatomic, copy) NSString *title;

/**
 *  buyCount
 */
@property (nonatomic, copy) NSString *buyCount;

/**
 *  price
 */
@property (nonatomic, copy) NSString *price;

+ (instancetype)groupWithDic:(NSDictionary *)dic;
- (instancetype)initWithDic:(NSDictionary *)dic;

+ (NSMutableArray *)groupList;

@end

#import "LLGroup.h"

@implementation LLGroup

+ (instancetype)groupWithDic:(NSDictionary *)dic
{
    return [[self alloc] initWithDic:dic];
}
- (instancetype)initWithDic:(NSDictionary *)dic
{
    if (self = [super init]) {
        
        [self setValuesForKeysWithDictionary:dic];
    }
    return self;
}

+ (NSMutableArray *)groupList
{
    NSString *path = [[NSBundle mainBundle] pathForResource:@"tgs.plist" ofType:nil];
    NSArray *dicArray = [NSArray arrayWithContentsOfFile:path];
    
    NSMutableArray *tmpArray = [[NSMutableArray alloc] initWithCapacity:dicArray.count];
    for (NSDictionary *dic in dicArray) {
        
        LLGroup *group = [LLGroup groupWithDic:dic];
        [tmpArray addObject:group];
    }
    return tmpArray;
}

@end

二：自定义cell：利用xib自定义cell （

#import <UIKit/UIKit.h>
@class LLGroup;
@interface LLGroupCell : UITableViewCell

/**
 *  数据模型
 */
@property (nonatomic, strong) LLGroup *group;

+ (instancetype)groupCellWith:(UITableView *)tableView;

@end

#import "LLGroupCell.h"
#import "LLGroup.h"
@interface LLGroupCell ()

@property (weak, nonatomic) IBOutlet UIImageView *iconView;
@property (weak, nonatomic) IBOutlet UILabel *nameView;

@property (weak, nonatomic) IBOutlet UILabel *priceView;
@property (weak, nonatomic) IBOutlet UILabel *buyCountView;

@end

@implementation LLGroupCell

- (void)awakeFromNib {
    // Initialization code
}

+ (instancetype)groupCellWith:(UITableView *)tableView
{
    static NSString *ID = @"groupCell";
    LLGroupCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
    if (!cell) {
        
        cell = [[[NSBundle mainBundle] loadNibNamed:@"LLGroupCell" owner:nil options:nil] lastObject];
    }
    
    // 设置cell选中颜色
    UIImageView *selectedImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"buttonorange"]];
    UIImageView *backgroundImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"buttonorange"]];
    cell.backgroundView = backgroundImageView;
    cell.selectedBackgroundView = selectedImageView;
    
    return cell;
}

- (void)setGroup:(LLGroup *)group
{
    _group = group;
    
    self.iconView.image = [UIImage imageNamed:group.icon];
    self.nameView.text = group.title;
    self.buyCountView.text = [NSString stringWithFormat:@"已购买%@人", group.buyCount];
    self.priceView.text = [NSString stringWithFormat:@"￥%@", group.price];
    
}

@end

设置cell子控件数据：自定义cell应该拥有模型数据，在setter方法中赋值是最合适的

三：自定义footer（利用xib)

#import <UIKit/UIKit.h>

@class LLFooterView;
@protocol LLFooterViewDelegate <NSObject>

@optional
- (void)footerViewDidClickLoadBtn:(LLFooterView *)footerView;

@end

@interface LLFooterView : UIView

@property (nonatomic, weak) id<LLFooterViewDelegate> delegate;

+ (instancetype)footerView;

@end

#import "LLFooterView.h"

@interface LLFooterView ()

@property (weak, nonatomic) IBOutlet UIButton *loadBtn;
@property (weak, nonatomic) IBOutlet UIView *loadingView;
- (IBAction)clickBtn:(UIButton *)sender;


@end

@implementation LLFooterView

+ (instancetype)footerView
{
    LLFooterView *footerView = [[[NSBundle mainBundle] loadNibNamed:@"LLFooterView" owner:nil options:nil] lastObject];
    return footerView;
}

// 当xib加载完毕后系统自动调用
- (void)awakeFromNib
{
    self.loadBtn.backgroundColor = [UIColor colorWithRed:241/255.0 green:170/255.0 blue:102/255.0 alpha:1.0];
    
    // 设置按钮圆角
    self.loadBtn.layer.cornerRadius = 10.0;
    self.loadBtn.layer.masksToBounds = YES;
}

- (IBAction)clickBtn:(UIButton *)sender {
    
    self.loadingView.hidden = NO;
    self.loadingView.backgroundColor = [UIColor colorWithRed:241/255.0 green:170/255.0 blue:102/255.0 alpha:1.0];
    self.loadingView.layer.cornerRadius = 10.0;
    self.loadingView.layer.masksToBounds = YES;
    sender.hidden = YES;
    
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        
        if ([self.delegate respondsToSelector:@selector(footerViewDidClickLoadBtn:)]) {
            
            [self.delegate footerViewDidClickLoadBtn:self];
        }
        self.loadingView.hidden = YES;
        self.loadBtn.hidden = NO;
    });

}
@end

这里用到了代理方法：按钮点击后tableView监听按钮的点击事件

四：自定义header

#import <UIKit/UIKit.h>

@interface LLHeaderView : UIView

+ (instancetype)headerView;

@end

#import "LLHeaderView.h"
#define IMAGEW 260
@interface LLHeaderView ()<UIScrollViewDelegate>

@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;

@property (weak, nonatomic) IBOutlet UIPageControl *pageControl;
@property (nonatomic, strong) NSTimer *timer;

@end

@implementation LLHeaderView

+ (instancetype)headerView
{
    LLHeaderView *headerView = [[[NSBundle mainBundle] loadNibNamed:@"LLHeaderView" owner:nil options:nil] lastObject];
    headerView.backgroundColor =  [UIColor colorWithRed:241/255.0 green:170/255.0 blue:102/255.0 alpha:1.0];
    return headerView;
}

- (void)awakeFromNib
{
    // 1,加载scrollView;
    [self loadScrollView];
    
    // 2,控制pageControl
    self.scrollView.delegate = self;
    
    // 3,自动滚动
    [self startTimer];
}

- (void)nextImage
{
    NSInteger page = self.pageControl.currentPage;
    if (page == self.pageControl.numberOfPages - 1) {
        page = 0;
    } else {
        page++;
    }
    self.scrollView.contentOffset = CGPointMake(page * IMAGEW, 0);
}

#pragma mark - scrollView的代理
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGPoint point = self.scrollView.contentOffset;
    self.pageControl.currentPage = (point.x + IMAGEW * 0.5) / IMAGEW;
    
}

// 开启定时器
- (void)startTimer
{
    NSTimer *timer = [NSTimer timerWithTimeInterval:2.0 target:self selector:@selector(nextImage) userInfo:nil repeats:YES];
    self.timer = timer;
    NSRunLoop * loop = [NSRunLoop currentRunLoop];
    [loop addTimer:self.timer forMode:NSRunLoopCommonModes];

}

- (void)stopTimer
{
    [self.timer invalidate];
    self.timer = nil;
}

- (void)loadScrollView
{
    int count = 5;
//    CGFloat imageW = 260;
    CGFloat imageY = 0;
    CGFloat imageH = 100;
    for (int i = 0; i<count; i++) {
        
        UIImageView *imageView = [[UIImageView alloc] init];
        [self.scrollView addSubview:imageView];
        CGFloat imageX = i * IMAGEW;
        NSString *name = [NSString stringWithFormat:@"ad_0%d", i];
        imageView.image = [UIImage imageNamed:name];
        imageView.frame = CGRectMake(imageX, imageY, IMAGEW, imageH);
    }
    self.scrollView.contentSize = CGSizeMake(count * IMAGEW, 0);
    self.scrollView.showsHorizontalScrollIndicator = NO;
    self.scrollView.pagingEnabled = YES;
    self.pageControl.currentPageIndicatorTintColor = [UIColor redColor];
    self.pageControl.pageIndicatorTintColor = [UIColor blueColor];
    self.pageControl.numberOfPages = count;
}

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    [self stopTimer];
    
}

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    [self startTimer];
}


@end

五：控制器

#import "ViewController.h"
#import "LLGroup.h"
#import "LLGroupCell.h"
#import "LLFooterView.h"
#import "LLHeaderView.h"
@interface ViewController ()<UITableViewDataSource, LLFooterViewDelegate>

@property (nonatomic, weak) UITableView *tableView;
@property (nonatomic, strong) NSMutableArray *groups;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    [self loadTableView];
    NSLog(@"%@", NSHomeDirectory());
}

#pragma mark - 加载tableView
- (void)loadTableView
{
    // 1，创建tableView
    UITableView *tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) style:UITableViewStylePlain];
    [self.view addSubview:tableView];
    self.tableView = tableView;
    
    // 2, 设置tableView的数据源对象
    self.tableView.dataSource = self;
    
    // 3,设置tableView的行高
    self.tableView.rowHeight = 60;
    
    // 4,设置tableView的分割线的颜色
    self.tableView.separatorColor = [UIColor colorWithRed:0/255.0 green:255/255.0 blue:0/255.0 alpha:1.0];
    
    // 5,设置tableView的footerView
    LLFooterView *footerView = [LLFooterView footerView];
    self.tableView.tableFooterView = footerView;
    
    // 6，设置tableView为footerView的代理
    footerView.delegate = self;
    
    // 7, 设置tableView的headerView
    LLHeaderView *headerView = [LLHeaderView headerView];
    self.tableView.tableHeaderView = headerView;
    
}

#pragma mark - footerView的代理方法
- (void)footerViewDidClickLoadBtn:(LLFooterView *)footerView
{
    LLGroup *group = [[LLGroup alloc] init];
    group.title = @"兰州拉面";
    group.price = @"20";
    group.buyCount = @"200";
    group.icon = @"2c97690e72365e38e3e2a95b934b8dd2";
    
    [self.groups addObject:group];
    
    // 刷新数据：因为tableView并不知道数据中多了一行，因此不能用刷新单行的方法，会报错
    [self.tableView reloadData];
    
    // 将加载后的行自动上滚
    NSIndexPath *path = [NSIndexPath indexPathForRow:self.groups.count - 1 inSection:0];
    [self.tableView scrollToRowAtIndexPath:path atScrollPosition:UITableViewScrollPositionBottom animated:YES];
}

#pragma mark - 数据源方法
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return self.groups.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    // 1，创建cell
    LLGroupCell *cell = [LLGroupCell groupCellWith:tableView];
    // 2,设置数据
    cell.group = self.groups[indexPath.row];
    
    return cell;
    
}

#pragma mark - 懒加载数据
- (NSMutableArray *)groups
{
    if (!_groups) {
        
        _groups = [LLGroup groupList];
    }
    return _groups;
}
@end

效果：