Building a Dual-Column UICollectionView Using SnapKit in Swift
Use One CollectionView with Two Different Data
When creating an iOS application that needs to present data in a dynamic and visually structured format, UICollectionView is often the go-to solution. This article will walk you through how to build a simple UICollectionView that displays two sets of data side by side — popular stocks on the left and popular funds on the right. We’ll also use SnapKit for concise Auto Layout management.
Overview of the Project
In this project, we are building a custom CollectionSideController
, a UIViewController
subclass that contains a UICollectionView. The collection view will present two columns: one for stocks and one for funds. The data is divided into two arrays: popularStocks
and popularFunds
. These arrays will populate the cells of the collection view.
Project Structure
- DataArray struct: Stores the stock and fund data.
- CollectionSideController: The main view controller that manages the collection view and its layout.
- PopularCell: A custom collection view cell for displaying the data.