How do I enable directional lock for a UIScrollView?

Question

I have a UIScrollView with a UIView inside. I want to lock the x-axis so that the view is only scrolled vertically. How do I enable directional locking?

Answer 1

First, set the UIScrollView's contentSize to have a width that is equal to or less than the width of the UIScrollView's frame.

Next, set UIScrollView's alwaysBounceHorizontal to NO. This will prevent the scroll view from "rubber banding" even though you've told it there's no more horizontal content to display.

UIScrollView *scrollView;
CGSize size = scrollView.contentSize;
size.width = CGRectGetWidth(scrollView.frame);
scrollView.contentSize = size;
scrollView.alwaysBounceHorizontal = NO;

It doesn't matter what's actually inside the scroll view.

Swift 5.0

let scrollView = UIScrollView() // Or however you want to initialize it
var size = scrollView.contentSize
size.width = scrollView.frame.width
scrollView.contentSize = size
scrollView.alwaysBounceHorizontal = false

Answer 2

You'll be subclassing UIScrollView and overriding the touchesBegan:withEvent: method, touchesMoved:withEvent: method, and the touchesEnded:withEvent: method.

You'll use those methods, along with the start and end points of a touch, to calculate what kind of touch event took place: was it a simple tap, or a horizontal or vertical swipe?

If it is a horizontal swipe, you cancel the touch event.

Take a look at the source code here to learn how you might get started.

Answer 3

#import <UIKit/UIKit.h>


@interface DemoButtonViewController : UIViewController <UIScrollViewDelegate>

@property (nonatomic, strong) UIScrollView *filterTypeScrollView;
@property (nonatomic, strong) UIBarButtonItem *lockButton;

- (void)lockFilterScroll:(id)sender;

@end

#import "DemoButtonViewController.h"

@implementation DemoButtonViewController

@synthesize filterTypeScrollView;
@synthesize lockButton;

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];

    if (self) 
    {
        // Custom initialization
    }
    return self;
}

- (void)didReceiveMemoryWarning
{
    // Releases the view if it doesn't have a superview.
    [super didReceiveMemoryWarning];

    // Release any cached data, images, etc that aren't in use.
}

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.view.backgroundColor = [UIColor darkGrayColor];
    self.filterTypeScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 130, self.view.frame.size.width, 320)];
    filterTypeScrollView.contentSize = CGSizeMake(self.view.frame.size.width*4, 320);
    filterTypeScrollView.pagingEnabled = YES;
    filterTypeScrollView.delegate = self;
    [self.view addSubview:filterTypeScrollView];

    UIToolbar *lockbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 450, self.view.frame.size.width, 30)];
    lockbar.barStyle = UIBarStyleBlackTranslucent;
    self.lockButton = [[UIBarButtonItem alloc] initWithTitle:@"Lock Filter Scroll" style:UIBarButtonItemStylePlain target:self action:@selector(lockFilterScroll:)];
    [lockbar setItems:[NSArray arrayWithObjects:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil],lockButton,nil]]; 
    [self.view addSubview:lockbar];
}

- (void)viewDidUnload
{
    [super viewDidUnload];
}

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    // Return YES for supported orientations  
    return (interfaceOrientation == UIInterfaceOrientationPortrait);
}

- (void)lockFilterScroll:(id)sender
{
    filterTypeScrollView.scrollEnabled = !filterTypeScrollView.scrollEnabled;

    if (filterTypeScrollView.scrollEnabled) 
    {
        [lockButton setTitle:@"Lock Filter Scroll"];
    } 
    else {
        [lockButton setTitle:@"Unlock Filter Scroll"];
    }
}

@end