SwiperYesSwiping
Add a floating left/right page action in Swift.
Demo
Requirements
- iOS 10.0+
Integration
Manually
This repo only uses three files, so you can either
- Download this repo and drag and drop the
SwiperYesSwiping.swift
,HPGestureRecognizer.swift
, andHaptics.swift
files into your project - Or copy paste their code into a swift file in your project.
Swift Package Manager
You can also integrate it into your project using Swift Package Manager.
In Xcode, go to File -> Swift Packages -> Add Package Dependency
and paste in the repo's url: https://github.com/qazwini/SwiperYesSwiping
.
Usage
If you are using Swift Package Manager, you need to add Import SwiperYesSwiping
into the file you would like to use it in.
- Initialize
let swiper = SwiperYesSwiping()
somewhere in your class. - Set the
view
property to the whichever view controller's view or any other view you'd like to add this on. If you don't, it will automatically choose the top view controller at the time thatactivate()
is run. - Set the
leftImage
andrightImage
to any image you want. You can use SF Symbols as well. If you are adding a top action, also add atopImage
. In the demo, all the icons are SF Symbols. The left icon ischevron.left.circle.fill
, right ischevron.right.circle.fill
, and top iscalendar.circle.fill
. - Set the
didCompleteSwipe()
function to whatever function you want to run when the user fully completes the action. ThesideSwiped
will betop
if the user highered it (if you did not set an image fortopImage
, this will not run). - Set the
didCancelSwipe()
function to whatever function you want to run when the user swipes but then cancels their swipe. - Make sure to run the
activate()
function to set up the gesture recognizer. If you wish to remove the recognizer from the view, usedeactivate()
.
Example Usage
class ViewController: UIViewController {
let swiper = SwiperYesSwiping()
override func viewDidLoad() {
super.viewDidLoad()
swiper.view = view
swiper.leftImage = UIImage(systemName: "chevron.left.circle.fill")
swiper.rightImage = UIImage(systemName: "chevron.right.circle.fill")
swiper.topImage = UIImage(systemName: "calendar.circle.fill")
swiper.bothImageTintColor = .white
swiper.didCompleteSwipe = { side in
switch side {
case .left: print("User swiped left")
case .right: print("User swiped right")
case .top: print("User raised arrow")
}
}
swiper.sideMarginsWhenFullySwiped = 20
swiper.activate()
}
}
Additional Customization
bothImageTintColor
. If you want to use the same color for both the right and left images, set this to whatever color you want. Remember to setwithTemplateMode(.alwaysTemplate)
when setting the left/right/top images if you want to change their tint color.leftImageTintColor
andrightImageTintColor
. If you want to use different colors for each side, set these.imageWidth
. Set this to whatever size you want the icon to be. Default is 34.sideMarginsWhenFullySwiped
. Set this to the edge insets you want for the image when it popped out. The larger the number, the further from the edges.usesHaptics
. Set this tofalse
if you do not want haptic feedback.