I have a project where I'm trying to scroll horizontally using a UIScrollView however, I can't get it to scroll.
The scrollview was added through Interface Builder, and after that it was set up in viewWillAppear() this is what I did:
let overview = CourseDetails(course: self.course, type: holes, frame: CGRect(x: 0, y: 0, width: 812, height: 100))
scrollView.addSubview(overview)
scrollView.contentSize = CGSize(width: 812, height: 100)
overview.frame.size.width = 812
scrollView.translatesAutoresizingMaskIntoConstraints = false
The scrollview has a content view width of 812, while the UIViews frame is 345 in width...
Is there a step I'm missing in the whole scrollview scenario?
You don't need to set the content size of UIScrollView. You can set it in interface builder.
Follow these steps in interface builder:
Add a UIScrollView in your view hierarchy
Add a UIView as subview of UIScrollView which will be the content view of UIScrollView. Now You will add all other views for which you want scrolling as subviews of this contentView.
Now set constraints for both UIScrollView and it's content view(UIView).
For UIScrollView set Leading, Trailing ,Top and Bottom constraints to it's superView.
For contentView of UIScrollView, set leading, trailing, top and bottom constraint pins to UIScrollView.
Now the tricky part for setting content size of the UIScrollView. Set the width and height constraint for the contentView.
You have to set the width and height equal to UIScrollView. To set these two constraints, make selection on contentView and then control + drag to UIScrollView and then choose equal width and equal height.
Now set the constraint priority to low(250) of width if you want horizontal scrolling or of height if you want vertical scrolling.
I think, CourseDetails view generation arises problem. I check this using following code:
let overview = UIView.init(frame: CGRect(x: 0, y: 0, width: 812, height: 100))
overview.backgroundColor = UIColor.green
scrollView.addSubview(overview)
scrollView.contentSize = CGSize(width: overview.frame.size.width, height: 100)
scrollView.translatesAutoresizingMaskIntoConstraints = false
It's working. Please share CourseDetails view information for resolving this issue otherwise it's difficult to trace.
Please check interface builder Scroll View settings:
1. Enable check mark for scrolling enabled [Scrolling Section]
2. Enable check mark for user interaction enabled [View Section]
Related
I have subview in a scrollview and after I remove some subview from the bottom there is a blank space and the scroll view still keeps height, not resizing. How to fix this?
Scrollview's contentHeight & contentWidth is calculated from its subviews(if used auto layout). If autolayout is not used then you need to set its content size.
So whenever you are adding or removing subviews in scrollview you need to take care of its contentHeight and contentWidth.
If you're using auto layout, you need to add constraints to newly added view in such a way that scroll view can calculate its contentHeight from it.(in auto layouts you don't need to explicitly set the content height to scroll view)
If you're using frame base layout, you need to set the contentHeight explicitly to the scroll view. In frame base layout, you need to take care of scrollviews content size.
Why is there blank space in scrollview?
When a subview is removed from scrollview, its content size need to be adjusted. It means it is not able to calculate its content size.
you can use this line
self.scrollView.contentSize = CGSize(width: self.view.frame.width, height: (YOURVIEW) - (THEREMOVEDVIEW))
I recommend you that you must save the height before remove view for later you can adjust.
UIScrollView doesn't know the height of its content automatically. You must calculate the height and width for yourself like below:
scrollView.contentSize = CGSize(width: self.view.frame.size.width, height: 700)
note: change width and height as you want.
you can try this also:
let content: CGRect = scrollView.subviews.reduce(into: .zero) { rect, view in
rect = rect.union(view.frame)
}
scrollView.contentSize = content.size
so I have added scrollview to my screen.
However, I'm unable to scroll up and down.
My scrollview width and size are 414 and 784 respectively while my content size is scrollView.contentSize = CGSize(width: self.view.frame.size.width, height: 800)
Why can't I scroll up and down?
How do I fix this?
You can add a UIView (call it content view) inside your scrollView with top, botttom, left, right constraints to zero. And give height constraint = 800 for this view.
This should work!
Basically, you need to add some content to the scrollView. If the height of contents becomes greater than the scrollView height, the scrollView becomes scrollable.
I'm using swift to build an application. I want to add some content to my view controller using storyboard.
I already put everything inside the scrollview and set the specific height, but however when I run the application, the scrollview always set longer than the button in the bottom of the view
I want the scroll view stop right after the button
Please kindly help me how to solve this problem
thank you
after scrolling
for your information, please ignore the white space between 'critics' and submit button, because actually there's UITextView between them but not visible (still try to add some border)
these are my storyboard preview
1) ScrollView Contraints
2) ScrollView -> contentView Constraints to scroll View same as above image
3) now ContentView width and Height Constraints to main View [SuperView in which ScrollView is embedded] and constraints will be as follows.
4) now click on the EqualWidth to View [Third constraint from top]and edit it as in step 6
5) contentView Width Contraint
6) ContentView Height Constraint // set priority [must] . here you need to change the first item and second item in the menu to as shown First as - ContentView.Height and second as - View.height and set priority to 250 after this a dotted line will appear in storyboard along the contentView
7) now add the content like [UIView, labels, textfields] in contentView and add constraints as Top upperMost view top space to contentView [like I have]DoubleRight imageView
and constraints for my DoubleRight imageView are
look for the Top space margin its given a top space 20 points
and same you need to do for the last item you will be adding in ContentView like I have uiView
add bottom space from this respective view to your superView[ContentView] and my constraints are:
after you had initialed all these steps results will be as Expected for every Screen size no need to change height additionally for screen sizes
Note : - [all the views must be connected to each other with top and bottom parameter]
like Flow will be
View1 - top to contentView and bottom to View2
View2 - top to View1 and bottom to view3
View3 [Last view] - top to View2 and bottom to contentView as shown
using uiView, uiimageViews their heights must be fixed
It may be helped
your_scrollView.frame = CGRect(x: 0, y: 0, width: 375, height: 667)
your_scrollView.contentSize = CGSize(width: 375, height: 1000) // You can set height, whatever you want.
You can try :
your_scrollView.frame = CGRect(x: 0, y: 0, width: 375, height: 667)
your_scrollView.contentSize = CGSize(width: 375, height: self.view.frame.size.hight)
I have a UIScrollView with several buttons in it. The buttons at the bottom of the scrollview are visible, but don't respond when they're pressed. My problem appears to be the same as the one in this Stackoverflow Question, but the accepted answer does not seem to solve my problem; the frame of the scrollview, the contentSize of the scrollview, and the frame of the view inside the scrollview (which is also the superview of the problematic buttons) all have width 414pt and height 900pt. That should definitely be large enough to encompass the buttons which aren't responding.
EDIT:
I created the scrollview in Interface Builder. The edges of the the container view within the scrollview are pinned to the edged of the scrollview.
I tried adding these lines of code:
scrolling.frame = CGRect(x: 0, y: 0, width: 414, height: 900)
viewInsideScrollview.frame = CGRect(x: 0, y: 0, width: 414, height: 900)
scrolling.contentSize = CGSizeMake(414, 900)
self.view.frame = CGRect(x: 0, y: 0, width: 414, height: 900)
Adding these lines didn't change how the scrollview looked or acted (scrolling fine, but with unresponsive buttons on the bottom.)
A UIScrollView infers its size by the view/views inside of it. You created your views in the interface builder so that could be why the lines of code you added did not work (I am not entirely sure why they did not). However, what will work is setting constraints on your viewInsideScrollview so that the scrolling expands to the full content size. For example, if you have 10 buttons in your viewInsideScrollview, you should set a top space constraint on the top most button, leading and trailing constraints, constraints to give spacing in between buttons, and a bottom space constraint on the bottom most button. The scrolling will expand to accommodate all of the buttons, and you will be able to select all of them.
I got frustrated with AutoLayout so I decided to disable it and just set the positions and sizes of the elements in my view programatically. I tried this:
func setScrollViewBounds() {
var windowFrame = self.view.frame;
var scrollerHeigth = (windowFrame.height/100)*15
BottomScroll.frame = CGRect(x: CGFloat(10), y: windowFrame.height-scrollerHeigth, width: windowFrame.width-20, height: scrollerHeigth);
TopScroll.frame = CGRect(x: CGFloat(10), y: BottomScroll.frame.maxY-10, width: windowFrame.width-20, height: scrollerHeigth)
}
Im trying to set the two scroll views (TopScroll and BottomScroll) to be at the bottom of the page and have one be on top of the other. This however doesn't seem to do anything. Any ideas why?
I'm calling the function in ViewDidLoad().
TopScroll and BottomScroll are IBOutlets.
Apply constraint following order
Put your subviews in UIView Object(Which will subview of ScrollView).
Select Both ScrollView and UIView
Go->Pin->Equal Width.(Not Equal Height)
Select UIScrollView Go-> Pin uncheck Constraint to Margin and give Top,Bottom,Left,Right constraint.
Now Select UIView(Subview of UIScrollview say contentView) control click contentView to Main View(Default controller's View) and select Leading,Trailing,Top,Bottom constraint.
Finally Select contentView Go-> Resolve Auto-layOut issue -> Reset to Suggested constraints.
Constraints for subview of ContentView as usual with respect to contentView. use viewDidLayoutSubview for setting content-size to UIScrollView.