07-百思不得姐(第七天)

今天主要完成评论界面模块：

该界面的思路如下：

• 点击首页cell后，进入评论控制器（DSCommentViewController）
• 首先上面的内容显示部分用tableView的header来完成，下面的评论就自定义cell（根据服务器数据来判断要不要分组）

接下来说明具体实现！

一、显示评论界面头部内容

1> 首先完成首页cell右上角按钮点击，显示弹窗

/** * cell右上角按钮点击 */
- (IBAction)more
{
    UIAlertController *alertController = [UIAlertController alertControllerWithTitle:nil message:nil preferredStyle:(UIAlertControllerStyleActionSheet)];

    UIAlertAction *cancleAction = [UIAlertAction actionWithTitle:@"取消" style:(UIAlertActionStyleCancel) handler:nil];
    UIAlertAction *collectAction = [UIAlertAction actionWithTitle:@"收藏" style:(UIAlertActionStyleDefault) handler:nil];
    UIAlertAction *reportAction = [UIAlertAction actionWithTitle:@"举报" style:(UIAlertActionStyleDefault) handler:nil];

    [alertController addAction:cancleAction];
    [alertController addAction:collectAction];
    [alertController addAction:reportAction];

    [[UIApplication sharedApplication].keyWindow.rootViewController presentViewController:alertController animated:YES completion:nil];
}

2> 创建DSCommentViewController控制器+XIB

• XIB里面添加一个tableView，进行一些初始化设置

/** * 初始化设置 */
- (void)setupBasic
{
    self.title = @"评论";

    self.navigationItem.rightBarButtonItem = [UIBarButtonItem itemWithImage:@"comment_nav_item_share_icon" highImage:@"comment_nav_item_share_icon_click" target:self action:@selector(rightBarButtonItemClick)];

    // 设置主题色
    self.tableView.backgroundColor = DSThemeColor;
}

3> 底部工具条键盘监听

在setupBasic方法里面监听：

// 监听键盘frame的改变
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillChangeFrame:) name:UIKeyboardWillChangeFrameNotification object:nil];

/** * 监听键盘改变的通知方法 */
- (void)keyboardWillChangeFrame:(NSNotification *)notification
{
    // 获取键盘的frame
    CGRect keyboardFrame = [notification.userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue];

    // 修改工具条距离底部的间距
    self.bottomSpace.constant = DSScreenH - keyboardFrame.origin.y;

    // 动画时间
    CGFloat duration = [notification.userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];

    // 动画
    [UIView animateWithDuration:duration animations:^{
        [self.view layoutIfNeeded];
    }];
}

/** * 刚开始拖拽的时候就退出键盘 */
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    [self.view endEditing:YES];
}

4> 完成评论界面头部内容显示

这个部分其实用tableview的tableHeaderView来显示就可以了，而不必用自定义cell！而且由于tableHeaderView比较特殊，所以我们对它进行一层包装，用一个UIView包住子控件！

/** * 设置headerView */
- (void)setupHeader
{
    UIView *header = [[UIView alloc] init];

    DSTopicCell *cell = [DSTopicCell cell];
    cell.topic = self.topic;
    cell.size = CGSizeMake(DSScreenW, self.topic.cellHeight);
    [header addSubview:cell];

    header.height = self.topic.cellHeight + DSTopicCellMargin;
    self.tableView.tableHeaderView = header;
}

创建首页cell，然后传递模型，接着设置frame后添加到header里面。这样一点击首页cell，里面就直接可以显示上图所示头部界面了，因为具体的cell实现已经完成！

5> 完成下面cell的header显示

这个分组的头部标题显示本来直接实现titleForHeaderInSection方法就可以的，但是这样显示出来的标题非常难看，不符合需求。其实还有另外一个方法viewForHeaderInSection，这个是返回一个UIView，所以我们可以自定义headerView来显示，里面添加一个label就可以了！

这是最热评论和最新评论的数组模型！

/** * 最热评论 */
@property (nonatomic, strong) NSArray *hotComments;

/** * 最新评论 */
@property (nonatomic, strong) NSMutableArray *latestComments;

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    DSCommentHeaderView *header = [DSCommentHeaderView headerViewWithTableView:tableView];

    NSInteger hotCount = self.hotComments.count;

    if (section == 0) { // 判断第0组是不是最热评论
        header.title = hotCount ? @"热门评论" : @"最新评论";
    }else {
        header.title = @"最新评论";
    }

    return header;
}

DSCommentHeaderView.m就不在重复了，无非是设置模型，init方法创建子控件，然后提供类方法创建自定义cell！

6> 完成自定义评论cell

这个界面也不想再做过多的解析！主要说下其中一些注意点！

• 数据源方法中必须得判断应该显示哪一种cell
• 在自定义cell的XIB中动态设置cell的高度
  
  • 首先设置文字的高度和底部间距为0
  • 然后告诉tableView估算高度，设置tableView自动计算cell尺寸

// cell的高度(首先告诉估算高度,然后自动计算尺寸)
    self.tableView.estimatedRowHeight = 44;
    self.tableView.rowHeight = UITableViewAutomaticDimension;

• 下拉，上拉刷新需要注意事项
  
  • 上拉加载更多数据时，page的注意（添加属性先保存起来，创建局部变量page+1，然后发出请求，如果成功了就赋值给page属性）
  • 下拉page的注意（成功了才设置page = 1）
• 同时下拉，上拉，销毁控制器时，网络请求注意点
  
  • 我们可以在刷新以前清楚之前的所有请求

// 结束之前的所有请求(还能开启任务,取消就会默认调用之前请求的failure这个Block代码)
    [self.manager.tasks makeObjectsPerformSelector:@selector(cancel)];

在控制器销毁时，也是清除所有网络请求，但是这次不一样，应该取消所有网络任务后，不能再开启任务！

这句代码在dealloc方法中完成：

// 取消所有任务(不能再开启任务)
    [self.manager invalidateSessionCancelingTasks:YES];