I am adding UIScrollView in storyboard with all sides(trailing,leading,top,bottom) constraints. I have added a contentView inside a UIScrollView added constraints all sides(trailing,leading,top,bottom) and Equal width and Heights to SuperView(not scrollView) and changed height constraint priority to 250.
I have kept 3 views insdie content view for all views I have mentioned height and 3 sides(except bottom) but for last view I have kept all four sides and height.
But why i am not able to scroll till last view bottom.
]2
You give the contentView equal height constraint to main view ( Remove it )
While you should hook subviews of it so the scrollView will scroll according to the current content
Hey #santhosh I think you set a Equal height with SuperView is wrong
1. Remove ComentView Height constrains
2. set all(Three view) height and all constrains trailing,leading,top,bottom
Automatically remove(scrollview) constrains error.
Related
I created a scrollview in storyboard with multiple views but the scrollview does not scroll. See the screenshot. I have a scrollview with images and another view embedded that spans outside the view area. I would like the scroll view to scroll down but it does not when I see the code in the simulator.
You need to add a UIView with 1000(or whatever you want) height constant to scrollView and make the UIView equal width to view
ScrollView needs to know its scrollable area, so you need to provide information about width and height for ScrollView's content:
width - you can create empty view (with height constraint equal to 1), place it inside scrollView, set its leading and trailing constraints to scrollView and set width constraint equal to main view. Then, scrollView will know that its scrollable area has the same width as screen.
height - you need to provide top and bottom constraints for first and last components inside scrollView (and all components should have specified height). I guess you forgot about setting bottom constraint for the last item.
I'm trying to build UI similar to that of ios photo gallery : Navigation view controller with a scrollview occupying 80% height and 100% width of the parent's view and the collection view controller occupying the rest of the height and 100% width. So here's how it looks like :
The blue area is scrollview and its content view. The bottom part is a collection view which suppose to behave like a carousel. You can see the constraints that I have set in the following screenshot :
:
I want to set the scrollview height so that it only occupies 80% of the parent view estate and the collection view occupies the rest. However, I can't seem to resolve scrollview constraint issues such as autolayout not able to resolve height/y position of scrollview. As you can see in the above pic, I tried setting the height of the scrollview to 50% of the parent view but the autolayout still complains about not being able to resolve height. If I let interface builder resolve the issue, it just adds spacing to the content view inside scrollview and pushes it down as a result. You can see that in the following screenshots.
Your view heirarchy is correctly setup so thats quite nice and you are on the right track of what constraints to add. I'm going to write all the constraints starting from step 1.
To your UIScrollView add a top, leading and trailing constraint to the superView. Also add a equal height constraint between your UIScrollView and the superView and set the multiplier to 0.8.
Now add your UICollectionView below the UIScrollView and give it a leading, trailing and bottom to the superView. Also add a vertical spacing between the UICollectionView and UIScrollView.
Now add for the contentView inside the UIScrollView. Add a leading, top, bottom and trailing for the contentView to UIScrollView. As soon as you do this, the constraints will break and Xcode will complain. Now what you need to do more is add a equal height and width constraint between the UIScrollView and contentView. Set the priority of this equal height constraint (assuming you want vertical scroll) to something like 250, so that it breaks when the content inside the UIScrollView becomes too large to be displayed completely.
Now as far as that extra spacing issue is concerned. What you need to do is, select the UIViewController that has your UIScrollVIew and then select the attributes inspector for this UIViewController and uncheck the adjust scroll view insets option. For a screenshot, check this.
As i see from above do the following.
Add leading, trailing and top constraint to scrollview.
Add height constraint i.e drag from scrollview to superview and add equal width, in equal width constraint change the multiple factor to 0.8.
Add leading trailing, bottom constraint to collection view with respect to superview and vertical space constraint with respect to scrollview.
I have parent view at top of screen let say TOPVIEW in storyboard which contains some fixed height subview
and scrollview following TOPVIEW
Looks Like
UIVIEW
- TOPVIEW (128) FIXED
- SCROLLVIEW
When keyboard appears i want to set top view to 0 that's why i have taken IBOUTLET for same and set to 0 and top view clips bounds to YES
But constraint breaks of subviews of topview (Vertical space between views etc)
My question is how to solve constraints break due to parent view height in subview ,
i know one that we can set priority low for breaking constraint but is there any other way ?
Thanks in advance
Put the top view and the scroll view in a vertical UIStackView. When you want to hide the top view, set topView.hidden = true. The stack view will automatically move the top of the scroll view up so it fills the space where the top view was.
That is happening because you have set fixed height constraint to the TOPVIEW and you are changing that constraint constant value dynamically, so auto layout would have to break the constraint.
If you have set ideal constraints to the TOPView and ScrollView then you would just need to make two or three changes in your constraints as below,
Step 1:
Change the height constraint (128) relation from Equal to Less than or Equal as show in the image below,
Step 2:
If you have set the scrollView constraint correctly as explained in the link here, then you just have to make one change that is change the BottomSpace Constraint Relation from Equal to Greater than or Equal of the component which is at the bottom of scrollView (inside scrollView).
Step 3:
Create an outlet of Height constraint of TopView and toggle its constant value from 128 to 0 and vice versa.
That's it, it should work now as expected.
Hope it helps you.
Update
Alternatively you can also go for other way as explained below,
Step 1:
Change the bottomSpace constraint priority of component inside TOPView at the bottom of TOPView to 999.
Step 2:
Select the Clips Subviews property from attribute inspector as show in the image below,
To prove this, i have done small demonstration app and you can see the result below,
Orange View has TopSpace to SuperView, Leading and TrailingSpace to SuperView and Height constraint.
Blue View has TopSpace, Leading, TrailingSpace and BottomSpace to SuperView i.e OrangeView, BottomSpace constraint has priority of 999. And it has Height constraint.
This will do the trick.
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 :)
So I'm trying to create a UIScrollView only in storyboard that allows me to add scrolling labels for more than the height of the VC. Here's what I did:
Created UIScrollView that took up the size of the any width any height VC
Made constraints 0 for spacing to nearest neighbor on top, bottom, left, and right
Created a view that is a subView of the UIScrollView with the same width as the any width any height VC but height of 1500 (because I only want it to scroll vertically).
Set constraints to nearest neighbor as 0 for ONLY left, top, and right and set the height constraint as 1500.
I put a label at the top of the subView and at the bottom
When I run the app on an iPhone 6, does not scroll vertically as I want it to. Any ideas why this is not working? Thanks in advance.
To obtain the scroll you have to pin the sub view (the "content view") to the top, left, bottom and right of the scrollview.
In addition you have to give it (to the "content view") an explicit (=not related to the scroll view) height and width because these are used by the scrollview to calculate its content size.
In your case set the width equal to the VC main view width and the height to 1500.
When width or height are bigger than the scrollview size, it will scroll.
Scroll view constraints (pinned to main view)
Content view (pinned to scrollview + height 1500, width=mainview width) + label constraints (as an example: 20 20 from content view top left)
For an easier visualisation, I created a video on how to do that.
Video on how to create a vertical-only scrollview in iOS
Have you set the contentsize bigger than the screen itself? In your case, just bigger in height.
As Apple Documentation says:
"You must set the contentSize property to the size of the scrollable content. This specifies the size of the scrollable area."
The only solution is add constraints to the right and bottom of the bottom subview of scroll view's child view.
Also check if all the views from top to bottom have got proper constraints along with height.
For the scroll view ' s wrapper view add equal width and equal height constraint to its superview.