I'm trying to use a UIStackView within a UIScrollView and I was hoping someone could point me in the right direction in creating the right constraints because I can't figure out what the problem is.
These are my constraints and ViewController structure.
So DestCont is a UIView that has a fixed height and ContentCont should take up the rest of the space, which could be (and is) larger than the screen so it should be able to scroll.
When I test it out in the simulator, I have the following problem. (Resized it so it would fit in the 2MB cap)
The green is the Root View and the black color is the ScrollView, as you can see, it cuts off the bottom portion of the ContentCont view.
EDIT
I changed the constraints, removed the fixed UIStackView height, but now, it doesn't show the bottom UIView that's in the UIStackView:
From your screenshot we know that you have set the StackView's height constraint equals to the self.view's height. Then the height is fixed(equal to one screen's height), even though its content view's height may be larger than the screen.
And UIScrollView will calculate its contentSize depending on its content, so in your case its contentSize's height will always be one screen heigt.
Delete this height constraint, let the ContentCont's content decide the height of it. Also please make sure your constrains in your ContentCont are correct.
I ended up with being fine that just my "ContentCont" UIContainerView will scroll and fixed the switching by using the following tutorial: https://spin.atomicobject.com/2015/09/02/switch-container-views/.
Related
Swift 5/Xcode 12.4
My app uses a UIScrollView to zoom its child UIImageView (which is filled through code). This part works but the ScrollView keeps complaining in XIB that it's missing constraints for the x/y position or width/height.
As you can see, the ScrollView has a top, leading and trailing constraint and the width is set to equal the height. From my understanding it knows its dimensions and position because of these constraints but apparently it's not enough. I do NOT want to center the ScrollView vertically and as the app has to support both iPhones and iPads, I also can't just set a fixed "bottom space to" constraint for the ScrollView.
I already tried to set the ScrollView's width to the ChildView's width and center it horizontally in it but the warning still didn't go away.
I've seen suggestions to put the ScrollView's contents inside another UIView but in my case it's only a single image and if I embed it inside a view, then the zooming breaks.
Why is the ScrollView still missing constraints and how do I fix it (without changing the overall layout of this ViewController)?
A UIImageView (without an image) has no Intrinsic Content Size.
If you're going to be setting its Width and Height constraints via code, but you want to get rid of the IB layout complaints, give the image view a Placeholder:
Edit
If you want the view(s) to be sized in IB, but you're going to change the constraints at run-time, you can either:
Connect the constraint to an #IBOutlet and change the .constant via code (more problematic to change the multiplier if needed, so probably not the way to go)...
Or...
Give the view constraints in IB but set them as Placeholders by checking "Remove at build time":
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
I created a new UICollectionView in the storyboard. My problem is that the cells try and fit a larger width than the width of the device, so the ones on the right get cut off. What's a good way to fix this?
you need to pinned all edges of your UICollectionview...check out here
By pinned all edges, you'll get equal height and width of screen
You need to add the proper constraints to your collection view. If you want it to be the width of the screen, then add 0 length spacing constraints to both edges of the controller's self.view (top and bottom as well if you want it full height).
I am trying to create a screen where scrolling is required in iphone 3.5 inch screen . I have attached images which contain the configuration of uiviewcontroller , uiscrollview , uiview . The problem is eventhough the height seems to increase , when i run iPhone 4s , some part of scroll is hidden beyond the UIView (Although uiview height shows 700 when i print the height in console) . What might be the problem ? Please help me ?
You have constraints that have negative values. On the last screenshot, which I assume are the constraints from the view inside the scrollView, the bottom offset to the superview is -400.
I think this is why you don't see the entire view because the bottom offset is negative. Try setting this value to 0, this should fix it.
If this does not fix your problem, maybe you could specify for which view the constraints from the images are.
Let me know how it goes! Good luck!
When you work with UIScrollView and AutoLayout it's always tricky.
You have to add all your subviews to one UIView and add that view to UIScrollView.
Autolayout Constraints you need:
For UIScrollView:
Left to Superview
Right to Superview
Top to Superview
Right to superview
For Inner View of UIScrollView (i.e The only view inside ScrollView):
Width & Heigh
Left, Right, Top and Bottom constraint to Superview (i.e. ScrollView)
Also add Horizontal Centre to Superview.
And it'll work like charm (Works every time for me at least:)
The contentSize must be larger than the scrollview's frame for there to be anything to scroll. :)
In this case, they're both (600, 1300) so change your scrollView's height to (320,480)
It's a bit confusing, but as Yuvrajsinh told you, you need to set the auto layout constraints for your scroll view to its 4 sides to the superview. Then do the same with the content of the scrollView, and the most important: Set a fixed/not related with scrollview height and width for the content
Thanks for the information and suggestions . Now it is working correctly . What i did is
set scroll view top ,left , right , bottom aligned to superview
Set content view of scroll view to top , left , right , bottom aligned to scrollview
set the content view of the scroll view to "Equal Heights" and "Equal widths" to the top superview.
Then i set the equal height constraint to have low priority of 250
Now i can scroll whenever required based on the size of the phone screen :)
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