Swiftpack.co - Package - nhoogendoorn/CardStack


Swift 5.1 SPM Platforms Git Version license

A SwiftUI package that lets you implement swipable cards in your project.



  • iOS 13.0+
  • Xcode 11.0


The preferred way of installing CardStack is via the Swift Package Manager.

  1. In Xcode, open your project and navigate to FileSwift PackagesAdd Package Dependency...
  2. Paste the repository URL (https://github.com/nhoogendoorn/CardStack) and click Next.
  3. For Rules, select Version (with Up to Next Major).
  4. Click Finish.

Usage example

For a full example see the example project.

Initialize a CardStack view by passing a CardView and CardData. CardView is a protocol that inherits from View and CardData is a protocol that inherits from Identifiable.


The CardData object just needs to have an id, but can for the rest contain any type of data.

import SwiftUI
import CardStack

struct DataExample: CardData {
    var id: String
    var color: Color


The Card View will have access to the data you define as CardData.

import SwiftUI
import CardStack

struct CardExampleView: Card {
    var data: DataExample?
    init<CardData>(data: CardData) where CardData: CardData {
        if let infoData = data as? DataExample {
            self.data = infoData
    var body: some View {
            .frame(width: 200, height: 200)
            .shadow(color: Color.black.opacity(0.1), radius: 3, x: 0, y: 0)


The CardStack is the main container for all the cards.

import SwiftUI
import CardStack

struct StackExampleView: View {
    let items: [DataExample] = [DataExample(id: UUID().uuidString, color: .red),
                 DataExample(id: UUID().uuidString, color: .blue),
                 DataExample(id: UUID().uuidString, color: .yellow),
                 DataExample(id: UUID().uuidString, color: .green),
                 DataExample(id: UUID().uuidString, color: .orange)
    let configuration = StackConfiguration()
    var body: some View {
        CardStack<CardExampleView, DataExample>(configuration: nil, items: items)


In the configuration file you can set the following parameters:

/// The minimum swiping distance before the dragging starts.
var minimumSwipingDistance: CGFloat = 0

/// The number of cards shown in the View at the same time.
var numberOfCardsShown: Int = 3

/// Access the default configuration
static var shared = StackConfiguration()


Niels Hoogendoorn


CardStack is available under the MIT license. See the LICENSE file for more info.


Stars: 0


Used By

Total: 0


Release after clean up of the project - 2020-03-31 15:50:43

  • renamed CardInformation to CardData
  • renamed the Card protocol to CardView
  • cleaned up comments

CardStack first production version - 2020-03-15 15:07:36

The first version of CardStack. Including an example project.

First version of CardStack - 2020-03-15 13:29:34

In this version I added all initial files for CardStack. I'm using this version to test the package in a test project.