Disable diagonal dragging in UIScrollview

Question

I am using UIScrollview to load my two views let say A and B. It exactly looks like the below picture. I set PagingEnabled as YES and DirectionLockEnabled as YES.

When I drag the view from A to B it goes diagonally. Please find the code below,

- (void)setupScrollView:(UIScrollView*)scrMain {

    for (int i = 0; i < 2; i++) {
        if (i == 0) {
            // View A
            [ViewA setFrame:CGRectMake((i)*scrollview.frame.size.width + 20, 0, scrollview.frame.size.width - 40, ViewA.frame.size.height)];
            [scrollview addSubview:ViewA];
        } else if (i == 1) {
           // View B
           [ViewB setFrame:CGRectMake((i)*ViewB.frame.size.width + 30, 0, scrollview.frame.size.width - 40, ViewB.frame.size.height)];
           [scrollview addSubview:ViewB];
        }
    }
    [scrollview setContentSize:CGSizeMake((scrollview.frame.size.width-15)*2, ViewB.frame.size.height)];
}

- (void) scrollViewWillBeginDragging: (UIScrollView *) scrollView
{
    self.oldContentOffset = scroller.contentOffset;
}

- (void) scrollViewDidScroll: (UIScrollView *) scrollView
{
    float XOffset = fabs(self.oldContentOffset.x - scrollView.contentOffset.x );
    float YOffset = fabs(self.oldContentOffset.y - scrollView.contentOffset.y );

    if (scrollView.contentOffset.x != self.oldContentOffset.x && (XOffset >= YOffset) )
    {
        scrollView.pagingEnabled = YES;
        scrollDirection = ScrollDirectionHorizontal;
    }
    else
    {
        scrollView.pagingEnabled = NO;
        scrollDirection = ScrollDirectionVertical;
    }

}

I check with these following links but I did't get a solution yet, http://bogdanconstantinescu.com/blog/proper-direction-lock-for-uiscrollview.html UIScrollView scrolling in only one direction at a time http://chandanshetty01.blogspot.ae/2012/07/restricting-diagonal-scrolling-in.html

All Helps are appreciated!!

The way I did it was just not allowing the scrollview containing the pages scroll 2 ways (So just horizontally in this case). And allow the views (A and B in this case) in that scrollview have their own way of scrolling (vertically in this case). — Totumus Maximus, May 02 '17 at 09:09

dRAGONAIR · Answer 1 · 2017-05-02T12:12:58.337

set directionalLockEnabled = YES; after you reset the contentSize of the scrollview

[self.scrollView setContentSize:CGSizeMake((self.scrollView.frame.size.width-15)*2, self.ViewB.frame.size.height)];
self.scrollView.directionalLockEnabled = YES; // add this here.

By doing like this, it will fix your issue

Answer based on your code

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setupScrollView:self.scrollView];
    self.scrollView.directionalLockEnabled = YES;
    // Do any additional setup after loading the view.
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


- (void)setupScrollView:(UIScrollView*)scrMain {

for (int i = 0; i < 2; i++) {
    if (i == 0) {
        // View A
        self.ViewA = [[UIView alloc] init];
        self.ViewA.backgroundColor = [UIColor blackColor];
        [self.ViewA setFrame:CGRectMake((i)*self.scrollView.frame.size.width + 20, 0, self.scrollView.frame.size.width - 40, 800)];
        [self.scrollView addSubview:self.ViewA];
    } else if (i == 1) {
        // View B
        self.ViewB = [[UIView alloc] init];
        self.ViewB.backgroundColor = [UIColor blueColor];
        [self.ViewB setFrame:CGRectMake((i)*self.ViewA.frame.size.width + 30, 0, self.scrollView.frame.size.width - 40, 800)];
        [self.scrollView addSubview:self.ViewB];
    }
}
[self.scrollView setContentSize:CGSizeMake((self.scrollView.frame.size.width-15)*2, self.ViewB.frame.size.height)];
self.scrollView.directionalLockEnabled = YES;
}

Strange.. its working for me. I tried it out now, its working for me. — dRAGONAIR, May 02 '17 at 09:42
could you please post your complete code. it would be very useful — Maniganda saravanan, May 02 '17 at 11:17
The number of lines were more for a comment, so i have edited and added the code in the answer. — dRAGONAIR, May 02 '17 at 12:13
directionalLockEnabled doesn't disable the diagonal scroll, see: https://developer.apple.com/documentation/uikit/uiscrollview/1619390-directionallockenabled?language=objc — mikezs, Mar 11 '19 at 08:55

score 0 · Answer 2 · answered Jul 19 '22 at 18:59

None of the above worked well for me. In my case, determining the direction at the beginning of the drag using the scrollView panGestureRecognizer allowed for pinning the direction for the rest of the scroll:

private var draggingVertically : Bool = true
private var initialContentOffset = CGPoint.zero
public func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
    initialContentOffset = scrollView.contentOffset
    
    let velocity = scrollView.panGestureRecognizer.velocity(in: scrollView.superview)
    draggingVertically = abs(velocity.x) < abs(velocity.y)
}


public func scrollViewDidScroll(_ scrollView: UIScrollView) {
    var offset = scrollView.contentOffset
    if (draggingVertically == true){
        offset.x = initialContentOffset.x
    } else {
        offset.y = initialContentOffset.y
    }
    scrollView.contentOffset = offset
}

Disable diagonal dragging in UIScrollview

2 Answers2

Linked