CollectionViewIndex
View that replicates the built in UITableView
section index, but for use in UICollectionView
.
UITableView
uses a private class called UITableViewIndex
to provide this behavior. CollectionViewIndex
follows the same naming convention.
Installation
Install with CocoaPods by adding the following to your Podfile:
use_frameworks!
pod 'CollectionViewIndex'
Then run:
pod install
Usage
Create an instance of CollectionViewIndex
and add it to the superview of, and in front of, your
UICollectionView
instance:
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(collectionView)
view.addSubview(collectionViewIndex)
let views: [String: AnyObject] = [
"topLayoutGuide": topLayoutGuide,
"bottomLayoutGuide": bottomLayoutGuide,
"collectionView": collectionView,
"collectionViewIndex": collectionViewIndex,
]
view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("|[collectionView]|", options: [], metrics: nil, views: views))
view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[collectionView]|", options: [], metrics: nil, views: views))
view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("[collectionViewIndex]|", options: [], metrics: nil, views: views))
view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:[topLayoutGuide][collectionViewIndex][bottomLayoutGuide]", options: [], metrics: nil, views: views))
}
Like UILabel
, CollectionViewIndex
needs to know its height before it can know how wide it must be. When
using Auto Layout, you can set the object’s preferredMaxLayoutHeight
like so:
override func viewWillLayoutSubviews() {
super.viewWillLayoutSubviews()
collectionViewIndex.preferredMaxLayoutHeight = view.bounds.height - topLayoutGuide.length - bottomLayoutGuide.length
}
Your collection view layout may need to know the width of the CollectionViewIndex
object. If so, you can inform it when layout completes:
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
collectionViewLayout.indexWidth = collectionViewIndex.bounds.width
}
CollectionViewIndex
sends a UIControlEvent.ValueChanged
event when the user interacts with it. You
register the target-action method in this way:
collectionViewIndex.addTarget(self, action: "selectedIndexDidChange:", forControlEvents: .ValueChanged)
func selectedIndexDidChange(collectionViewIndex: CollectionViewIndex) {
print("User selected index \(collectionViewIndex.selectedIndex)")
}
You’ll probably want to jump to a section of the collection view in response to that event. If your section headers pin to visible bounds, be sure to take them into account when scrolling.
License
CollectionViewIndex is released under the MIT license. See LICENSE for details.