Swipes View Framework (iOS)

UISwipesView (a Tinder-like View) displays views (or cards) to be swiped in all directions of your choice and also allows you to programatically swipe (with a button or a command).

Looking for the Swipes Android Library?

On this page, you can:

• Check out How to set up the UISwipesView
• Check out How to pass data
• Check out How to automate swipes
• Check out How to listen for swipe actions
• Check out our Further Reading section

Happy Swiping, :)

Setup

Installation

DataStoreAdvanced is available through Carthage. To install it, simply add the following line to your Cartfile:

github "Operators/swipes-view-ios"

The UISwipesView can be defined programmatically in Objective-C:

    //The array defines which directions the UISwipesView will swipe to
    NSNumber * directions = @[[Directions LEFT], [Directions.RIGHT]];
    
    UISwipesView *swipesView = [[UISwipesView alloc] initWithFrame:CGRect(10, 10, 300,300)]; //Or from Storyboard Outlet (self.swipesView)
	[swipesView setAllowedDirections:directions]; //setAllowedDirections(Directions.RIGHT, Directions.DOWN);

The UISwipesView can also be defined programmatically in Swift:

    //The array defines which directions the UISwipesView will swipe to
	var directions: [Directions] = [Directions.LEFT(), Directions.RIGHT()]
	
	var swipesView: UISwipesView = UISwipesView(frame: CGRect(10, 10, 300, 300)) //Or from Storyboard Outlet (self.swipesView)
	swipesView.setAllowedDirections(directions) //setAllowedDirections(Directions.RIGHT(), Directions.DOWN());

Alternatively UISwipesView can be defined in XCode IB:

Passing Data

Data must be passed to the UISwipesView from a UISwipesViewDataSource implementation, and using a UISwipesViewCell.

A basic example of a UISwipesViewCell subclass would look as follows:

@interface BasicCardCell : UISwipesViewCell
@property (strong, nonatomic) UILabel *label;
@end

A basic example of a UISwipesViewCell implementation accepting data would look as follows:

- (UISwipesViewCell *)swipesView:(UISwipesView *)swipesView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    
    BasicCardCell *cell = (BasicCardCell*)[swipesView dequeueReusableCellWithReuseIdentifier:@"BasicCardCell" forIndexPath:indexPath];
    cell.label.text = [NSString stringWithFormat:@"%@", self.cardData[indexPath.item]];
    
    return cell;
}

Automating Swipes

The UISwipesView can swipe programatically as well, ideally through a button click (or some other action):

	UIButton swipeLeftButton = [[UIButton alloc] init];
    [swipeLeftButton 
    		addTarget:self.swipesView 
    		action:@selector(performSwipeLeft) 
    		forControlEvents:UIControlEventTouchUpInside];
    		
	UIButton swipeDownButton = [[UIButton alloc] init];
    [swipeDownButton 
    		addTarget:self.swipesView 
    		action:@selector(performSwipeDown) 
    		forControlEvents:UIControlEventTouchUpInside];
    		
	UIButton swipeRightButton = [[UIButton alloc] init];
    [swipeRightButton 
    		addTarget:self.swipesView 
    		action:@selector(performSwipeRight) 
    		forControlEvents:UIControlEventTouchUpInside];
    		
	UIButton swipeUpButton = [[UIButton alloc] init];
    [swipeUpButton 
    		addTarget:self.swipesView 
    		action:@selector(performSwipeUp) 
    		forControlEvents:UIControlEventTouchUpInside];

Listening For Swipe Actions

The UISwipesView can have multiple listeners. Card components (as well as Views or Controllers) can listen for swipes all simultaneously:

• First update your class to implement UISwipesViewDelegate

@interface YourClass : UIView <UISwipesViewDelegate>
@property (strong, nonatomic) Directions *direction;
@property (strong, nonatomic) UILabel *label;
@end

@implementation YourClass
- (void)onThresholdChange:(UISwipesViewCell*)card threshold:(CGFloat)threshold {
	// Handle some threshold change like view alpha
}

- (void)onDirectionSwipe:(UISwipesViewCell*)card direction:(Directions*)direction {
	// Handle some direction change like change indicator color
}

- (void)onSuccessfulSwipe:(UISwipesViewCell*)card direction:(Directions*)direction {
	// Handle some success by updating data set, or application state
}
@end

• Alternatively, you can update your protocols to extend UISwipesViewDelegate

• Next place the addSwipesListener reference along with your implementation of UISwipesViewDelegate.

@implementation YourClass
- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if(self) {
        [UISwipesView addUISwipesViewDelegate:self];
        self.label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
        [self addSubview:self.label];
    }
    return self;
}
@end

Once that is complete, you're ready to listen for onThresholdChange, onDirectionSwipe or onSuccessfulSwipe.

• The onThresholdChange Swipe Action provides feedback on what amount the swipe is complete. An Example of this would look as follows:

- (void)onThresholdChange:(UISwipesViewCell*)card threshold:(CGFloat)threshold {
    
    self.label.alpha = threshold;// Set the alpha of some overlay view
    
}

• The onDirectionSwipe Swipe Action provides feedback on what direction the swipe is going. An Example of this would look as follows:

- (void)onDirectionSwipe:(UISwipesViewCell*)card direction:(Directions*)direction {
    self.direction = direction;// Reset the direction state wthin some object
}

• The onSuccessfulSwipe Swipe Action provides feedback on what direction the sucessful swipe was going. An Example of this would look as follows:

- (void)onSuccessfulSwipe:(UISwipesViewCell*)card direction:(Directions*)direction {
    
	// There needs to be a filter on the views
	BOOL isCurrentView = [self isEqual:card.yourClassObject];
    if(isCurrentView) self.label.text = @"New State"; // Reset view state, possibly for reuse
	
}

Further Reading

See the Documentation for more on the UISwipesView, or UISwipesViewDataSource functions.

See the MAC Guides for detailed examples of how to use the UISwipesView.

• Like with a Basic Example
• Interacting with other View Components
• Or with UISwipesViewDelegates.

See the iOS Documentation for more on UICollectionView, for a peek into the UISwipesView origins.

See the iOS Documentation for more on UICollectionViewDataSource, to see how the UISwipesViewDataSource started.

LICENSE

The MIT License (MIT) Copyright (c) 2016 Operators

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.