推荐关注模块的实现1

推荐关注是我们App中常见的模块，今天我将总结一下具体的实现。

效果图如下：

 

从图中我们可以看到，该界面是由两个UITableView组成的

 

首先我们先完成左边的类别数据的加载，以下都是代码加xib完成的。

一.Controller

1.创建推荐关注控制器

 

DDZRecommendViewController

并在xib中添加一个UITableView控件

需要你自己添加约束，将其固定在左边。

然后将其关联在代码中

@property (weak, nonatomic) IBOutlet UITableView *categoryTableView;

 

2.添加第三方框架

 

因为需要向服务器中请求数据，所以引入AFNetworking框架

因为需要背景蒙版，所以引入SVProgressHUD框架

因为需要将服务器中回传的字典数组转换成模型数组，所以引入MJExtension框架

因为后期需要缓存图片数据，所以引入SDWebImage框架

 

 

3.加载viewDidLoad

 

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = DDZGlobalBg;

    self.title = @"推荐关注";
    
    //隐藏滚动条
    self.categoryTableView.showsVerticalScrollIndicator = NO;
    
    //注册cell
    [self.categoryTableView registerNib:[UINib nibWithNibName:NSStringFromClass([DDZRecommendCategoryCell class]) bundle:nil] forCellReuseIdentifier:@"category"];
    
    //设置背景蒙版
    [SVProgressHUD show];
    [SVProgressHUD setDefaultMaskType:SVProgressHUDMaskTypeBlack];
    
    //数据请求
    AFHTTPSessionManager *manager = [AFHTTPSessionManager manager];
    NSMutableDictionary *dict = [NSMutableDictionary dictionary];
    dict[@"a"] = @"category";
    dict[@"c"] = @"subscribe";
    [manager GET:@"http://api.budejie.com/api/api_open.php" parameters:dict progress:^(NSProgress * _Nonnull downloadProgress) {
        
    } success:^(NSURLSessionDataTask * _Nonnull task, id  _Nullable responseObject) {
        
        [SVProgressHUD dismiss];
        
        //回传数据成功(需要字典转数据模型框架)
        self.categories = [DDZRecommendCategory mj_objectArrayWithKeyValuesArray:responseObject[@"list"]];

        //刷新页面
        [self.categoryTableView reloadData];
        
        //默认选中首行
        [self.categoryTableView selectRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0] animated:NO scrollPosition:UITableViewScrollPositionTop];
        
        
    } failure:^(NSURLSessionDataTask * _Nullable task, NSError * _Nonnull error) {
        
        [SVProgressHUD showErrorWithStatus:@"加载推荐信息失败！"];
    }];
    
}

 

其中DDZGlobalBg是自定义的宏定义

#define DDZRGBColor(r, g, b) [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(g)/255.0 alpha:233/255.0]
#define DDZGlobalBg DDZRGBColor(233,233,233)

 

4.实现UITableView的委托

 

#pragma mark - <UITableViewDataSource,UITableViewDelegate>
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return self.categories.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    DDZRecommendCategoryCell *cell = [tableView dequeueReusableCellWithIdentifier:@"category"];
    
    cell.category = self.categories[indexPath.row];
    
    return cell;
}

 

二.Model

 

数据模型用于保存服务器回传过来的数据

@interface DDZRecommendCategory : NSObject
/** id */
@property (nonatomic,assign) NSInteger id;
/** count */
@property (nonatomic,assign) NSInteger count;
/** name */
@property (nonatomic,copy) NSString *name;

@end

 

三.View

 

1.其中我们需要自定义UITableView的Cell

 

 

@class DDZRecommendCategory;
@interface DDZRecommendCategoryCell : UITableViewCell

/** 模型数据 */
@property (nonatomic,strong) DDZRecommendCategory *category;

@end

 

 

在xib中

//每次唤醒cell时加载
- (void)awakeFromNib {
    [super awakeFromNib];
    self.backgroundColor = DDZRGBColor(244, 244, 244);
    
    //当cell的selection为none时，即使 cell被选中，内部的子控件不会进入高亮状态
    
//    self.textLabel.textColor = DDZRGBColor(78, 78, 78);
//    self.textLabel.highlightedTextColor = DDZRGBColor(219, 21, 26);
}

//设置模型数据
- (void)setCategory:(DDZRecommendCategory *)category  {
    
    _category = category;
    
    self.textLabel.text = category.name;
}

//设置子控件布局
- (void)layoutSubviews {
    
    [super layoutSubviews];
    //重新调整内部textlabel的frame
//    self.textLabel.y = 2;
    self.textLabel.height = self.contentView.height - 4;
}

/**
 * 可以在这个方法中监听cell的选中与取消 
 */
- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
    
    self.selectedIndicator.hidden = !selected;
    self.textLabel.textColor = selected ? DDZRGBColor(219, 21, 26):DDZRGBColor(78, 78, 78);
}