How do I enable directional lock for a UIScrollVie

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

#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

Answer 2

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.

Answer 3

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.