Onichan
Onichan

Reputation: 4516

Hide UIView starting from Bottom on Scroll

I have a tableView and I would like to hide the UIView above it as the user scrolls down. Currently, scrolling hides the UIView from top-to-bottom.

How can I hide the UIView from bottom-to-top (as in the example below):

enter image description here enter image description here enter image description here

Upvotes: 4

Views: 2691

Answers (2)

Arkku
Arkku

Reputation: 42139

This is a bit of a hack, but possibly the easiest way to do it:

In the storyboard, put the UIView at the top (let's call it the “top bar”) outside the scrollview, and arrange it so that it is behind the scrollview. Make sure it is of fixed height and position at the top of the screen (width should vary according to width of the screen).

Then in the place where you used to have the UIView, place a completely transparent view of equal size and disable user interaction for it. You can also put in a little gradient at the bottom of this view to fade over the top bar behind it (i.e., the gradient should be completely transparent at the top and the background colour of the top bar at the bottom). Your fixed-position top bar should now show through this transparent window which scrolls upwards and out of sight. The ugliness is that the scroll position indicator includes this transparent window.

Doing it “properly” requires you to set a class as the delegate of scrolling tableView, implement the scrollViewDidScroll method and inside that method adjust the auto layout constraints (or view positions if laying out manually) according to scrollView.contentOffset.y. The starting point of this option is also to have the top bar behind and outside of tableView, but instead of having the transparent view you would adjust the top edge position of tableView.

Upvotes: 1

Klevison
Klevison

Reputation: 3484

You need to track the scroll direction. For example:

-(void) scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGPoint currentOffset = scrollView.contentOffset;
    if (currentOffset.y > self.lastContentOffset.y) {
        // (Downward) Show my View
    } else {
        // (Upward) Hide My View
    }
    self.lastContentOffset = currentOffset;
}

Upvotes: 1

Related Questions