CODEWITHSUNDEEP
swiftuibuttonautolayoutstoryboardscrollview
romero-ios
romero-ios

Reputation: 1085

How to use a scrollview containing buttons with auto layout

I need some help figuring this out.

I have a simple UI I need to implement. I have 4 buttons that take up the entire screen and with the scrollview, I want the user to be able to scroll to make the 5th button visible. I know how to use auto layout to make my first four buttons display how I want them. The first button is 40% of the visible screen, the second button is 15%, the third 30% and the last button is 15% of the visible screen. The 5th button should be hidden but then revealed when the user scrolls down.

(To clarify, all buttons have width equal to their superview, proportional height to the superview and all buttons have no spacing between each other)

This is where I am stuck. I want the proportions as I stated above, but also want the 5th button to show when scrolled to, possibly at 10% of the now visible screen (with the first button now not showing itself fully). Is there a way to do this?

Upvotes: 1

Views: 518

Answers (1)

DJohnson
DJohnson

Reputation: 919

You can set the contentSize of the UIScrollView to be larger than the visible screen. The buttons can be sized and placed in a way to have all 5 buttons visible (with the 5th button actually off screen). The scrollView will bring the 5th button into view when scrolling.

I worked up a simple prototype using just a storyboard (and setting the contentSize of the scrollview in Runtime Attributes section, but this could be done in code if you need to pragmatically determine the button sizes.

enter image description here

Upvotes: 2

Related Questions