Mitchell
Mitchell

Reputation: 343

ScrollView not resizing properly

I have a ScrollView embedded in my ViewController. Inside the ScrollView I have embedded a content view (UIView) which has a UIImage set to match the left, top and right of the ScrollView with a dynamic height that changes depending on the aspect ratio of an image that the user can load after the ViewController loads. There are three buttons all horizontally aligned in the content view and spaced evenly apart from each other.

When the user loads in a photo that is too big for the screen it should just resize the ScrollView and the content view appropriately to allow scrolling to see the buttons but instead it just bunches up the buttons at the bottom of the screen.

Here is how the buttons should look: enter image description here

Here is what happens when the photo is too big: enter image description here

Here are the constraints of the ScrollView: enter image description here

Here is my resizing code:

let img : UIImage = info[UIImagePickerControllerOriginalImage] as! UIImage
            let screenSize: CGRect = UIScreen.mainScreen().bounds
            let multiplyNum = screenSize.width / img.size.width
            imageViewHeightConstraint.constant = (multiplyNum*img.size.height)
            imageView.image = img

Even when I try and change the ScrollViews height programatically to a very large number it still won't get any larger than the ViewController (no scrolling).

Constraints of ContentView: enter image description here

Constraint of ImageView:

enter image description here

Constraints of first 2 buttons:

enter image description here

Constraints of last button:

enter image description here

Upvotes: 0

Views: 1367

Answers (1)

juanjo
juanjo

Reputation: 3757

Make sure to set all the constraints that completely define the vertical layout of all elements (top constraint for image, vertical space between elements and bottom constraint of last element), and try changing the priority of the content hugging or compression resistance of the elements.

Edit:

You can achieve that behaviour with this view hierarchy:

- UIView
  - UIScrollView
    - UIImage
    - UIButton
    - UIButton
    - UIButton

There is no necessity to add a container view if you set the constraints like this:

scrollView:

Leading, trailing, top and bottom constraints to view (all 0)

inner views (horizontal):

  1. Leading constraint from imageView to scrollView
  2. Trailing constraint from imageView to scrollView
  3. Equal width from imageView to view

inner views (vertical):

  1. Top constraint from imageView to scrollView
  2. Height constraint of imageView (this constraint constant will change depending on the size of the image)
  3. Horizontal space from imageView to button1
  4. Horizontal space from button1 to button2
  5. Horizontal space from button2 to button3
  6. Bottom constraint from button3 to scrollView

There is no necessity to change the priority of the content hugging or compression resistance of the elements. I already check that it works in a project.

Upvotes: 1

Related Questions