22
votes

I created a UIScrollView in my storyboards and have added 12 UIButtons in a container View which is inside the UIScrollView.

when running on the iPhone 5s simulator, 9 of the buttons can be seen on the screen, the rest of the buttons only can be seen when you scroll down.

the 9 buttons that can be initially seen on the screen can be interacted with. However the 3 buttons at the bottom of the scroll view (which have to be scrolled to in order to be seen) cannot be interacted with.

I ran the app on an iPhone 6 simulator which displays all 12 of the buttons on the screen without having to scroll and the bottom 3 buttons work.

I am using autolayout.

I have tried fiddling with the contentSize of the UIScrollView and it does not help.

7
Show the code where you are adding the buttons.Rashad
The UIScrollView's (or container view's) frame might not be what you expect. Make sure it's set to clip subviews and run again.Stavash
@Rashad I added the buttons via storyboardWesley Ow
@Stavash i tried changing its clipsToBounds value to true and ran the app again but nothing has changedWesley Ow

7 Answers

46
votes

It seems you need to increase the frame height of container view. The contentSize of scrollView only affects how it will scroll, which is irrelevant here.

If the button is outside the container view, it will still show up. However, it can't respond to any touch event.

4
votes

when using scrollview in storyboard with autolayout. it is usually set up using a content view inside the scrollview that will contain all the other views (e.g. buttons, labels, etc.) the content view are usually set to have equal height and equal width.

to make your content view expand it's height, you need to add a height constraint then assign it to an outlet so you could easily manipulate it's value with in your code. then set the content view's height constraint priority to 1000 ("required") and set the content view's "equal width to:view" constraint priority to 750 (high).

3
votes

For me it was all just to Uncheck the checkbox Adjust Scroll View Insets in the storyboard of that ViewController.

enter image description here

PS: The above answers didn't worked for me.

3
votes

Another option is to reduce the priority on the Content View.Center Y constraint.

In Xcode 9, I laid out the contentView as needed and the button extended below the view on the iPhone 5. I dynamically resized the scrollView.contentSize.height and contentView.frame in the view controller. The scrollView scrolled for me but I was still unable to select the button and was seeing warnings in the Storyboard.

Once I lowered the priority on the Center Y Alignment Constraint for the contentView, the warnings in Storyboard disappeared and I was able to scroll to the bottom of the scrollView and select the button on the iPhone 5 simulator.

enter image description here

NOTE: I'm still checking the device size and resizing the scrollView.contentSize.height value in viewWillLayoutSubviews() for small devices.

override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()
        scrollView.contentSize.height = (UIDevice.current.isSmallDevice) ? 560 : contentView.frame.size.height
    }

(UIDevice.current.isSmallDevice is a call to an extension of UIDevice that returns a bool determined by screen size)

0
votes

Add all subviews from container to ScrollView. And hide the container. Make sure container(ContainerView of scrollView) should also be a subView of scrollView.

0
votes

Just increase the container view height and also Container view must be a subview of the scroll view and all other subviews are part of the container view.

like  Scroolview -> ContainerView--> UIButtons
0
votes
  1. Add height constraint to contentView.
  2. Lower the priority of center Y to superview to 250
  3. Lower the priority of bottom space to superview to 250
  4. Increase the height of contentView in code by setting the height constraint constant value.