首页 > 代码库 > UI基础之UITableView案例团购----自定义cell利用xib

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

效果:

 

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