一、概述
通過學(xué)習(xí)前面筆者提供的兩種方法來實現(xiàn)類似微信朋友圈的評論回復(fù)功能
后,首先,筆者來分析兩者兩者的優(yōu)缺點,以及兩者的使用場景。其次,筆者將通過方式一即用段頭+Cell+段尾
的方法來實戰(zhàn)優(yōu)酷視頻的評論回復(fù)功能,主要分析里面的業(yè)務(wù)邏輯
和數(shù)據(jù)處理
以及細節(jié)處理
。最后,希望能為廣大開發(fā)者提供一點思路,少走一些彎路,填補一些細坑。
-
方式一:使用
段頭+Cell+段尾
,推薦使用- 優(yōu)點:
評論回復(fù)cell(MHCommentCell)
發(fā)揮出了UITableViewCell
的重用機制;評論回復(fù)cell(MHCommentCell)
的事件傳遞相比方式二少了一層嵌套;ModelFrame
的計算針對性強。 - 缺點:要實現(xiàn)
tableView
代理的- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
以及- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section
方法,以及設(shè)置對應(yīng)的高度,代碼上略微繁瑣。 - 使用場景:支持無限評論回復(fù)的情況下。
- 優(yōu)點:
-
方式二:使用
UITableViewCell嵌套UITableView
- 優(yōu)點:控制器的代碼相比方式一的簡單。
- 缺點:外層的
UITableView
發(fā)揮了重用機制,但是Cell
嵌套的UITableView
未發(fā)揮重用機制,如果有1000條評論回復(fù),那么嵌套的UITableView
的Cell(MHCommentCell)
就得創(chuàng)建1000次,相當(dāng)不合理,性能不好;ModelFrame
的計算稍微復(fù)雜,實現(xiàn)的計算好內(nèi)層嵌套的tableView
的尺寸;評論回復(fù)cell(MHCommentCell)
的事件傳遞,存在兩層代理嵌套。 - 使用場景:顯示評論回復(fù)有限的情況下。
-
傳送門
二、效果圖
三、頁面分析
- 效果圖
圖中字符對應(yīng)的
Controller
A:MHYouKuController
B:MHYouKuTopicController (紅色框區(qū)域)
C:MHYouKuTopicDetailController
D:MHYouKuCommentController
注意:文章統(tǒng)一用字符
代替對應(yīng)的Controller
,怪我懶,望體諒。評論面板(
MHYouKuInputPanelView
)
四、需求分析
-
A
控制器和B
控制器的的評論數(shù)據(jù)來源問題。
首先,A
控制器和B
控制器存在父子關(guān)系
,即:[A addChildViewController:B]
,具體使用細節(jié)請參考文末的Demo鏈接。其次,A
控制器里面的tableView
無法支持下拉刷新
和上拉加載
功能,B
控制器里面的tableView
支持的,這種需求在視頻類App非常常見,A
控制器只是顯示部分評論數(shù)據(jù),點擊評論數(shù)按鈕跳轉(zhuǎn)到B
控制器來顯示更多評論數(shù)據(jù)數(shù)據(jù)。終上所述,筆者采取的是在B
控制器里面一旦下拉刷新獲取數(shù)據(jù)后,通過代理或者通知,將評論數(shù)據(jù)回調(diào)給A
控制器處理即可(PS:筆者在此采用的通知:MHCommentRequestDataSuccessNotification
)。
數(shù)據(jù)來源@2x.png -
評論Cell顯示
查看全部xx條回復(fù)
的實現(xiàn)問題。
筆者這里采取了一種巧妙的方式,配置一個前端事先制定的MHComment
即可。詳細配置如下/** topic --- topicFrame */ - (MHTopicFrame *)_topicFrameWithTopic:(MHTopic *)topic { // 這里要判斷評論個數(shù)大于2 顯示全部評論數(shù) if (topic.commentsCount>2) { // 設(shè)置假數(shù)據(jù) MHComment *comment = [[MHComment alloc] init]; // MHAllCommentsId是前端設(shè)定的 comment.commentId = MHAllCommentsId; comment.text = [NSString stringWithFormat:@"查看全部%zd條回復(fù)" , topic.commentsCount]; // 添加假數(shù)據(jù) [topic.comments addObject:comment]; } MHTopicFrame *topicFrame = [[MHTopicFrame alloc] init]; // 傳遞話題模型數(shù)據(jù),計算所有子控件的frame topicFrame.topic = topic; return topicFrame; }
-
若
D
控制器對視頻,評論成功后,A
控制器和B
控制器的數(shù)據(jù)同步問題(即:兩者在評論數(shù)據(jù)上保持一致,從而保證在界面上顯示一致)。
點擊A
控制器和B
控制器的評論框,即可跳轉(zhuǎn)到D
控制器,即D
控制器是一對多的關(guān)系。若D
控制器對視頻評論成功后,筆者通過通知(通知名字:MHCommentSuccessNotification
)的方式,來告知A
和B
控制器作相應(yīng)的操作即可。
視頻評論@2x.png -
若對
A
和B
以及C
控制器里面的某個視頻評論進行回復(fù)或者針對某條視頻評論的回復(fù)進行評論,如何保證A
控制器和B
控制器的數(shù)據(jù)同步問題(即:兩者在評論數(shù)據(jù)上保持一致,從而保證在界面上顯示一致)。
關(guān)鍵:A
和B
以及C
控制器持有的是同一個模型(MHTopicFrame
),這樣我們無論對數(shù)據(jù)做了任何操作,只要監(jiān)聽到改變時,刷新數(shù)據(jù)源方法即可。
評論Or回復(fù)@2x.png -
視頻評論和回復(fù)成功后的數(shù)據(jù)處理問題。
由于查看全部xx條回復(fù)
是前端自己配置,伴隨著視頻的評論Or回復(fù)成功后,數(shù)據(jù)需要做相應(yīng)的判斷(MHYouKuInputPanelViewDelegate
)。- (void) inputPanelView:(MHYouKuInputPanelView *)inputPanelView attributedText:(NSString *)attributedText { // 發(fā)送評論 模擬網(wǎng)絡(luò)發(fā)送 dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(.25f * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ // 評論或者回復(fù)成功 MHComment *comment = [[MHComment alloc] init]; comment.mediabase_id = self.mediabase_id; comment.commentId = [NSString stringWithFormat:@"%zd",[NSObject mh_randomNumber:0 to:100]]; comment.text = attributedText; comment.creatTime = [NSDate mh_currentTimestamp]; MHUser *fromUser = [[MHUser alloc] init]; fromUser.userId = [AppDelegate sharedDelegate].account.userId ; fromUser.avatarUrl = [AppDelegate sharedDelegate].account.avatarUrl; fromUser.nickname = [AppDelegate sharedDelegate].account.nickname; comment.fromUser = fromUser; // 只有回復(fù) toUser 有值 if (inputPanelView.commentReply.isReply) { MHUser *toUser = [[MHUser alloc] init]; toUser.avatarUrl = inputPanelView.commentReply.user.avatarUrl; toUser.userId = inputPanelView.commentReply.user.userId; toUser.nickname = inputPanelView.commentReply.user.nickname; comment.toUser = toUser; } // 這里需要插入假數(shù)據(jù) 提高用戶的體驗度 MHCommentFrame* newCommentFrame = [[MHTopicManager sharedManager] commentFramesWithComments:@[comment]].lastObject; // 這里要插入話題數(shù)據(jù)源中去 // 修改評論回復(fù)數(shù)目 self.selectedTopicFrame.topic.commentsCount = self.selectedTopicFrame.topic.commentsCount + 1; // 判斷數(shù)據(jù) if (self.selectedTopicFrame.topic.comments.count>2) // 有查看全部xx條回復(fù) // 插入數(shù)據(jù) NSInteger count = self.selectedTopicFrame.commentFrames.count; NSInteger index = count - 1; [self.selectedTopicFrame.commentFrames insertObject:newCommentFrame atIndex:index]; [self.selectedTopicFrame.topic.comments insertObject:comment atIndex:index]; // 取出最后一條數(shù)據(jù) 就是查看全部xx條回復(fù) 修改為xx+1條即可 MHComment *lastComment = self.selectedTopicFrame.topic.comments.lastObject; lastComment.text = [NSString stringWithFormat:@"查看全部%zd條回復(fù)" , self.selectedTopicFrame.topic.commentsCount]; }else if (self.selectedTopicFrame.topic.comments.count == 2) { // 添加數(shù)據(jù)源 [self.selectedTopicFrame.commentFrames addObject:newCommentFrame]; [self.selectedTopicFrame.topic.comments addObject:comment]; // 設(shè)置假數(shù)據(jù) MHComment *lastComment = [[MHComment alloc] init]; lastComment.commentId = MHAllCommentsId; lastComment.text = [NSString stringWithFormat:@"查看全部%zd條回復(fù)" , self.selectedTopicFrame.topic.commentsCount]; MHCommentFrame *lastCommentFrame = [[MHTopicManager sharedManager] commentFramesWithComments:@[lastComment]].lastObject; // 添加假數(shù)據(jù) [self.selectedTopicFrame.commentFrames addObject:lastCommentFrame]; [self.selectedTopicFrame.topic.comments addObject:lastComment]; }else{ // <2的情況 直接添加即可 // 添加數(shù)據(jù)源 [self.selectedTopicFrame.commentFrames addObject:newCommentFrame]; [self.selectedTopicFrame.topic.comments addObject:comment]; } // 發(fā)送評論回復(fù)成功的通知 [MHNotificationCenter postNotificationName:MHCommentReplySuccessNotification object:nil userInfo:@{MHCommentReplySuccessKey:self.selectedTopicFrame}]; }; }
五、期待
- 文章若對您有點幫助,請給個喜歡??,畢竟碼字不易;若對您沒啥幫助,請給點建議??,切記學(xué)無止境。
- 針對文章所述內(nèi)容,閱讀期間任何疑問;請在文章底部評論指出,我會火速解決和修正問題。
- GitHub地址:https://github.com/CoderMikeHe