Code Quality Rank: L5
Programming language: Swift
License: GNU General Public License v3.0 or later
Tags: UI    
Latest version: v1.0.0

KVCardSelectionVC alternatives and similar libraries

Based on the "UI" category.
Alternatively, view KVCardSelectionVC alternatives based on common mentions on social networks and blogs.

Do you think we are missing an alternative of KVCardSelectionVC or a related project?

Add another 'UI' Library



Awesome looking Dial like card selection ViewController

An updated Swift 3 working version of : https://github.com/atljeremy/JFCardSelectionViewController

What It Looks Like:


How To Use It:


iOS 9+

Swift 3.0+

xCode 8.0+

Basic Example

First create a new class that subclasses KVCardSelectionViewController

import UIKit
import KVCardSelectionVC

class UserSelectionViewController: KVCardSelectionViewController {

    var cards: [User]? {
      didSet {
        // Call `reloadData()` once you are ready to display your `CardPresentable` data or when there have been changes to that data that need to be represented in the UI.

    override func viewDidLoad() {

        // You can set a permanent background by setting a UIImage on the `backgroundImage` property. If not set, the `backgroundImage` will be set using the currently selected Card's `imageURLString`.
        // backgroundImage = UIImage(named: "bg")

        // Set the datasource so that `KVCardSelectionViewController` can get the CardPresentable data you want to dispaly
        dataSource = self

        // Set the delegate so that `KVCardSelectionViewController` can notify the `delegate` of events that take place on the focused CardPresentable.
        delegate = self

        // Set the desired `KVCardSelectionViewSelectionAnimationStyle` to either `.slide` or `.fade`. Defaults to `.fade`.
        selectionAnimationStyle = .slide

        // Call up to super after configuring your subclass of `KVCardSelectionViewController`. Calling super before configuring will cause undesirable side effects.


    override func viewWillAppear(animated: Bool) {

        NOTE: If you are displaying an instance of `KVCardSelectionViewController` within a `UINavigationController`, you can use the code below to hide the navigation bar. This isn't required to use `KVCardSelectionViewController`, but `KVCardSelectionViewController` was designed to be used without a UINavigationBar.
        let image = UIImage()
        let navBar = navigationController?.navigationBar
        navBar?.setBackgroundImage(image, for: .default)
        navBar?.shadowImage = image

        // Load your dynamic CardPresentable data
        cards = [
          User(name: "Jennifer Adams", photoURL: "https://s-media-cache-ak0.pinimg.com/736x/5d/43/0b/5d430bd15603971c939fcc9a4358a35f.jpg", address: "123 Main St", city: "Atlanta", state: "GA", zip: 12345),
          User(name: "Jim Adel", photoURL: "http://a3.files.blazepress.com/image/upload/c_fit,cs_srgb,dpr_1.0,q_80,w_620/MTI4OTkyOTM4OTM5MTYxMDU0.jpg", address: "234 Main St", city: "Atlanta", state: "GA", zip: 12345),
          User(name: "Jane Aden", photoURL: "https://s-media-cache-ak0.pinimg.com/236x/b7/65/2d/b7652d8c4cf40bc0b1ebac37bb254fcb.jpg", address: "345 Main St", city: "Atlanta", state: "GA", zip: 12345),
          User(name: "Avery Adil", photoURL: "http://boofos.com/wp-content/uploads/2013/02/Celebrity-Portraits-by-Andy-Gotts-10.jpg", address: "456 Main St", city: "Atlanta", state: "GA", zip: 12345),
          User(name: "Jamar Baar", photoURL: "https://s-media-cache-ak0.pinimg.com/736x/85/e3/8a/85e38ab9e480790e216c4f9359bb677f.jpg", address: "567 Main St", city: "Atlanta", state: "GA", zip: 12345),
          User(name: "Steven Babel", photoURL: "http://blog.picr.com/wp-content/uploads/2015/09/Andy-Gotts.jpeg", address: "678 Main St", city: "Atlanta", state: "GA", zip: 12345)

Second, conform to the KVCardSelectionViewControllerDelegate and KVCardSelectionViewControllerDataSource protocols so that you can provide the CardPresentable data to the KVCardSelectionViewController and to receive callbacks of touch events in the action buttons.

extension UserSelectionViewController: KVCardSelectionViewControllerDataSource {
    public func cardSelectionViewController(_ cardSelectionViewController: KVCardSelectionViewController, cardForItemAtIndexPath indexPath: IndexPath) -> CardPresentable {
        return cards[indexPath.row]

    func numberOfCardsForCardSelectionViewController(_ cardSelectionViewController: KVCardSelectionViewController) -> Int {
        return cards.count


extension UserSelectionViewController: KVCardSelectionViewControllerDelegate {

    func cardSelectionViewController(_ cardSelectionViewController: KVCardSelectionViewController, didSelectCardAction cardAction: CardAction, forCardAtIndexPath indexPath: IndexPath) {
        let card = cards[(indexPath as NSIndexPath).row]
        if let action = card.actionOne , action.title == cardAction.title {
            print("----------- \nCard action fired! \nAction Title: \(cardAction.title) \nIndex Path: \(indexPath)")
        if let action = card.actionTwo , action.title == cardAction.title {
            print("----------- \nCard action fired! \nAction Title: \(cardAction.title) \nIndex Path: \(indexPath)")

    func cardSelectionViewController(_ cardSelectionViewController: KVCardSelectionViewController, didSelectDetailActionForCardAtIndexPath indexPath: IndexPath) {
        print("CARD SELECTED for \(indexPath)")

Then, in the models you want to be presentable within the card selection view controller, just have them conform to the CardPresentable protocol.

struct User {
    var name: String
    var photoURL: String
    var address: String
    var city: String
    var state: String
    var zip: Int

extension User: CardPresentable {

    var imageURLString: String {
        return photoURL

    var placeholderImage: UIImage? {
        return UIImage(named: "default")

    var titleText: String {
        return name

    var detailTextLineOne: String {
        return address

    var detailTextLineTwo: String {
        return "\(city), \(state) \(zip)"

    var actionOne: CardAction? {
        return CardAction(title: "Call")

    var actionTwo: CardAction? {
        return CardAction(title: "Email")




pod 'KVCardSelectionVC'


Check Example Folder for the same.


KVCardSelectionVC has dependencies on pod 'Try' and pod 'Kingfisher'

Try is used for handling NSExceptions which swift cannot handle.

Kingfisher is used for Image downloading and cache.

The max size of cache is 50 Mb and cache expiry is one week.

Images Not Showing/Downloading

Quick Fix - Add Allow Arbitrary Loads to your project's Info.plist


Distributed under the MIT license. See LICENSE for more information.

*Note that all licence references and agreements mentioned in the KVCardSelectionVC README section above are relevant to that project's source code only.