🃏 Tinder like card interface

Related tags

Cards swift ios ui cards generic
Overview

Version License twitter: @dylan36032

image

Features

  • Swift 3
  • Custom views for the card & overlay
  • Generic
  • Dynamically add new cards on top or on the bottom
  • Lazy view loading

Setup

pod 'DMSwipeCards'

Usage

First import the module:

import DMSwipeCards

Next create an instance of a DMSwipeCardsView:
(Element can be your custom model, or just String)

let swipeView = DMSwipeCardsView<Element>(frame: frame,
                                          viewGenerator: viewGenerator,
                                          overlayGenerator: overlayGenerator)

Views get loaded lazy, so you have to provide DMSwipeCardsView with a ViewGenerator and optionally an OverlayGenerator.

let viewGenerator: (String, CGRect) -> (UIView) = { (element: Element, frame: CGRect) -> (UIView) in
  // return a UIView here
}

let overlayGenerator: (SwipeMode, CGRect) -> (UIView) = { (mode: SwipeMode, frame: CGRect) -> (UIView) in
  // return a UIView here
}

Adding cards

To add new cards, just call the addCards method with an array of the previously defined Element:

swipeView.addCards([Element], onTop: true)

Delegate

DMSwipeCardsView has a delegate property so you can get informed when a card has been swipped. The delegate has to implement following methods:

func swipedLeft(_ object: Any)
func swipedRight(_ object: Any)
func cardTapped(_ object: Any)
func reachedEndOfStack()

The object parameter is guarenteed to have the type Element. Sadly generics don't work here.

Example

For a nice working demo sample, please take a look the Example project.
To run the example, first run pod install in the Example directory.

Credits

Loosly based on TinderSimpleSwipeCards

You might also like...
This UI attempts to capture the Quibi Card Stack and the associated User Interaction.
This UI attempts to capture the Quibi Card Stack and the associated User Interaction.

RGStack This UI attempts to capture the Quibi Card Stack and the associated User Interaction. Required A View that conforms to the ConfigurableCard pr

RGeleta 96 Dec 18, 2022
Card-based view controller for apps that display content cards with accompanying maps, similar to Apple Maps.

TripGo Card View Controller This is a repo for providing the card-based design for TripGo as well as the TripKitUI SDK by SkedGo. Specs 1. Basic funct

SkedGo 6 Oct 15, 2022
Card flip animation by pan gesture.

CardAnimation Design from Dribble. 实现思路在这里。 Two Solutions At the begin, I didn't encapsulate code, @luxorules refactor code into class and improve it

null 1.2k Dec 14, 2022
Cusom CollectionView card layout
Cusom CollectionView card layout

MMCardView Example To run the example project, clone the repo, and run pod install from the Example directory first. Demo 1.Card Requirements iOS 8.0+

Millman Yang 556 Dec 5, 2022
:star: Custom card-designed CollectionView layout

CardsLayout CardsLayout is a lightweight Collection Layout. Installation CocoaPods You can use CocoaPods to install CardsLayout by adding it to your P

Filipp Fediakov 798 Dec 28, 2022
An iOS library to create beautiful card transitions.
An iOS library to create beautiful card transitions.

CSCardTransition CSCardTransition is a small library allowing you to create wonderful push and pop transition animations like in the App Store. It wor

Creastel 5 Jan 14, 2022
SimpleCardView-SwiftUI is a very simple card view written with SwiftUI
SimpleCardView-SwiftUI is a very simple card view written with SwiftUI

SimpleCardView-SwiftUI is a very simple card view written with SwiftUI

Tomortec 3 May 19, 2022
GLScratchCard - Scratch card effect
GLScratchCard - Scratch card effect

I loved the way payments app's like Google pay and PhonePe used scratch card option to reward it's user. Hence with 💛 cloned the same scratch card effect for you guys out there

Gokul 84 Dec 5, 2022
🃏 Tinder like card interface
🃏 Tinder like card interface

Features Swift 3 Custom views for the card & overlay Generic Dynamically add new cards on top or on the bottom Lazy view loading Setup pod 'DMSwipeCar

Dylan Marriott 250 Nov 15, 2022
Tinder-clone-ios-public - Tinder clone application written using SwiftUI, Firebase, Swift Package Manager and iOS 15 features

tinder-clone-ios-public Tinder clone application written using SwiftUI, Firebase

Alejandro Piguave 24 Dec 30, 2022
Swipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours!

MDCSwipeToChoose Swipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours!

Brian Gesiak 2.6k Nov 29, 2022
🔥 A multi-directional card swiping library inspired by Tinder
🔥 A multi-directional card swiping library inspired by Tinder

Made with ❤️ by Mac Gallagher Features 💡 Advanced swipe recognition based on velocity and card position 💡 Manual and programmatic actions 💡 Smooth

Mac Gallagher 754 Dec 28, 2022
Poi - You can use tinder UI like tableview method
Poi - You can use tinder UI like tableview method

Poi You can use tinder UI like tableview method Installation Manual Installation Use this command git clone [email protected]:HideakiTouhara/Poi.git Imp

null 65 Nov 7, 2022
A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS.
A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS.

🃏 CardStack A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS. Installation Xcode 11 & Swift Package Manager Use the package r

Deniz Adalar 285 Jan 3, 2023
Subscription View Controller like the Tinder uses

SubscriptionPrompt SubscriptionPrompt is a UIViewController with a carousel at the top and a number of rows at the bottom. Written in Swift, works for

Binur Konarbai 235 Nov 17, 2022
Tinder like ui using SwiftUI

// // User.swift // CardUI // // Created by paige on 2021/12/09. // import SwiftUI struct User: Identifiable { var id = UUID().uuidString

paigeshin 0 Dec 9, 2021
KolodaView is a class designed to simplify the implementation of Tinder like cards on iOS.
KolodaView is a class designed to simplify the implementation of Tinder like cards on iOS.

KolodaView Check this article on our blog. Purpose KolodaView is a class designed to simplify the implementation of Tinder like cards on iOS. It adds

Yalantis 5.2k Jan 2, 2023
Tinder/Bumble like user image with user details scroll animation
Tinder/Bumble like user image with user details scroll animation

TinderUserProfile Tinder/Bumble like user image with user details scroll animation Add ProfileView.m,ProfileView.h class to your project. Set the clas

Souvick Ghosh 21 Jun 21, 2022
card.io provides fast, easy credit card scanning in mobile apps
card.io provides fast, easy credit card scanning in mobile apps

card.io SDK for iOS card.io provides fast, easy credit card scanning in mobile apps. NEW!!! card.io is now an open-source project! As of December 2014

card.io 2.3k Jan 4, 2023
Comments
  • Swift 4 Updates

    Swift 4 Updates

    Ran Swift4 Convert. Fixed warning about M_PI deprecation by replacing with Double.pi. Updated project settings per Xcode's recommendation. @objc Inference set to Default in Build Settings.

    opened by kyleishie 1
  • Swift 4 compiler failure with `#selector`

    Swift 4 compiler failure with `#selector`

    To reproduce

    1. Create new project in Swift 4 with Cocoapods
    2. Add DMSwipeCards to Podfile and pod install
    3. Compile project

    There is a compiler error at: https://github.com/D-32/DMSwipeCards/blob/dab78b74e5f844542305c9b55b8ee583eec65b94/DMSwipeCards/Classes/DMSwipeCard.swift#L39

    Argument of '#selector' refers to instance method 'dragEvent(gesture:)' that is not exposed to Objective-C

    opened by bachonk 2
  • Event when a card is displayed

    Event when a card is displayed

    Hi,

    I have to play a bunch of videos retrieved from the internet on cards. This is my view generator.

    let viewGenerator: (Video, CGRect) -> (UIView) = { (video: Video, frame: CGRect) -> (UIView) in
      let containerView = UIView(frame: self.view.bounds)
      
      let asset = AVURLAsset(url: URL(string: video.url)!)
      asset.resourceLoader.setDelegate(self, queue: DispatchQueue.main)
      
      let player = AVPlayer(playerItem: AVPlayerItem(asset: asset))
      player.actionAtItemEnd = .none
      
      let playerLayer = AVPlayerLayer(player: player)
      playerLayer.frame = self.view.bounds
      playerLayer.backgroundColor = UIColor.clear.cgColor
      
      containerView.layer.addSublayer(playerLayer)
      
      player.play()
      return containerView
  }

    Is there a way to get notified when each card is shown in the screen? A delegate method perhaps.

    The reason is, it's a little different than displaying static views or images. Because view/image cards are sort of "preloaded", right? When I add video player cards in the view generator, I have to set it to play player.play() right within the generator. The problem is then all the preloaded videos also get played simultaneously.

    If there's a way to get notified when each card is displayed, maybe I could make it play when that happens.

    opened by Isuru-Nanayakkara 2
Owner
Dylan Marriott
Software Engineer
Dylan Marriott
GitHub
Swipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours!

MDCSwipeToChoose Swipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours!

Brian Gesiak 2.6k Nov 29, 2022
🔥 A multi-directional card swiping library inspired by Tinder

Made with ❤️ by Mac Gallagher Features ?? Advanced swipe recognition based on velocity and card position ?? Manual and programmatic actions ?? Smooth

Mac Gallagher 754 Dec 28, 2022
A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS.

?? CardStack A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS. Installation Xcode 11 & Swift Package Manager Use the package r

Deniz Adalar 285 Jan 3, 2023
KolodaView is a class designed to simplify the implementation of Tinder like cards on iOS.

KolodaView Check this article on our blog. Purpose KolodaView is a class designed to simplify the implementation of Tinder like cards on iOS. It adds

Yalantis 5.2k Jan 2, 2023
IOS Card Game - A simple card game using SwiftUI

IOS_Card_Game A simple card game using Swift UI.

Md. Masum Musfique 1 Mar 25, 2022
A marriage between the Shazam Discover UI and Tinder, built with UICollectionView in Swift.

VerticalCardSwiper A marriage between the Shazam Discover UI and Tinder, built with UICollectionView in Swift. Project goal and information The goal o

Joni Van Roost 1.2k Dec 28, 2022
Awesome looking Dial like card selection ViewController

KVCardSelectionVC Awesome looking Dial like card selection ViewController An updated Swift 3 working version of : https://github.com/atljeremy/JFCardS

Kunal Verma 23 Feb 1, 2021
A reactive, card-based UI framework built on UIKit for iOS developers.

CardParts - made with ❤️ by Intuit: Example Requirements Installation Communication & Contribution Overview Quick Start Architecture CardsViewControll

Intuit 2.5k Jan 4, 2023
A SwiftUI based custom sheet card to show information in iOS application.

A SwiftUI based custom sheet card to show any custom view inside the card in iOS application.

Mahmud Ahsan 4 Mar 28, 2022
A SwiftUI card view, made great for setup interactions.

SlideOverCard A SwiftUI card design, similar to the one used by Apple in HomeKit, AirPods, Apple Card and AirTag setup, NFC scanning, Wi-Fi password s

João Gabriel 716 Dec 29, 2022