1.問題提出

        在開發(fā)即時(shí)通訊項(xiàng)目時(shí)會遇到一個(gè)需求，那就是開發(fā)一個(gè)表情鍵盤。這時(shí)候?qū)崿F(xiàn)的方法有好多種，大部分人會考慮用UIScrollView實(shí)現(xiàn)，但是當(dāng)表情有200個(gè)的時(shí)候，UIScrollView的button難道就要創(chuàng)建200個(gè)么？考慮到按鈕重用的，自然想到UICollectionView。想實(shí)現(xiàn)表情數(shù)據(jù)橫排橫滾動，可能會遇到設(shè)置cell的數(shù)據(jù)源的坑。

筆者數(shù)據(jù)源文件.plist長這樣：

當(dāng)時(shí)這樣設(shè)置過:

    UICollectionViewFlowLayout *layout = [UICollectionViewFlowLayout new];    layout.scrollDirection = UICollectionViewScrollDirectionHorizontal; //橫排滾動    layout.itemSize = CGSizeMake(itemWidth, kOneItemHeight);- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{    YHExPRessionAddCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell1" forIndexPath:indexPath];    NSLog(@"%ld",(long)indexPath.item);    if (indexPath.item < self.dataArray.count) {        cell.model = self.dataArray[indexPath.item];    }    return cell;}
我理想的界面是：                              
    
        
 但實(shí)際運(yùn)行的界面：           
  
   仔細(xì)想想，就是cellForItemAtIndexPath設(shè)置錯(cuò)誤。那么如何正確地實(shí)現(xiàn)表情數(shù)據(jù)橫排橫滾動呢，請看下文。
2.解決方法
一：獲取數(shù)據(jù)
變量：
kOnePageCount：一頁顯示的表情數(shù)量
emoticonGroupPageIndexs:各表情組起始頁下標(biāo)數(shù)組
emoticonGroupTotalPageCount：表情組總頁數(shù)
情景：
假設(shè)一頁顯示20個(gè)表情，1個(gè)刪除按鈕。現(xiàn)在有兩個(gè)表情組A,B.其中A有6頁，B有2頁
則
kOnePageCount = 20;
emoticonGroupPageIndexs = @[0,6];
emoticonGroupTotalPageCount = 8;
算法：
    _emoticonGroups = [YHExpressionHelper emoticonGroups];   //獲取各表情組起始頁下標(biāo)數(shù)組    NSMutableArray *indexs = [NSMutableArray new];    NSUInteger index = 0;    for (YHEmoticonGroup *group in _emoticonGroups) {        [indexs addObject:@(index)];        NSUInteger count = ceil(group.emoticons.count / (float)kOnePageCount);        if (count == 0) count = 1;        index += count;    }    _emoticonGroupPageIndexs = indexs;       //表情組總頁數(shù)    NSMutableArray *pageCounts = [NSMutableArray new];    _emoticonGroupTotalPageCount = 0;    for (YHEmoticonGroup *group in _emoticonGroups) {        NSUInteger pageCount = ceil(group.emoticons.count / (float)kOnePageCount);        if (pageCount == 0) pageCount = 1;        [pageCounts addObject:@(pageCount)];        _emoticonGroupTotalPageCount += pageCount;    }    _emoticonGroupPageCounts = pageCounts;
二:設(shè)置UICollectionView 數(shù)據(jù)源
//表情組總頁數(shù) (eg:有兩個(gè)表情組A,B.其中A有6頁，B有2頁。則_emoticonGroupTotalPageCount = 8)- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {    return _emoticonGroupTotalPageCount;}//一頁顯示的表情數(shù)量- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {    return kOnePageCount + 1; // “1”是刪除按鈕}//設(shè)置Cell- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {        YHEmoticonCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];    if (indexPath.row == kOnePageCount) {        cell.isDelete = YES;        cell.emoticon = nil;    } else {        cell.isDelete = NO;        cell.emoticon = [self _emoticonForIndexPath:indexPath];    }    return cell;}- (YHEmoticon *)_emoticonForIndexPath:(NSIndexPath *)indexPath {    NSUInteger section = indexPath.section;    for (NSInteger i = _emoticonGroupPageIndexs.count - 1; i >= 0; i--) {        NSNumber *pageIndex = _emoticonGroupPageIndexs[i];        if (section >= pageIndex.unsignedIntegerValue) {            YHEmoticonGroup *group = _emoticonGroups[i];            NSUInteger page = section - pageIndex.unsignedIntegerValue;            NSUInteger index = page * kOnePageCount + indexPath.row;                        // transpose line/row            NSUInteger ip = index / kOnePageCount;            NSUInteger ii = index % kOnePageCount;            NSUInteger reIndex = (ii % 3) * 7 + (ii / 3);            index = reIndex + ip * kOnePageCount;                        if (index < group.emoticons.count) {                return group.emoticons[index];            } else {                return nil;            }        }    }    return nil;}DuangDuang，成功運(yùn)行并顯示出我想要的界面。
另外可以參考我的Demo：(喜歡的點(diǎn)個(gè)贊哦O(∩_∩)O哈哈哈~)
仿微信表情鍵盤