I really hate to ask here because I usually try to figure things out on my own. But on this one I've stuck for days and can't find a solution anywhere online.
I have a ScrollView containing multiple subviews. I've got an image view and two labels at the top with fixed heights. Then there is a UITextView and another ImageView (see pictures).
I add the text to the text view programmatically so it should have a dynamic height and the ImageView should move to the bottom so you can scroll. I don't want the TextView to be scrollable in itself but I want all the subviews to move as well.
I know I should be able to solve this issue using constraints. But I feel like I've tried everything and nothing worked yet. It worked when I disabled auto layout and moved the views manually. I'm wondering if there is a better way though.
As you can see I pinned the TextView to the ImageView above with a 1,000 priority and to the ImageView below with a 1,000 priority. The height constraint can not be deleted so I set it to the lowest possible priority. The ImageView on the bottom is pinned to the bottom of the superview with an absolute height. Its height constraint also has low priority. (I can post an image of the ImageView's constraints, if it helps)
I also tried adapting the frame programmatically but this is not working well in combination with auto layout. (If it helps I can of course post the code)
What am I doing wrong? Shall I just disable auto layout and do it manually? This seems unclean to me. Is it even possible to do?
I really appreciate your help :)
Greets,
Jan
Make sure the Scrolling Enabled attribute on the UITextView is unchecked in Interface Builder. I believe that the Auto Layout system takes that into account when it calculates the intrinsic content size.
If somebody is struggling with a similar problem: This is what I ended up doing:
Remove all subviews from the ScrollView in IB
Programmatically add a single UIView to the ScrollView.
Add all the views to the UIView as subviews (move them using setFrame)
Set the Frame of the UIView appropriately to the subviews
Set the ScrollView's contentSize to the size of the UIView.
A little more work but it finally works. This follows Apple's mixed approach guidelines that can be seen here (look for UIScrollView): http://developer.apple.com/library/ios/#releasenotes/General/RN-iOSSDK-6_0/index.html
The problem is the height setting. You somehow have to try to delete it. If you have added other constraints that are "sufficient", it should become deletable.
At the moment you have one user constraint for the height that is "Greater or equal" and an "Equals" constraint as well. Clearly, those are not working well together.
Maybe there is a conceptual error as well. The lower image view should not be fixed in position, so the distance to the lower image view will not be a "sufficient" constraint to let you delete the fixed height.
I think it should work if
the lower image view has a fixed height and
a fixed distance to the text view above, and
the text view has a minimum height as well as
a fixed distance to the image view above
(which should be fixed in relation to the superview).
Related
Actual image is.....
->View controller
->view
->ScrollView[[top,bottom,leading,trailing]to its super view]
->contentView[[top,bottom,leading,trailing,vertical,horizontal]to its scrollview].
that actual image is for iphone6 ->iphone4s,Any one help me how to do this.....
When it comes to set constraint with scrollview then little bit extraa effort is required for handling scrolling so that Scrollview + autolayout works.
First of All What exactly take place when autolayout is used :
When you use the auto layout, your views will resized automatically based on the constraint properties.
But, when you use a UIScrollView with auto layout like a container, the auto layout not works like expected.
so Here is Very good tutorial g8production which clears this confusion. Big Thanks goes to g8Production for providing this tutorial.
I think you are setting the constraints for content view in wrong way. You are trying to set the constraints on contentView that are related to its container(scrollview) which don't know content size of its own. It determines its content size from what it contains (in your case contentView,). Both are dependent to each other for their size. So both are confused.
To solve this you should first set the fixed height and width of contentView and then make outlets of these constraints and update these constraints with the height and width of superview when your view loads.
add top, bottom , leading and trailing space to your scroll view to view. It should be set accordingly, how you you want it to be seen. Then set same for content view (image). just addheight and width constraint for your image.
Misha :)
I have a problem here. For last 3-4 days I'm trying to the find the solution but no avail. I'm using a xib to load a view as a subview to scrollView.
I'm using iOS8 and size classes and auto-layout as well.
The problem is that the view gets added to the scrollview but scrollview is unable to go beyond a point. That is I'm not able to scroll till the bottom.
This is frustrating as I have just started to develop iOS apps.
I'm attaching the screenshots for the constraints that I have applied. Hope to get some help here.
The first screenshot is the actual view controller's view that holds the scrollview.And the Place Detail Info View is the placeholder where the view loaded from xib is added. The screenshot also lists the different constraints as well.
The second and third screenshots is of the xib file which i'm trying to load into scrollView.
Please let me know where I have gone wrong.
As said above, the issue is related with the content size of your scroll view. Just try adding width and height (either explicit or implicit: see explanation below) constraints to every direct subview of your scroll view and then define all distance constraints among those.
* By "implicit" width/height constraints I mean things like "aspect ratio", "equal width/height" relation between two views.
P.S. When dealing with scroll view-like controls and auto layout, there should be an exhaustive (some of which may seem redundant) set of constraints for subviews.
Hope this helps.
Your problem is with the view who is immediate subview of your scrollview.In autolayout,scrollView calculate its content size according to its subview.
follow these steps after removing all constarints from this view,i hope u will get your problem solved.
1.for your scroll view,set all 4 constraints i.e leading edge,trailing edge,superview and bottom constraints.
2.now for the view that is immediate subview to your scrollview,set all 4 constraints (leading,trailing,top and bottom),along with these set height constraints and make width equals to scrollview.
if your immediate subview's height is greater than your screen size or scrollview,it will scroll for sure.
run and check whether you are able to scroll and proceed furthur.
after step 2,all your constarints related ambgious type error will resoved.now you can set all other constraints as usual.
for more clear understanding setting constarints in scrollview see this https://www.youtube.com/watch?v=4oCWxHLBQ-A
In interface builder itself there is an option to preview your constraints for all the available devices. This will ensure you that the constraints work fine for all the available devices from Apple. Here is a quick tutorial that will help you with it.
http://adoptioncurve.net/archives/2014/08/working-with-size-classes-in-interface-builder/
Once that is verified and you are still not able to find a suitable solution, then probably there is something wrong in the content size for your scroll view. Try to increasing your scroll view content size.
I hope this should solve your problem.
Happy coding. Cheers :)
I have been struggling for days with this implementation, and even though I have tried to do every tutorial I found on the web, I still cannot make things work the way I want.
Basically, I am trying to put my login form in a scrollview, so that it takes the whole screen at first (and on all iPhones / iPads), and if the keyboard appears everything should move. The problem IS, my view doesn't take the whole screen... Either it is too large, or too high, even though in Interface Builder everything seams correct (from layout to constraints). Below and image of the layout I want to achieve (I am using an universal storyboard, with Size Classes and Autolayout enabled):
http://img4.hostingpics.net/pics/829115app.png
Can someone point me out on achieving this layout ?
Thanks in advance.
I would suggest pinning top, leading and trailing spaces of your scroll view to its superview. And set a bottom space constraint less or equal to the keyboard's height if you set it to 0, the scroll view won't be able to resize.
With your form layout set vertical center constraints and top space to superview constraints for your top label being more or equal than the distance you set in the IB, and then you can set relative space constraints between each of the components.
Hope I answered your question.
Edit: Just the provided project and got it working. I think the problem is caused by it being a containerView inside a scrollView. And both the container and the scrollViews content view adapt to the size of its subviews. Because of that, setting relative constraints won't help.
What I did was to set an explicit size (screen's size) to the containerView and setting setTranslatesAutoresizingMaskIntoConstraints(true) to it.
I modified your project and uploaded it here
I have a pretty complex view and am trying to update it to work with autolayout (while I learn autolayout at the same time). Here is a screenshot of my view:
The only thing that you can't see is that all of these views are wrapped in a containerView and that container is sitting in a vertical scrolling UIScrollView.So if there was a really long description or something you would be able to scroll vertically.
My first problem is that I can't figure out how to get the descriptionView (red background) to adjust it's height dynamically (I have scrolling disabled in IB and again in code). I think it might be related to the bottom constraint to the imageScrollView.
The second problem is that the imageScrollView needs to be removed half the time. It holds multiple pictures of an item. But sometimes the item doesn't have pictures so I just want to remove the scrollView in that instance. I call removeSubview in code and want things to just readjust without having to set up a bunch of new constraints. So I added a top space constraint from the Question/Comments label to the bottom of the description and changed its priority to 900 instead of 1000. This seemed to solve my first problem and when I remove the imageScrollView the description view resized to the size of the content. However my scrollView that holds all of the content didn't scroll anymore, I am assuming that the containerView's height got screwed up or something.
Edit: the more I think about this the more I think that figuring out how to add a contraint for the size the descriptionView's height to match the content will solve the other problem as well. Here is another screenshot with the current constraints.
SOLUTION
I don't feel it is fair to post my own solution as the accepted answer. So I am posting my solution within the question, and giving the accepted answer to Nikita for trolling all the questions related to textViews being sized to their content.
My first problem is solved by using this: Github - Resizable Text View
The second issue was just a matter of setting up the constraints correctly. The red textView had a constraint to the bottom of the superview(contentContainer) (the superview which sets the height of the the main scrollView.) So when I removed textView then the contentContainer view didn't have a height constraint. So I ended up removing the constraint from the textView to the superview (which is the contentContainer) and made a constraint from the bottom of the commentTextView to the contentContainer. This solved the problem. Whenever I remove the red textView everything shrinks up the way I desire.
I'm not sure, that my solution is the best one, but I've done it in the following manner (I think that will help you with red text view): How do I size a UITextView to its content?
Unfortunately, I didn't understand you about second problem. Please, provide more details. Thanks!
Don't remove the image view. Just give it a zero-height constraint. That way you don't have to mess with any of your other constraints.
I am having a very frustrating issue. I know there are all kinds of issues with UIScrollView in iOS7 and XCode 5. I need to implement a scrollview and there are all kinds of tutorials showing you how to do it by switching off auto layout but that then messes with the rest of the views in my app.
I tried the fix of putting my subviews into a container UIView and placing that in the UIScrollView and setting the scrollview's content size to the size of the contained UIVIew. That didn't work. Now I am working with placing everything in the scrollview and it all works with one exception. When I load the view on the simulator or a device the content view is moved down but somewhere around 60 points or so. See image below.
That white space below the title bar on the right is still the scroll view as I can press and drag within it. Adjusting the contentOffset doesn't do any good as that just scrolls the view down slightly. I have no idea what to do here.
Just a little more info: I setup the scrollview and all the subviews in storyboard and the connected them up. Not sure if that has any bearing on it.
Thanks in advance for any help you can provide.
I think your Scrollview top space constraint have 64 pixels. That's a problem. So, set your top space constraint value to 0.
You need to add the constraints before view displayed then contentsize will be set automatically.
Check UIScrollView's autoresizing mask. It has to be set like this.