Change UIScrollView's frame programatically (Swift 5)

Question

How can I change the height of the frame based on the size of the subview programatically?

scrollView.frame = CGRect(origin: scrollView.frame.origin, size: CGSize(width: scrollView.frame.width, height: scrollView.frame.height))

This is the code that i wrote to change the height of the frame, however the frame does not change even though I set the height to 1000. In addition, I have also tried to set the height of the scollView.contentSize. It only allows the subview to be able to scroll within the scrollView and it doesn't change the height.

This is how i write the code:

The outcome:

The full image to be displayed:

Do you use autolayout, which will prevent you from changing the frame? How do you set up the scroll view (frame and contentSize)? — Andreas Oetjen, Jul 20 '20 at 10:54
Yes, i was using auto layout. I dragged the scroll view, made it match to the screen width and set the height to a specific value (200 for example). Also, I established constraint to leading, top, trailing and bottom to superview with value 0. Of course, I will get an error as i did not set the content size and also I do not know the size of the content (image for example) it will be. I set the frame size (height only) to similar as the intrinsicContentSize of the image and set the content size to have same width and height as the frame. — CHEE CHUAN LOH, Jul 20 '20 at 14:43
So, what exactly do you want to achieve? Typcially, you do not change the frame of the scrollview, but modify the contentSize. Please write what you want, because modifying the frame should work anytime (except for autolayouting; in that case, you need to modify the top and/or bottom constraints) — Andreas Oetjen, Jul 20 '20 at 18:25
basically i want the scroll view to work as image slider. I want the image to be displayed fully on the screen and with `contentMode` set to Aspect Fill. So, the height of the scroll view will be similar as the height of the image that going to be loaded. For the width, it will based on the size of the scroll view which i already enlarged to match the screen. Besides, there is a long paragraph (text view) under the scroll view which top constraint to scroll view and bottom constraint to safe view. Was it preventing the frame not to change the size because with this kind of constraints? — CHEE CHUAN LOH, Jul 21 '20 at 02:33
So, say your screen has a height of 1000, your scroll view 600, the text view 400. The image you want to display has a height of 2000, the text you display a height of also 2000 (long text indeed) -- what kind of layout do you want? Why would you want to change the height of the scroll view? Typically, the height stays the same, so you only see 600 of the 2000 pixel (or whatever unit) of the image, and if you want to see the rest, you have to scroll. Same for the text, same for the width. Is this what you want? — Andreas Oetjen, Jul 21 '20 at 04:48
I added a few example images to make you understand it easily. If the height stay the same, the image does not display in full. I want it to fully display in scroll view. — CHEE CHUAN LOH, Jul 21 '20 at 05:26

Andreas Oetjen · Answer 1 · 2020-07-21T08:35:34.760

First, please do not post pictures of your code, post the code itself. This helps to copy/paste parts of it, in order to understand your problem.

In your special case, there are just some minor issues:

Line 21 (no code because there is just image): This statement is completely redundant. You set the frame of the scroll view to exactly the frame of the scrollview. You can just skip this.
Line 23: You set the size of the image view to the size of the scroll view. What you really want is the size of the image, because you want to be able to see the complete image (by scrolling, if it's to large)
Missing: You also need to set the content size of the scroll view, to make it realize how large it's inner content is (e.g. to determine how much horizontal and vertical scrolling it should support)

Hence:

override func viewDidLoad() {
    super.viewDidLoad()
    
    guard let img = UIImage(named: "komtar") else { return }
    
    let imgViewFrame = CGRect(origin: CGPoint(x: 0, y: 0), size: img.size)
    let imgView = UIImageView(frame: imgViewFrame)
    imgView.image = img
    scrollView.contentSize = img.size
    scrollView.addSubview(imgView)
}

Update

If you want to modify the height of the scroll view itself, you need

A constraint for the height
An outlet connection from the constraint to your view controller
Modify the constraint's value property in order to change the height

But I think a scroll view is not the best approch to this. Maybe you could check this: Swipe back and forth through array of images Swift - maybe a litte old, but might give some hints to you.

I have tried your answer but it still not make the scroll view enlarge to the same height of the image. It just make the scroll view to become scrollable which i do not want it to be scrolled. The reason i used scroll view is that i want it only to be swiped horizontally to next/previous image if there is more than one image (image slider). And, that is why i did not set `contentSize` in the code. Sorry for posting the image instead of copying and pasting the code. This is what i wanted at the end [link] (https://imgur.com/a/ZALE129) — CHEE CHUAN LOH, Jul 21 '20 at 07:47

score 0 · Answer 2 · answered Jul 22 '20 at 08:18

Very thanks to @AndreasOetjen for the hints and I have solved my problem.

How I Solved

Create a IBOutlet connection for ScrollView HeightConstraint
Set the HeightConstraint constant to the height of the image. scrollViewHeightConstraint.constant = imageView.intrinsicContentSize.height

I think this is the only way to resize the frame of the Scroll View.

The reason i use imageView.intrinsicContentSize.height instead of image.size.height is because I referred to this so that I can remain the width ratio and increase/decrease the height based on the image height.

Outcome

Image

Change UIScrollView's frame programatically (Swift 5)

2 Answers2

Update