VerticalCardSwiper
2.3.1
L'objectif de ce projet est de recréer l'interface utilisateur Discover à Shazam (qui je pense est une excellente façon amusante d'afficher le contenu) en combinaison avec un style de cartes de glissement à gauche / à droite. L'idée derrière cela est que dans certains cas, vous ne voulez pas glisser les cartes à l'extérieur, mais gardez-les disponibles plus tard. Cette implémentation le permet. Et c'est une façon amusante d'interagir avec le contenu.
Il est construit avec un UICollectionView et un flux de flippe personnalisé.
Pour installer avec des cocoapodes, ajoutez simplement la ligne suivante à votre podfile:
pod 'VerticalCardSwiper'Pour installer avec Carthage, ajoutez simplement la ligne suivante à votre podfile:
github "JoniVR/VerticalCardSwiper" Pour essayer VerticalCardSwiper
pod try VerticalCardSwiperou ouvrez le projet et exécutez l'exemple.
VerticalCardSwiper se comporte beaucoup comme un UICollectionView standard. Pour l'utiliser à l'intérieur de votre UIViewController :
import VerticalCardSwiper
class ExampleViewController : UIViewController , VerticalCardSwiperDatasource {
private var cardSwiper : VerticalCardSwiper !
override func viewDidLoad ( ) {
super . viewDidLoad ( )
cardSwiper = VerticalCardSwiper ( frame : self . view . bounds )
view . addSubview ( cardSwiper )
cardSwiper . datasource = self
// register cardcell for storyboard use
cardSwiper . register ( nib : UINib ( nibName : " ExampleCell " , bundle : nil ) , forCellWithReuseIdentifier : " ExampleCell " )
}
func cardForItemAt ( verticalCardSwiperView : VerticalCardSwiperView , cardForItemAt index : Int ) -> CardCell {
if let cardCell = verticalCardSwiperView . dequeueReusableCell ( withReuseIdentifier : " ExampleCell " , for : index ) as? ExampleCardCell {
return cardCell
}
return CardCell ( )
}
func numberOfCards ( verticalCardSwiperView : VerticalCardSwiperView ) -> Int {
return 100
}
} /// Indicates if side swiping on cards is enabled. Set to false if you don't want side swiping. Default is `true`.
@ IBInspectable public var isSideSwipingEnabled : Bool = true
/// Allows you to enable/disable the stacking effect. Default is `true` (enabled).
@ IBInspectable public var isStackingEnabled : Bool = true
/// The transform animation that is shown on the top card when scrolling through the cards. Default is 0.05.
@ IBInspectable public var firstItemTransform : CGFloat = 0.05
/// The inset (spacing) at the top for the cards. Default is 40.
@ IBInspectable public var topInset : CGFloat = 40
/// The inset (spacing) at each side of the cards. Default is 20.
@ IBInspectable public var sideInset : CGFloat = 20
/// Sets how much of the next card should be visible. Default is 50.
@ IBInspectable public var visibleNextCardHeight : CGFloat = 50
/// Vertical spacing between the focussed card and the bottom (next) card. Default is 40.
@ IBInspectable public var cardSpacing : CGFloat = 40
/// Allows you to set the view to Stack at the Top or at the Bottom. Default is true.
@ IBInspectable public var isStackOnBottom : Bool = true
/// Sets how many cards of the stack are visible in the background
@ IBInspectable public var stackedCardsCount : Int = 1
/**
Returns an array of indexes (as Int) that are currently visible in the `VerticalCardSwiperView`.
This includes cards that are stacked (behind the focussed card).
*/
public var indexesForVisibleCards : [ Int ] UICollectionView ordinaire, vous pouvez recharger les données en appelant cardSwiper . reloadData ( ) cardSwiper . focussedCardIndexcardSwiper . scrollToCard ( at : Int , animated : Bool ) - > BoolcardSwiper . cardForItem ( at : Int ) - > CardCell ? cardSwiper . swipeCardAwayProgrammatically ( at : Int , to : SwipeDirection , withDuration : TimeInterval = 0.3 ) - > BoolAssurez-vous d'abord de mettre à jour votre source de données, sinon une erreur se produira.
cardSwiper . moveCard ( at : Int , to : Int )
cardSwiper . deleteCards ( at : [ Int ] )
cardSwiper . insertCards ( at : [ Int ] ) Pour gérer les gestes de balayage, implémentez le VerticalCardSwiperDelegate .
class ViewController : UIViewController , VerticalCardSwiperDelegate {
override func viewDidLoad ( ) {
super . viewDidLoad ( )
cardSwiper . delegate = self
}
func willSwipeCardAway ( card : CardCell , index : Int , swipeDirection : SwipeDirection ) {
// called right before the card animates off the screen (optional).
}
func didSwipeCardAway ( card : CardCell , index : Int , swipeDirection : SwipeDirection ) {
// handle swipe gestures (optional).
}
func didCancelSwipe ( card : CardCell , index : Int ) {
// Called when a card swipe is cancelled (when the threshold wasn't reached)
}
func sizeForItem ( verticalCardSwiperView : VerticalCardSwiperView , index : Int ) -> CGSize {
// Allows you to return custom card sizes (optional).
return CGSize ( width : verticalCardSwiperView . frame . width * 0.75 , height : verticalCardSwiperView . frame . height * 0.75 )
}
func didScroll ( verticalCardSwiperView : VerticalCardSwiperView ) {
// Tells the delegate when the user scrolls through the cards (optional).
}
func didEndScroll ( verticalCardSwiperView : VerticalCardSwiperView ) {
// Tells the delegate when scrolling through the cards came to an end (optional).
}
func didDragCard ( card : CardCell , index : Int , swipeDirection : SwipeDirection ) {
// Called when the user starts dragging a card to the side (optional).
}
func didTapCard ( verticalCardSwiperView : VerticalCardSwiperView , index : Int ) {
// Tells the delegate when the user taps a card (optional).
}
func didHoldCard ( verticalCardSwiperView : VerticalCardSwiperView , index : Int , state : UIGestureRecognizer . State ) {
// Tells the delegate when the user holds a card (optional).
}
} Sous-classe le CardCell pour personnaliser les cartes.
class ExampleCardCell : CardCell {
} Joni Van Roost, [email protected]
VerticalCardswiper est disponible sous la licence MIT. Voir le fichier de licence pour plus d'informations.
N'hésitez pas à soumettre une demande de traction, à ouvrir un problème ou à fournir ce projet. Toute aide est toujours appréciée. Un grand merci à tous les contributeurs!
