Uiscrollview: Paging Horizontally, Scrolling Vertically

Vertical UIScrollView over horizontal UIScrollView

Here's a brief method that may help you out:

Obj-C:

create scroll view that is invisible, and then pass the offset of the invisible scroll view or the touch events to the scroll views below depending on the offset of the touch events on the top invisible scroll view that covers the two underlying scroll views:

-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
    [_verticalScrollView setContentOffset:CGPointMake(0, _insivibleScrollView.contentOffset.y)];
    [_horizontalScrollView setContentOffset:CGPointMake(_insivibleScrollView.contentOffset.x, 0)];
}

You create an invisible scroll view, and by invisible, I mean you may have to keep the alpha value at like 0.01. You don't allow user interaction for the horizontal and vertical scroll views, but instead use the method above so that when the user touches the invisible scroll view you translate those touches to the scroll views below that are locked down to respond to only the offset of the invisible scroll view. As you've stated in your comment, there's probably more to this answer for your individual needs, but this is the basic "foundation" that will give you the effect that you probably want.

Swift:

Same method as above, but here's the function that you'll need:

func scrollViewDidScroll(scrollView: UIScrollView!) {
    verticalScrollView.contentOffset = CGPointMake(0, invisibleScrollView.contentOffset.y)
    horizontalScrollView.contentOffset = CGPointMake(invisibleScrollView.contentOffset.x, 0)
}

iPhone - Nesting UIScrollViews for horizontal paging and vertical scrolling

This works out of the box with the SDK now. See Scrolling Madness and Apple's UIPageControl sample for guidelines on how to implement paged horizontal scrolling with a view controller for each page.

The nested UIScrollViews you add as subviews to your outer UIScrollView should have the same frame heights as the container. If you do this then the outer UIScrollView will pass through the vertical scrolling events to the subview. My app has three levels of UIScrollView and UIWebView nesting and I've found Cocoa is really intelligent about passing the events to the one I want as long as I set my frame sizes so that only one view is really scrollable (contentSize > frame) on each axis.

Scroll Vertically in a UIScrollView with Vertical Paging enabled

The best way I've found to do it is to use a nested scrollview for the content. Here is what my code ended up looking like.

class ViewController: UIViewController, UIScrollViewDelegate {

let scrollView = ScrollView() // Create the scrollView

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.


    //Set up and add scrollView to view
    scrollView.frame = self.view.frame
    self.scrollView.pagingEnabled = true
    self.view.addSubview(scrollView)
    self.scrollView.delegate = self

    //An array of UIColors to add to the views
    let x : [UIColor] = [UIColor.blueColor(),UIColor.redColor(),UIColor.yellowColor()]

    //For each UIColor add a view that is 100px larger then the height of the scrollView
    for index in 0...x.count-1{
        //
        let subView = UIScrollView(frame: CGRectMake(
            0, //x offset
            (self.scrollView.frame.height * CGFloat(index)), //y offset
            self.scrollView.frame.width, // width
            (self.scrollView.frame.height))) // height

//Set the size of the content view
        let contentView = UIView(frame: CGRectMake(0, 0, self.view.frame.width, 1000))

        subView.contentSize = CGSizeMake(self.view.frame.width, contentView.frame.height)
        contentView.backgroundColor = x[index]
        subView.addSubview(contentView)
        scrollView.addSubview(subView) // Add View

    }

    //
    let c = (self.scrollView.frame.size.height) * CGFloat(x.count)
    self.scrollView.contentSize = CGSizeMake(self.scrollView.frame.width, c)

    //Background Color
    self.view.backgroundColor = UIColor.greenColor()
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}
}

UIScrollView paging just for horizontal, but not vertical?

Not AFAIK. You should subclass UIScrollView, as explained in the documentation:

Subclasses can override the touchesShouldBegin:withEvent:inContentView:, pagingEnabled, and touchesShouldCancelInContentView: methods (which are called by the scroll view) to affect how the scroll view handles scrolling gestures.

---

Related Topics