Scrolling in iOS for a component with variable height - ios

I am trying to make a vertically scrolling view, where the screen has three sections and scrolls up or down in totality (i.e. all the three sections move up and together together)
There are three parts of the screen - Section 1, 2 are fixed height and section 3 is scrollable depending on the number of row data that the server sends to the client
How do I achieve this in iOS - is there a way of having
Parent View
Section 1
Section 2
Section 3
and then call scrolling function on the Parent View? I don't want to go into the messy details of manually adjusting the height of the Parent View by checking the Section 3 height (variable) and adjusting accordingly - surely there is a way in iOS programming to encapsulate all this behaviour in a clean little class. Thanks for the advice

This behavior can be realized with native iOS components.
There can be different implementations but I would choose this one:
UITableView
HeaderView
UIView (Section 1)
UIView (Section 2)
Content View (Section 3)
UITableViewCell (Section 3 cell representing your first row data)
...
In Xcode Interface Builder, you can add an header view by dragging a view on top of the displayed prototype cell.
With this architecture, the HeaderView will have a fixed height, and the ContentView will have a dynamic height. And when you scroll, the whole UITableView will scroll.

Related

How to disable the scrolling of table view for first Section #iOS

I have two sections in my table view , I want to have scroll enabled for 2nd section and disabled for 1st section , how could I achieve it ?
A UITableView as a whole is a ScrollView so there is no way to only scroll one section. I'd suggest moving what is in the first section into a UIView, then placing a UITableView below that UIView that just has a single section that contains the views you had in the section of the view.
This way the top part will not scroll, but the bottom part will.
A way to workaround it is having 2 UITableViews, one with scrolling disabled while the other has it enabled.
You can disable scrolling on a UITableView on the Attributes inspector while it's selected. There's a whole section on the Scroll View the UITableView has, and in the second subsection there's a toggle for "Scrolling Enabled" which is on by default.
[Edit: I've just seen the other comment, and I'd still recommend 2 UITableViews if you are dealing with dynamic content. If the content from the 1st section isn't dynamic, you may use an UIView as it'll save a lot of time just by not needing to implement 2 UITableViews in a single UIViewController]
#vinay
Try this solution
Take a view at the top of view controller.
Below that view take tableview.
Set table style to Grouped. It makes sections of tableview scrollable.
In your case I would use Section Header for the second section and make that header as customView.
You need to call the following functions:
1) viewForHeaderInSection
if section == 2 {
... customize your header view
}
2) heightForHeaderInSection
if section == 2 {
... set height
}

What is the best way to implement complex layout with multiple collection view on iOS?

I'm implementing a complex UI for Discover screen on iOS platform.
Problem:
- Screen has 3 sections
- Each section contains a specific UICollectionView.
- First section is a paging horizontal collection
- Second section is a scrolling horizontal collection
- Third section is a scrolling vertical collection
- When user scroll down, first and second section will moved.
My solution:
- Use Collection View with 3 sections
- First section contains 1 cell, cell contains a Paging Horizontal Controller
- Second section contains 1 cell, cell contains a Scrolling Horizontal Controller
- Third section contains multiple cells
Layout as below:
However, I think you guys have another solutions which better! Please help me to contribute this problem. Thanks so much!

Scrolling Views Along with Collection View Cells

On my view controller I have 1 collectionview underneath 2 views at the top of the view controller I set the collection views height based on the size of the views so the collectionview is big enough that it doesn't need to scroll. All 3 views are inside of a scrollview so that I can scroll the views and the collection cells seamlessly. This feels very inefficient but i can't think of another way of providing this sort of seamless scroll between the views and the collectionview. Is there something else I can do to achieve the same or at least similar result?
EDIT: https://gyazo.com/8e5febea0974b0e6e0660f1714d67cbc this will hopefully explain it better. label is the view inside of the scrollview above the collectionview and four buttons are collectionview cells. Now if I add 20 buttons instead of only 4 I can scroll the collection view but it won't scroll with the label. This might also help explain what I'm trying to achieve - http://jsfiddle.net/hDwPH/
Ignore This Dummy Code
From the screen shot, I assume that your view controller consists of
1 UILabel
Multiple UIButtons
Only 1 item per row
If so, you should consider using UITableView instead. The UILabel will be section header, The UIButtons will be the rows (UITableViewCell). So your UITableView consists of 1 section, 20 rows.
If you want your UILabel to float along with the UIButtons, set the
UITableView style to UITableViewStyleGrouped
If you want your UILabel to remain fixed, set the UITableView style to UITableViewStylePlain

Making section in UITableView closed(with 0 cells) after scrolling away and returning to it

I have a UITableView where I have section headers that can be tapped to expand or collapse the section. In my particular example each section only has one row, which is either visible (section expanded) or hidden (section collapsed). (I have a UITapGestureRecognizer on the section headers which I use to expand or collapse the sections) here the process of my actions:
I'm tap on the section (this is UITableViewHeaderFooterView custom view) and i see the cell that appears under the section header. At this moment everything is going OK. But when i scrolling down my tableview, cell goes behind header (like in Contacts application , header is first letter of contact). And finally when i scroll enough to don't see that section with that cell on, and when i scroll up - to return to my display that section - i want to make this section automatically known that when i return(from scrolling away that section from view) to it - i want that section already was closed with 0 cells in it.
Maybe i must use -(void) prepareForReuse at my custom UITableViewHeaderFooterView, or scroll methods ? or any tableView methods?
Thank you
You can implement the scroll view delegate methods and use them to check the scroll position (contentOffset) and / or the visible cells (indexPathsForVisibleRows). Once you know that you can collapse any sections that are no longer visible. You should probably use one of the scroll methods that means the scrolling has stopped (maybe scrollViewDidEndScrollingAnimation:) because changing the table view content size (which changing the number of rows will do) during a scroll animation could cause it to stop abruptly.

UITableView with Pages that contain X rows

I'm trying to achieve a UITableView that can be scrolled horizontally by page, each page containing 10 rows (every row has the same height)
I know UITableView extends UIScrollView but pagingEnaled + contentSize doesn't seem to do the trick so I'm stuck
Basically I have a UITableView with 100 rows and I'd like to have pages of 10 that I can scroll horizontally, How can I achieve this?
There are 2 solutions:
Either you go with the newly added in iOS6 UICollectionView (but then you need to set as a minimum target for your app iOS6)
or you add 3 UITableViews inside a UIScrollView next to each other and move the first or last UITableView when a new page is displayed to the UIScrollView.
There is a ready to use implementation for this here: https://github.com/arconsis/ARTableViewPager

Resources