VerticalCardSwiper
2.3.1
เป้าหมายของโครงการนี้คือการสร้าง Discover UI ใน Shazam (ซึ่งฉันคิดว่าเป็นวิธีที่ยอดเยี่ยมและสนุกในการแสดงเนื้อหา) ร่วมกับรูปแบบของการ์ดปัดไปทางซ้าย/ขวา แนวคิดเบื้องหลังนี้คือในบางกรณีคุณไม่ต้องการปัดการ์ดออกไป แต่ให้พวกเขาพร้อมใช้งานในภายหลัง การใช้งานนี้ช่วยให้สิ่งนั้นได้ และเป็นวิธีที่สนุกในการโต้ตอบกับเนื้อหา
มันถูกสร้างขึ้นด้วย UICollectionView และ Flowlayout ที่กำหนดเอง
ในการติดตั้งด้วย cocoapods เพียงเพิ่มบรรทัดต่อไปนี้ใน PodFile ของคุณ:
pod 'VerticalCardSwiper'ในการติดตั้งด้วย Carthage เพียงเพิ่มบรรทัดต่อไปนี้ลงใน PodFile ของคุณ:
github "JoniVR/VerticalCardSwiper" เพื่อลองใช้ VerticalCardSwiper
pod try VerticalCardSwiperหรือเปิดโครงการและเรียกใช้ตัวอย่าง
VerticalCardSwiper ทำงานได้อย่างมากเช่น UICollectionView มาตรฐาน หากต้องการใช้ภายใน 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 ปกติคุณสามารถโหลดข้อมูลใหม่ได้โดยโทร cardSwiper . reloadData ( ) cardSwiper . focussedCardIndexcardSwiper . scrollToCard ( at : Int , animated : Bool ) - > BoolcardSwiper . cardForItem ( at : Int ) - > CardCell ? cardSwiper . swipeCardAwayProgrammatically ( at : Int , to : SwipeDirection , withDuration : TimeInterval = 0.3 ) - > Boolตรวจสอบให้แน่ใจว่าได้อัปเดตแหล่งข้อมูลของคุณก่อนมิฉะนั้นจะเกิดข้อผิดพลาด
cardSwiper . moveCard ( at : Int , to : Int )
cardSwiper . deleteCards ( at : [ Int ] )
cardSwiper . insertCards ( at : [ Int ] ) ในการจัดการท่าทางการปัดให้ใช้ 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).
}
} subclass CardCell เพื่อปรับแต่งการ์ด
class ExampleCardCell : CardCell {
} Joni Van Roost, [email protected]
VerticalCardswiper มีอยู่ภายใต้ใบอนุญาต MIT ดูไฟล์ใบอนุญาตสำหรับข้อมูลเพิ่มเติม
อย่าลังเลที่จะส่งคำขอดึงเปิดปัญหาหรือแยกโครงการนี้ ความช่วยเหลือใด ๆ ที่ได้รับการชื่นชมเสมอ ขอขอบคุณผู้สนับสนุนทุกคน!
