iglistkit

IGListKit探索 - 1 基本使用

2016-12-27  本文已影响2287人  DoKeer

之前一直觉得Instagram的iOS APP首页的流畅度非常不错。现在他们开源了这个IGListKit框架,总要好好研究研究。

IGListKitDemo.png

核心架构比较清晰。每一个条目就是一种sectionController(如图黄色框内)。每个section对应一个Item。具体结构如下

81DB540E-36D4-4D3F-8651-A8EDC7A6BDC9.png

框架的文档很详细但是是英文版的。

# Latest release of IGListKit
pod 'IGListKit', '~> 2.0.0'

# Use the master branch (we use this at Instagram)
pod 'IGListKit', :git => 'https://github.com/Instagram/IGListKit.git', :branch => 'master'

使用很简单。新建ViewController和someSectionController 继承
IGListSectionController并遵守IGListSectionType。

viewController中设置UI

let layout = UICollectionViewFlowLayout()
let collectionView = IGListCollectionView(frame: .zero, collectionViewLayout: layout)

let updater = IGListAdapterUpdater()
let adapter = IGListAdapter(updater: updater, viewController: self, workingRangeSize: 0)
//set方法调用数据源更新操作 把objects(for listAdapter: IGListAdapter) -> [IGListDiffable] 方法设置的数据传给cectionController
adapter.collectionView = collectionView

接下来设置数据,根据预先分好的组。

func objects(for listAdapter: IGListAdapter) -> [IGListDiffable] {
  // this can be anything!
  return [ "Foo", "Bar", 42, "Biz" ]
}

func listAdapter(_ listAdapter: IGListAdapter, sectionControllerFor object: Any) -> IGListSectionController {
  //根据需求返回不同的sectionController
  return someSectionController()
}
//没有数据时,显示的自定义view
func emptyView(for listAdapter: IGListAdapter) -> UIView? {
  return nil
}

- (void)updateBackgroundViewWithItemCount:(NSUInteger)itemCount {
    UIView *backgroundView = [self.dataSource emptyViewForListAdapter:self];
    // don't do anything if the client is using the same view
    if (backgroundView != _collectionView.backgroundView) {
        // collection view will just stack the background views underneath each other if we do not remove the previous
        // one first. also fine if it is nil
        [_collectionView.backgroundView removeFromSuperview];
        _collectionView.backgroundView = backgroundView;
    }
    _collectionView.backgroundView.hidden = itemCount > 0;
}

//someSectionController中设置数据
  func numberOfItems() -> Int {
        return 4
    }
//section中每一行高
    func sizeForItem(at index: Int) -> CGSize {
        return CGSize(width: collectionContext!.containerSize.width, height: 105)
    }

//collectionContext属性 获取到objects(for listAdapter: IGListAdapter) -> [IGListDiffable]  中设置的data
    func cellForItem(at index: Int) -> UICollectionViewCell {
        let cell = collectionContext!.dequeueReusableCell(of: LabelCell.self, for: self, at: index) as! LabelCell
        let section = collectionContext!.section(for: self)
        cell.label.text = "Section \(section), cell \(index)"
        return cell
    }

    func didUpdate(to object: Any) {}

    func didSelectItem(at index: Int) {}

上一篇下一篇

猜你喜欢

热点阅读