- April 27, 2024
- Mins Read
A generic small reusable components for data source implementation for UITableView
/UICollectionView
written in Swift.
BasicDataSource
easily bind model to cells with automatic dequeuing.SegmentedDataSource
easily build segmented controls or for empty state of your UICollectionView
/UITableView
data source.CompositeDataSource
builds complex cells/models structure with easy to use components (BasicDataSource
SegmentedDataSource
or ther CompositeDataSource
).UICollectionView
supplementary, UITableView
header, and footer views support.UIKit
classes.To integrate GenericDataSource
into your Xcode project using CocoaPods, specify it in your Podfile
:
pod ‘GenericDataSources’
IMPORTANT: The pod name is GenericDataSources with “s” at the end.
To integrate GenericDataSource into your Xcode project using Carthage, specify it in your Cartfile:
github “GenericDataSource/GenericDataSource”
Add GenericDataSource.xcodeproj
to your project file by drag and drop.
You can then consult to Adding an Existing Framework to a Project.
Create a basic data source and bind it to to a table view.
let dataSource = BasicBlockDataSource<Example, BasicTableViewCell>() { (item: Example, cell: BasicTableViewCell, indexPath) -> Void in
cell.titleLabel?.text = item.title
}
// Need to keep a strong reference to our data source.
self.dataSource = dataSource
// register the cell
tableView.ds_register(cellClass: BasicTableViewCell.self)
// bind the data source to the table view
tableView.ds_useDataSource(dataSource)
dataSource.items = <<retrieve items>> // Can be set and altered at anytime
That’s it! Your first data source is implemented. No dequeuing! no casting! simple and smart.
Let’s now take it to the next level. Suppose after we implemented it, the requirements changed and we need to implement it using UICollectionView
.
let dataSource = BasicBlockDataSource<Example, BasicCollectionViewCell>() { (item: Example, cell: BasicCollectionViewCell, indexPath) -> Void in
cell.titleLabel?.text = item.title
}
// Need to keep a strong reference to our data source.
self.dataSource = dataSource
// register the cell
collectionView.ds_register(cellClass: BasicCollectionViewCell.self)
// bind the data source to the collection view
collectionView.ds_useDataSource(dataSource)
dataSource.items = <<retrieve items>> // Can be set and altered at anytime
All you need to do is change the cell class and of course the table view to collection view.
Actually this opens the door for so much possibilities. You can inherit from BasicDataSource
and implement your custom generic data source that is based on a protocol implemented by the cell and you don’t need to repeat the configuration part. You would create data source like that.
let dataSource1 = CustomDataSource<BasicTableViewCell>() // for table view
let dataSource2 = CustomDataSource<BasicCollectionViewCell>() // for collection view
Suppose we want to implement the following screen, the App Store featured tab.
If you want to have a look at the complete source code, it is under Example project -> AppStoreViewController.swift
.
BasicDataSource
).CompositeDataSource(sectionType: .single)
for the table view rows. Since these rows are of different cell types.SegmentedDataSource
for switching between loading and data views.SegmentedDataSource
data source to the table view and that’s it.One thing we didn’t talk about is the UICollectionView
of the featured section cells. It’s very simple, just BasicDataSource
.
See how we can implement the screen in the following code:
class AppStoreFeaturedSectionTableViewCell: UITableViewCell { … }
class AppStoreQuickLinkLabelTableViewCell: UITableViewCell { … }
class AppStoreQuickLinkTableViewCell: UITableViewCell { … }
class AppStoreFooterTableViewCell: UITableViewCell { … }
class AppStoreLoadingTableViewCell: UITableViewCell { … }
BasicDataSource
s.
class AppStoreLoadingDataSource: BasicDataSource<Void, AppStoreLoadingTableViewCell> {
// loading should take full screen size.
override func ds_collectionView(_ collectionView: GeneralCollectionView, sizeForItemAt indexPath: IndexPath) -> CGSize {
return collectionView.size
}
}
class AppStoreFooterDataSource: BasicDataSource<Void, AppStoreFooterTableViewCell> { … }
class AppStoreQuickLinkDataSource: BasicDataSource<FeaturedQuickLink, AppStoreQuickLinkTableViewCell> { … }
class AppStoreFeaturedAppsDataSource: BasicDataSource<FeaturedApp, AppStoreFeaturedAppCollectionViewCell> { … }
class AppStoreFeaturedAppsSectionDataSource: BasicDataSource<FeaturedSection, AppStoreFeaturedSectionTableViewCell> { … }
class AppStoreQuickLinkLabelDataSource: BasicDataSource<String, AppStoreQuickLinkLabelTableViewCell> { … }
CompositeDataSource
that holds the featured page.
class AppStoreFeaturedPageDataSource: CompositeDataSource {
init() { super.init(sectionType: .single)] }
var page: FeaturedPage? {
didSet {
// remove all existing data sources
removeAllDataSources()
guard let page = page else {
return
}
// add featured apps
let featuredApps = AppStoreFeaturedAppsSectionDataSource()
featuredApps.setSelectionHandler(UnselectableSelectionHandler())
featuredApps.items = page.sections
add(featuredApps)
// add quick link label
let quickLinkLabel = AppStoreQuickLinkLabelDataSource()
quickLinkLabel.setSelectionHandler(UnselectableSelectionHandler())
quickLinkLabel.items = [page.quickLinkLabel]
add(quickLinkLabel)
// add quick links
let quickLinks = AppStoreQuickLinkDataSource()
quickLinks.items = page.quickLinks
add(quickLinks)
// add footer
let footer = AppStoreFooterDataSource()
footer.setSelectionHandler(UnselectableSelectionHandler())
footer.items = [Void()] // we add 1 element to show the footer, 2 elements will show it twice. 0 will not show it.
add(footer)
}
}
}
class AppStoreDataSource: SegmentedDataSource {
let loading = AppStoreLoadingDataSource()
let page = AppStoreFeaturedPageDataSource()
// reload data on index change
override var selectedDataSourceIndex: Int {
didSet {
ds_reusableViewDelegate?.ds_reloadData()
}
}
override init() {
super.init()
loading.items = [Void()] // we add 1 element to show the loading, 2 elements will show it twice. 0 will not show it.
add(loading)
add(page)
}
}
tableView.ds_register(cellNib: AppStoreFeaturedSectionTableViewCell.self)
tableView.ds_register(cellNib: AppStoreQuickLinkLabelTableViewCell.self)
tableView.ds_register(cellNib: AppStoreQuickLinkTableViewCell.self)
tableView.ds_register(cellNib: AppStoreFooterTableViewCell.self)
tableView.ds_register(cellNib: AppStoreLoadingTableViewCell.self)
tableView.ds_useDataSource(dataSource)
// show loading indicator
dataSource.selectedDataSourceIndex = 0
// get the data from the service
service.getFeaturedPage { [weak self] page in
// update the data source model
self?.dataSource.page.page = page
// show the page
self?.dataSource.selectedDataSourceIndex = 1
}
There are many benefits of doing that:
UITableView
and UICollectionView
without touching data sources or models. Only change the cells to inherit from UITableViewCell
or UICollectionViewCell
and everything else works.add
of data sources calls.if
/else
in our code.Check the Examples application for complete implementations.
Horizon SDK is a state of the art real-time video recording / photo shooting iOS library. Some of the features ...