RxDataSources 使用分区

174 阅读1分钟

1、使用自定义的SectionModel

///自定义SectionModel
struct CustomSectionModel {
    var header: String
    var items: [MyItem]
}

extension CustomSectionModel: SectionModelType {
    typealias MyItem = CustomDataModel

    init(original: CustomSectionModel, items: [CustomDataModel]) {
        self = original
        self.items = items
    }
}

///自定义数据model
struct CustomDataModel {
  var age: Int
  var name: String
  var location: CGPoint
}

2、创建数据源

let items = Observable.just([
            CustomSectionModel(
                header: "section1",
                items: [CustomDataModel(age: 10, name: "name10", location: .zero),
                        CustomDataModel(age: 10, name: "name11", location: .zero),
                        CustomDataModel(age: 10, name: "name12", location: .zero),
                        CustomDataModel(age: 10, name: "name13", location: .zero)]),
            CustomSectionModel(
                header: "section2",
                items: [CustomDataModel(age: 10, name: "name20", location: .zero),
                        CustomDataModel(age: 10, name: "name21", location: .zero)]),
            CustomSectionModel(
                header: "section3",
                items: [CustomDataModel(age: 10, name: "name30", location: .zero)]),
            CustomSectionModel(
                header: "section4",
                items: [CustomDataModel(age: 10, name: "name40", location: .zero)])
        ])

3、调用

let dataSource = RxTableViewSectionedReloadDataSource<CustomSectionModel>(configureCell: { dataSoure, tableview, IndexPath, element in
            let cell = tableview.dequeueReusableCell(withIdentifier: "cell")
            cell?.textLabel?.text = "\(IndexPath.row):\(element.name)"
            return cell!
        },titleForHeaderInSection: { dataSource , IndexPath in
            //多分区的 UITableView
            return dataSource.sectionModels[IndexPath].header
        })
        items.bind(to: self.myTable.rx.items(dataSource: dataSource)).disposed(by: disposeBag)

4、运行效果

image.png