Detect a UIScrollView's height dynamically - ios

I have a real problem with detecting UIScrollView height. I searched a lot and found this solution:
So I dragged from Content View to View and made Equal Height. But I does not work for me.
I also tried to calculate scrollView height according to elements height in it, but I do not think that it's a right way.
How can I set UIScrollView height dynamically? What is the correct way for doing it?

Your ScrollView should add a ContentView like this:
select your scrollView and in size Inspector bottom, set the width like this:
for more details on how to handle scrollView in Interface Builder your can check out this AppleDoc Working with Scroll Views
Hope this help you!

You only way to set height of your scrollView is by calculating the height of individual objects added to scrollview.
Programatically, calculate the height of each UI object and at the end set content height to scrollview.
[scView setContentSize:CGSizeMake(300, height)];
In above line, 'height' is nothing but a sum of all heights of all UI objects calculated.

By doing the below stuff's, I was able to implement UIScrollView with Automatic height based on the contents inside.
Add scrollview to the main view.
Add one ContentView inside this container scroll view.
Give proper constraints inside this content
view to the container scroll view as well as to its internal UI
Components. Please note that you should not give fixed height to the
content View. The constraints of the content view should grow
according to the UI Components inside
This might give you a layout
warning as 'Unambigous.... '. To fix this, give 'Equal Heights' constraint relation between content view and scroll view
Try the above steps, and this will solve your issue :)

Do you want to add item (UIView, UILabel...) in your UIScrollView by auto layout? If so, just put these in it and create correct constraints for them.
The key point is each item which in UIScrollView have top, leading, bottom and trailing side constraints to their superview. Most important is Make Sure that your UIScrollView has top, leading, bottom and trailing Descendant Constraints to its sub-items. It will calculate correct content height of scroll view for you.
In your solution, if your contentView has zero frame, it will not give you any height for scroll view.

Related

Why is there a big margin in my scrollview when it's all set to 0

I have scrollview with a stackview with all my contents. I set all my margins to 8px but for some reason, there is a big space to the right. Even if I change the margin to 0px.
Am I doing something wrong?
Is it maybe better to make a tableview and make a cell out of my stackview? Seems very unnecessary to do this. But I cant figure this out.
When you define constraints inside a scrollview, the content doesn’t bind to the scrollview but to the content insets (margins). With this you can install content that is wider than the scrollview and be able to scroll horizontally.
What that means is the content of your scrollview can’t deduce its width just by sticking constraints to the sides, you have to explicitly set a width constraint on a child view.
In your example, it will use the smallest width it can, which looks to be the width of your three checkboxes.
To fix that, add a width constraint to any child view, like your first text field, or better, on your text edit because it takes the whole width.
In addition to this, you should add a CenterHorizontally constraint on your text edit too and make your left constraint on "Equal or Greater" or else your content will be aligned to the left.
Here is the official documentation on ScrollView to see this in more detail.
The content inside the scrollView must be the width of the device. The scrollView will not adjust to that width by itself. First try to set "equal widths" constraint of the scroll view to the view controller. If that doesn't work, keep reading.
For this StoryBoard, what you must do is put a UIView inside the scrollView.
The scrollView must be equal widths and equal heights of the viewController. Then the UIView must be equal widths of the scrollView, and then set its top and bottom anchor to the top and bottom anchor of the scrollview.
Copy all your subviews into this UIView.

UITextView not visible on UIScrollView

Ok, so what I have is a UIScrollView that is constrained to all four sides of the main view, centered both vertically and horizontally, and set to have equal width and height to the view. All of the subviews that I put on top of the UIScrollView are showing up when I run the app, exactly where I want them to be, but only the UITextView at the bottom is not. It seems like I've tried every combination of constraints but it never appears when I run the app regardless of what I do. Here is a screenshot of the constraints in the interface builder:
And even when I preview the file Main.storyboard before running it looks like this:
But when I actually run the app, the screen is missing the UITextView, even when I alter the constraints in a number of ways:
Any help with this problem will be greatly appreciated! Thanks in advance.
Avoid putting all your subviews directly inside the scrollView. The autolayout will break apart.
You need to :
Add a UIView inside the UIScrollView, with constraints 0-0-0-0 to leading-top-bottom-trailing to the UIScrollView, and put all your subViews inside that UIView.
After that, you need to set the contentSize of your UIScrollView by code.
Also, you can:
add missing constraints to see what is missing.
The left panel in UIStoryBoard (Document Outline), you can press the red arrow showing up to see what is missing or conflicting.
Check out Apple documentation for more details.
If you want your scrollView only scrolls vertically you shouldn't set its height equal to its superView so remove it and just set the width to its superView and then it should calculate the height based on the subViews inside it
I offer you to drag a UIView in your scrollView and set the constraints to its four sides, and name it containerView , then set its width equal to background view and start laying out your views inside it not inside the scrollview :)
If Height of all views in the scrollView is clear, it can infer the scrollView's height
in this case you can set a fixed height to your containerView like 800 to get rid of the red lines and check how it works :)
I have noticed some clues you might have to solve which could probably solve the issue. Since the scrollView is extend by its content's elements, you have to explicitly deal with each element in the scrollView:
For imageView on the top is not well constrained, you need to give it a width or aspect ratio. Fix the imageView issue might solve textview height problem, even it's not still is a good start.
TextView bottom anchor is equal to scrollView bottom anchor, but you have to know textView is also kind of scrollView. So it's not reasonable to constraint each other at same time. Because both of them don't have explicitly height. You can try to type some words in the textView which will at least give it height by its content, then the scrollView can detect the textView bottomAnchor. You might see something then.
Your scrollView's height is equal to view's height is also weird, scrollView shouldn't constraint its height at first. Because it can't be "Scroll"View anymore because it's height is constant. you should let its width equal to view, and let the height be decided by its element's height. Then it will be literally a scrollview.
Hope it helps

Not able to set ContainSize of my ScrollView through Storyboard

I am adding more than 8-9 controls in my ScrollView but I am not able to set ContaintSize of that ScrollView so that I can able to scroll and view all controlls.
I HAVE SET below constrains to my scrollview and add some controls into my scroll view with the help of contain view.
Scrollview.top respect to his superview
Scrollview.bottom respect to his superview
Scrollview.leading respect to his superview
Scrollview.trailling reapect to his superview
Than I have added UIView as contain view and set all constrain respect to scrollview.
Than added all controls into view but still its not scrolling as expected.
By below code I am able to set containview but its ststic one and cant assume that 1000 is my contanent height.
Scrollview.contentsize = CGSizeMake (Scrollview.frame.size.width,1000);
Above part is static as I have many lable with multiple line in it.
All data is dynamic comes from server si cant set it static.
Can any one help me out how to set autolayout of scrollview so I can get dynamic content size?
Edit: some time I am getting autolayout error into storyboard like below.
Scrollview has ambiguous scrollable content height
An while i reslove conflicts its not showing proper scrollview in my screen.
Faced the same issue recently. I'm sure that you did your research but here is the guide I used, nonetheless.
https://www.natashatherobot.com/ios-autolayout-scrollview/
Also if you have many labels it would be good consider using a 'UITableView' or a 'UIStackView'.
Edit
Make sure you center the scroll view vertically and horizontally in respect to its container.
You have to define constraints for the scroll view like this..
ScrollView :
top ,left , bottom, right pinned to superview.
ContainerView:
top, left , bottom , right pinned to scroll view
width pinned to main view
And make sure that every subview inside the container view should have constraints in such a way that it should define the height of container view.
As i understand your issue you forgot to set the height constraint of your contentView, just try by setting it.
No need to set the fix height of scrollView's contentSize, please see the below code.
self.scrollview.contentSize = CGSizeMake(self.contentView.frame.size.width, contentView.frame.origin.y + contentView.frame.size.height + 10);
Note: you need to add height and width constraint of contentView if you need scroll according to it.

How do I add UIView on UIScrollView

I wanted to add some labels and textfields on my view and that view should scroll, so I am thinking of putting view on scrollview.
I wanted to add some labels and textfields on my view
And that view should scroll
So I am thinking of putting scrollView
And then I wanted to put my view having labels and Textfields
Is it possible?
Please check scrollview property Bounces Vertically is checked or not if not check it
May be, your content is less, than ScrollView, that's why scrolling is disabled
Put view with labels in scrollview. Scrollview should be less in height than view. View should have height considering all ui cvontrols in it. should work like this
Make sure your scroll view height is not greater than view its content size has to be greater as all people says. You get confused between content size and scroll view height.
Meas using nib suppose your scroll view height is 300 and when you use the code content size should be greater than 480 so it will be scroll-able on iPhone 4 size device who's height is 480
To make sure your constraints are well defined, first check these steps:
Make sure your base view is a UIView
Put into a UIScrollView and add constraints to the edges of UIView
Put into the scrollview a UIView and add constraints to the edges of the scrollview. I call this "content view".
You should assign a width to the content view. I usually set the width of the content view equal to the width of the scrollview.
Put your labels/views/images/whatever into the content view and use autolayout constraints to resize them automatically to fit the target screen.
Please consider that:
Your scrollview must always have a height, fixed or dynamic. In order to avoid errors with autolayout, consider that:
the last element on the bottom of the content view must always have a constraint to the bottom edge of the scrollview, or
the content view must have a fixed height
If the height of your content view is less than the height of the scrollview, the view will not scroll. You should add more views or more margin to the bottom constraint of the content view.

scrollview has ambiguous content width on Xcode 6

I can't understand how can I solve this auto layout problem, i have this View:
There is an UIScrollView with the elements you see in the View, but the View gives me this warning:
scrollview has ambiguous content width
I can't understand how to solve this problem, I want the the view is for the full screen size, and I want that the width will be the screen width, how I can solve it?
I observed its fix in XCode 7.3 and it is just 10 sec work. I made a video on it. Check here:
https://www.youtube.com/watch?v=yETZKqdaPiI
All you have to do, add a subview to UIScrollView with same width and height. Then select ViewController and press Reset to suggested constraint. Please check video for clear understanding.
Thanks
This is because you are not providing enough constraints so that Xcode can find Width of your scroll view.
You can see on your screen there isn't any constraints that can be satisfied to find width of scroll view.
You can do it by providing leading and trailing space of Image view which contains fix width. It also can be done with any other views. But i will prefer control which contains fix Height & Width So there isn't require to set hugging priority or Compress resistance.
Put everything in a View and that View put inside a ScrollView.
Editor -> Embed in -> View
The solutions is:
You have a UIImageView at the top. You set the width of the UIImageView to be the same as the width of the root view of the UIViewController
You set the leading and trailing space of the UIImageView to the UIScrollView to be both 0
You set the height of the UIImageView to be the height you want the image to be. And then you set the view mode of the UIImageView to be 'Aspect fit'.
I had the same problem a month ago. Add a constraint that makes the UIView inside the UIScrollView have the same size of the UIScrollView's content width. If you have multiple views inside the UIScrollView, put your UIViews inside a new UIView and make sure the new UIView has the same content width size as the UIScrollView.
Best regards,
I too faced this issue and the only way i got it solved was using the below strategy
Add a scroll view and set its constraint to fill in the screen
Add a UIview inside the scroll view lets call this view as the content view.
In this contentView, set top, bottom, left and right margins to 0 (of course from the scrollView which is the superView);
This should do it now you can follow step 3 and continue with your UI
Place your view inside the content view and add constraints to it accordingly.
Hope it helps

Resources