UIScrollView Scroll issue in Xcode 7.2 size classes - iphone

I have to design a screen for all the devices, so I have decide to use Size Classes + Auto Layouts in Xcode 7.2, but it has been 2 days to make it work, but all in vain.
I have googled and learnt a number of tutorials but even then not able to figure out what is wrong with my scroll view.
Here is what I am doing:
Dragged a UIScrollView into my UIViewController Class.
Resized scrollview to frame (0,0,600,600) viewcontroller's size.
Selected ScrollView and press on pin icon to add following constraints:
Unchecked constraints to margins checkbox.
Leading - 0, Trailing - 0, Top - 0, Bottom - 0.
Dragged a new UIView into scrollview and added following constraints:
Unchecked constraints to margins checkbox.
Leading - 0, Trailing - 0, Top - 0, Bottom - 0.
Now Dragged from my content view to main view(View controller's View) and selected "Center Horizontally in View" and "Center Vertically in view".
Now added some UI objects to my content view like UIImageView, UILabel, UItextFields and UIButtons and put constraints on them as well. My top most object is attached to content view's top and bottom object is not attached with content view's bottom as if I will do that it will shrink my objects to fit in the screen.
If I run this code everything is looking fine, except that on iPhone 4S I am unable to scroll.
I have tried a lot of things, but nothing worked for me. Could anyone help me on the same.

You have to give the height and a low priority.
Control drag the content view on to the view of the view controller as select the 'Equal Heights' option.
See around 35 secs at this video https://youtu.be/UnQsFlMGDsI?t=35s

Related

Having and issues with UIScrollView and Storyboards in Xcode

So I have a UIScroll view with constraints which position it to the outer borders of the root view - Check
Inside of the UIScrollview I have a VIEW which serves as container for the scrollview.
The issues I'm having is that this view is that even though the bottom constraint is set to equal to the bottom of the scrollview it collapses to a height of 0 in the interface. This hides all of the views inside of the container view making is almost impossible to build the interface...very annoying..what am I missing here?
here is my constraint chart...this is really got me pulling out my hair.
See how the "view" height is 0 and also the Important Message goes to 0 height as well.
I attach a screenshot of my project's document outline which shows whole list of autolayout configurations.I think it will help you to figure out your problem.
enter image description here

UIScrollView Controller not scrolling fully

I am pretty sure this has something to do with the dreaded AutoLayout. (been trying since 2days to get hang of it)
So I mastered it somewhat, but now I have problem where my UIScrollView is not scrolling fully down, pictures are much better at explaining these things
this is the scroll view
this is the content view
so the problem is the scrolling is happening but then again it springs back up. So I am not able to click on the signup button
EDIt 1
Edit:
I have created a little example on github for you to look at, here. The project illustrates the answer below and uses the techniques I describe and nothing else.
Original Answer:
couple of things I would advise here.
First, I know you've been trying for a while but remove all the current constraints (painful I know but). Do this for clarity as ....
The view should be the size of the scene, it looks like you want the scrollview to be the full screen so that too needs to be the size of the scene.
e.g. if you are designing at 6Plus by default the scene size is 414x736 so the view and the scrollview it contains should also be 414x736.
Only the content view needs to be the size of the real content you wish to show. Let's say for arguments sake that the content is 414x1000.
Now the constraints for the scrollview are simple. It needs zero spacing to all it's edges.
You can add the content view to the scrollview in a couple of ways. The way I try to do this varies from project to project and depends mostly on how complex the scene is. If it's a really busy scene I keep the content view outside of the scrollview in interface builder so that I can work on it easily and visualize the whole of the view. Then I add the content view to the scrollview in code.
If its a simpler view You can add it inside the scrollview in interface builder. Ultimately whichever way you do it, you can lose visibility of the content view in interface builder because the contentview is larger than the scrollview and the content gets obscured. So play about and find a good way for you.
Define the content view and all it's subviews. The content view needs to be taller than the scrollview otherwise it wont scroll. All of the content view's subviews need to have defined heights from top to bottom and widths from left to right. In your case the scrollview is scrolling vertically not horizontally so all the widths need to add up to the width of the scroll view BUT the heights need to add up to the full height of the content view.
Note: if you do this proportially your life will be easier later. If you do all this with fixed heights the storyboard will break on different device sizes.
Now the "tricky bit" and it's a bit counter intuitive. You need to pin the content view to the scrollview, remember the height of the content view is taller than the scrollview. In all other circumstances in Interface Builder pinning a view to a superview (0 padding) will adjust the height (or width) accordingly. For the relationship between a scrollview and it's content view this doesn't happen.
First pin the contentview
Notice the -400? Remember the content view is taller than the scrollview and we will change this immediately.
Select the bottom constraint (-400) that we have just created:
Select the drop down arrow next to the constant value:
Select Standard Value and type in 0 for the constant.
You should now have a storyboard with no broken constraints and if you build and run you should get a scrollview as desired.
Your bottomspace to superview on your content view is set to -74.0, I don't know if there is a reason you had to do that, but try setting it to -8.0. I think your scroll view is scrolling up to the 0.0 mark automatically

UIScrollView Causing "Misplaced Views" AutoLayout issues

I'm running into a strange AutoLayout related issue when I use a UIScrollView (the issue does not occur without it).
I have a UIScrollView that is constrained to the boundaries of a UIView (contained within a UIViewController), and within that, I am attempting to place a UILabel and UITextField side by side. I have constrained the UILabel to the left and upper boundaries, with it's width and height constrained (see screenshot below):
Right next to this UILabel is a UITextField, which is constrained to the left, top, and right, as well as having the height constrained. However, this results in a "Misplaced Views" warning, that states "Expected width = 163, Actual width = 413", shown in the screenshot below:
When I choose to "Reset to Suggested Constraints", the "Misplaced Views" issue disappears, but in it's place I am left with a width constraint of 413 points, which is something I'm hoping to avoid, as I would not like this UIViewController to be horizontally scrollable on smaller devices.
A scroll view has a size (the size it takes up on the screen) and a content size (the size of the entire scrollable area). In Auto Layout, the content size is automatically computed from the constraints of the items in the scroll view. This is a problem, because you are trying to make the scroll view have the same width as your screen, and then have the items constrained to that. When you do that, Auto Layout insists that you give your text field an explicit width so that it can calculate the width of your scrollable area.
To do what you want, do the following:
Add a "content view" to your scroll view. This view will be the only top level item in your scroll view. It will hold all of your content as subviews of it. Drag out a UIView and add it to your scroll view. Constrain its top, leading, bottom, and trailing edges to the scroll view. Constrain its width to the width of the scroll view. Give it a height constraint and set it however big you want your content area to be.
Add all of your labels and textfields to this content view. Now you can constrain them centered in your content view or constrained to the edges, and it will work as you want.

Hiding elements outside of bounds on iPhone

I'm trying to get a UIView to expand (with animation), sort of like an accordion menu. I can get the animation working fine however the issue is the subviews of the UIView are expanding past the bounds of the UIView.
For example, the view has an UILabel in the top-right corner with a height of 16. Assume the UIView height is 0 at the beginning of the animation. One would expect that the content of the view be hidden and gradually reveal as the UIView grows. Once the height has reached 8, for example, half the label should be visible. However that isn't the case - rather, the label is visible the whole time, regardless if it's height extends outside of that of it's parent view.
Any ideas how to resolve this?
Okay, I had to set the clipsToBounds property to true. I spent some time googling before making the question but didn't have much luck until I saw it in the Related section of my question.

Resizing a UIView on iPhone at run-time

I'm trying to resize my app's view whenever an iAd is scrolled down from the top.
The problem is that in run-time, when i set the resized frame size of the relevant view, the resizing doesnt happen 9so the iAd is draw on top of the top 50 vertical pixels).
If I set the UIView size at design-time, then I see that the view is resized (when i run the app).
So what am i doing wrong at run-time that is causing my resizing to not occur?
The structure of my controller's NIB looks like this:
> > View
> > View (associated with IB 'contentView')
> > CustomView (UIView)
> - ScrollView
> - Toolbar (top)
> - Toolbar (bottom)
In code the adBannerView is added like this:
[self.view addSubView:adBannerView];
conteView's origin.y and size.height is what im updating (to make it y = 50, and height = original height - 50). This should scale it down so that enough room is made to dispaly the banner on top (50 pixels in height).
Are you sure the view is not nil? Did you hook it up in Interface Builder? If you're calling -setFrame on the view and nothing is happening, it's likely the view is not valid.
I resolved my issue, though in a work-around way.
I think the problem was that my view layout tree was quite complicated. Ex, i had a scrollviewer within a custom UIView. The scrollviewer was adding a UIView as its content at run-time. And on top of all this I was trying to resize various views.
But for some reason, the view(s) never managed to be bottom-justified (its always top-justified).