I have never used UIScrollView before, so I apologize in advanced if my question seems dumb.
I add a UIScrollView to my storyboard scene and then I added labels inside my the scrollview. But when I run my app nothing scrolls. and my text runs off the app screen. Here is a screenshot of the list of items inside my storyboard scene
My question is, is there any steps I may have missed to get this working?
Set this in code:
// the size dimensions should be larger than the scroll view's frame size.
scrollView.contentSize = CGSizeMake(xSize, ySize);
Your problem is because scrollView has contentSize property which is not set yet. So it's not scrolling. To do it in code you should try out David's answer to try it in storyboard, you should add these constraints
These two constraints will make height-
scrollview vertical space to toolbar(bottom constarint)
scollView vertical space to launchImage(top constraint)
These two will make width
scrollView leading space to container/superView
scrollView trailing space to container/superView
Related
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/.
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 have a followed this answer Putting a UIScrollview in a viewcontroller (storyboard) to embed a scrollview in a viewcontroller (Mine is vertically instead of horizontally).
All the constrains are working except the fact that the view bounces back when it is let go. I have tried a lot of different solution, but none is working! Please help, I'm using autolayouts my main goal is to be able to show all the buttons on the screen through scrolling.
EDIT:
I have been trying all types of ways to increase the contentSize, but nothing happens - the scrollview won't scroll properly. I tried different codes from people with the same problem, but the bouncing won't stop. Am I doing anything wrong on my constraints? This is extremely frustrating, please help. My constraints (using autolayout) (as I said, I followed this answer Putting a UIScrollview in a viewcontroller (storyboard))
You have to increase your scrollView's contentSize to fit all of it's sub views.
You should add subview to scrollview, then add all other views to that subview.
scrollView
contentView
subview_1
subview_2
Then add constraints between scrollView and contentView (leading, trailing, top, bottom) and contentView should have width and height constraints set properly (set width equal to scrollView width)... the content size will be calculated automatically.... just set height
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
This is a storyboard app. I added a UIScrollView on top of the UIView that is there in the view controller by default. Then I added some UI elements on to the scroll view. After designing the viewable part of the Scroll view, using its handles I stretched it vertically and pushed it up a bit so that that part is visible for me to design the rest of the screen. After I was done I positioned the scroll view back to fit the view. Please note that I did not resize the scroll view to match the size of the view from the IB.
Then I added all 4 constraints to the scroll view (Leading and Trailing space to superview, Top and Bottom space to superview). Then I selected the UIView, opened up the size inspector and changed the Bottom Space to superview's value to 0. That automatically resized the UIScrollView to fit inside the view controller.
Then I added the following lines of code inside the viewDidLoad method.
self.scrollView.contentSize = CGSizeMake(self.view.frame.size.width, self.scrollView.frame.size.height);
self.scrollView.frame = self.view.frame;
But this does not work. The UIScrollView won't scroll. Yes, the scrolling is enabled.
Can anyone please tell me what I might be missing here?
Thank you.
EDIT:
I found an old project of mine here. It utilize the way I just explained above and it works! No idea why it doesn't anymore.
I also added a demo project here with the issue.
If I understood your code correctly (a screenshot of the view would help) you set the scrollviews frame to be full size of the view and set then contentSize to the view's size. A scrollview scrolls only if the contentSize is larger than its size.
This might not be the complete answer to your question, but it will help you and others for sure.
To design the views that are bigger in size than the size of the UIScrollView, the best way to have the UIView as a child view to UIScrollView and put all the content on the UIView and finally place the UIView as subview of the UISCrollView. AT last you can set the size of the UIView as the content size of the UISCrollView.
Cheers. :)