Dynamic footer height based on UITableView Frame and ContentSize - ios

I'm trying to create a tableView in which has multiple states, some of them with footerViews that MUST fill out the remaining space the tableView.
I've been trying it using the TableView frame, and as well as the ContentSize. But turns out the ContentSize isn't right, and the footers are actually either smaller or larger than what I need them to be:
EstimatedSize for row:
func tableView(_ tableView: UITableView, estimatedHeightForRowAt indexPath: IndexPath) -> CGFloat {
switch indexPath.section {
case 0:
if myProperty != 0 { return 108 }
case 1:
if myProperty != 0, hiredRealtor { return 80 }
default:
break
}
return 0
}
Height for Footer in Section:
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
switch section {
case 0:
if myProperty == 0 { return UITableView.automaticDimension }
case 1:
if selectedRealtors == 0 {
return tableView.frame.size.height - tableView.contentSize.height
}
default:
break
}
return 0
}
A wireframe of what I'm trying to achieve follows:
And then in my ViewForFooterInSection I use the same calculations in order to have the sameHeight, and it does. But it's not the correct height, because of ContentSize. What can I do to fix this issue?

Related

Collapsable Sections: [Assert] Unable to determine new global row index for preReloadFirstVisibleRow (0)

I'm implementing collapsable section headers in a UITableViewController.
Here's how I determine how many rows to show per section:
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
{
return self.sections[section].isCollapsed ? 0 : self.sections[section].items.count
}
There is a struct that holds the section info with a bool for 'isCollapsed'.
Here's how I'm toggling their states:
private func getSectionsNeedReload(_ section: Int) -> [Int]
{
var sectionsToReload: [Int] = [section]
let toggleSelectedSection = !sections[section].isCollapsed
// Toggle collapse
self.sections[section].isCollapsed = toggleSelectedSection
if self.previouslyOpenSection != -1 && section != self.previouslyOpenSection
{
self.sections[self.previouslyOpenSection].isCollapsed = !self.sections[self.previouslyOpenSection].isCollapsed
sectionsToReload.append(self.previouslyOpenSection)
self.previouslyOpenSection = section
}
else if section == self.previouslyOpenSection
{
self.previouslyOpenSection = -1
}
else
{
self.previouslyOpenSection = section
}
return sectionsToReload
}
internal func toggleSection(_ header: CollapsibleTableViewHeader, section: Int)
{
let sectionsNeedReload = getSectionsNeedReload(section)
self.tableView.beginUpdates()
self.tableView.reloadSections(IndexSet(sectionsNeedReload), with: .automatic)
self.tableView.endUpdates()
}
Everything is working and animating nicely, however in the console when collapsing an expanded section, I get this [Assert]:
[Assert] Unable to determine new global row index for preReloadFirstVisibleRow (0)
This happens, regardless of whether it's the same opened Section, closing (collapsing), or if I'm opening another section and 'auto-closing' the previously open section.
I'm not doing anything with the data; that's persistent.
Could anyone help explain what's missing? Thanks
In order for a tableView to know where it is while it's reloading rows etc, it tries to find an "anchor row" which it uses as a reference. This is called a preReloadFirstVisibleRow. Since this tableView might not have any visible rows at some point because of all the sections being collapsed, the tableView will get confused as it can't find an anchor. It will then reset to the top.
Solution:
Add a 0 height row to every group which is collapsed. That way, even if a section is collapsed, there's a still a row present (albeit of 0px height). The tableView then always has something to hook onto as a reference. You will see this in effect by the addition of a row in numberOfRowsInSection if the rowcount is 0 and handling any further indexPath.row calls by making sure to return the phatom cell value before indexPath.row is needed if the datasource.visibleRows is 0.
It's easier to demo in code:
func numberOfSections(in tableView: UITableView) -> Int {
return datasource.count
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return datasource[section].visibleRows.count == 0 ? 1 : datasource[section].visibleRows.count
}
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
datasource[section].section = section
return datasource[section]
}
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if datasource[indexPath.section].visibleRows.count == 0 { return 0 }
return datasource[indexPath.section].visibleRows[indexPath.row].bounds.height
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
if datasource[indexPath.section].visibleRows.count == 0 { return UITableViewCell() }
// I've left this stuff here to show the real contents of a cell - note how
// the phantom cell was returned before this point.
let section = datasource[indexPath.section]
let cell = TTSContentCell(withView: section.visibleRows[indexPath.row])
cell.accessibilityLabel = "cell_\(indexPath.section)_\(indexPath.row)"
cell.accessibilityIdentifier = "cell_\(indexPath.section)_\(indexPath.row)"
cell.showsReorderControl = true
return cell
}

Change the rowheight for a particular index in a section

I have been setting the cell heights for my tableview with
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
switch indexPath.section {
case 0:
return 100
case 1:
tableView.estimatedRowHeight = 100
return UITableViewAutomaticDimension
default:
return 0
}
}
With this, for all the rows in section 1, the rowheight is set to 100. Now, I would like to change the row height of a particular row to set to 0 (i.e. make it hidden) on button click.
I have tried:
tableView.cellForRow(at: IndexPath(item: selectedIndex, section: 1))?.isHidden
Although the cell is hidden, I am left with a blank cell occupying the row height.
So I think I should be changing the row height to 0.
P.S. I know this can be achieved by removing the particular row from the model and using deleteRows(at indexPaths: [IndexPath],
with animation: UITableView.RowAnimation) But I do not want to change the model. How can this be done?
Use a flag to check if you clicked the button. Then reload the table after button click.
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return indexPath.section == 0 ? buttonClicked && indexPath.row == 0 ? CGFloat.leastNormalMagnitude : 100 : UITableViewAutomaticDimension
}
Longer, more readable version :-
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
switch indexPath.section {
case 0:
if buttonClicked && indexPath.row = rowIndex //index of required row which you can find out and store in a variable wherever necessary {
return CGFloat.leastNormalMagnitude
}
return 100
case 1:
tableView.estimatedRowHeight = 100
return UITableViewAutomaticDimension
default:
return 0
}
}

Set margin on top of a tableview in IOS

I'm new to IOS development with swift and I'm having a problem. I need to create a tableview and it looks almost the way I wanted, except for the space at the top of the first section of the table. It has no name but I would like to reduce the space between the top and the first item. What I was able to do is according to the code and image below:
override func numberOfSections(in tableView: UITableView) -> Int {
return 2
}
override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
switch (section) {
case 0:
return ""
default:
return self.nameSection2
}
}
override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let headerView = UIView()
headerView.backgroundColor = UIColor.white
let headerLabel = UILabel(frame: CGRect(x: 15, y: 8, width:
tableView.bounds.size.width, height: tableView.bounds.size.height))
headerLabel.font = UIFont(name: "Verdana", size: 16)
headerLabel.textColor = UIColor.lightGray
headerLabel.text = self.tableView(self.tableView, titleForHeaderInSection: section)
headerLabel.sizeToFit()
headerView.addSubview(headerLabel)
return headerView
}
The 'margin' you see is because the height for both the section headers is the same. The second one looks less-empty as it actually has a title.
You can modify the height for the headers to reduce the space:
func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
switch section {
case 0:
return 0
case 1:
return 44 //Required height value here
default:
return defaultValue //Any default value
}
}
You need to implement the heightForHeaderInSection so you can collapse that header. See below:
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
if section == 0 {
return 1.0
} else {
return 32.0
}
}
You can set the appropriate value for the else condition for your needs but this gives you the idea.
Update #1: I found this link in searching that may help as well: http://stackoverflow.com/a/23955420/3965
It recommends using GLFloat's minimum value instead:
if section == 0 {
return CGFloat.leastNormalMagnitude
}
return tableView.sectionHeaderHeight
Implement heightForHeaderInSection and return the height you want for the first section.
Also, you wouldn't normally implement titleForHeaderInSection and viewForHeaderInSection. Just put your switch statement in viewForHeaderInSection to set the text for your label.
And you don't need to put your UILabel into headerView, just return the label. Or instead of UIView, use UITableViewHeaderFooterView.

How to program static cells to take the height from storyboard while programming other cells to take height from code

I have a uitableview controller with STATIC cells in two sections. I have adjusted the height of cells 0 & 1 in section 0 using storyboard. However, I have used code to expand a date picker after a UIswitch is toggled and a cell is tapped in section 1.
My problem is that the code is overriding cells 0 and 1 in section 0. How do I force those cells to take their height from storyboard? If that is not possible, how would I code their height so that the cell expansion code does not override it?
Notes: I am new and don't fully understand the code that I used to make the expansion happen, so if I need to change that, let me know. Code pasted below.
var pickerVisible = false
// MARK: - COLLAPSABLE CELL
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
if indexPath.section == 1 && indexPath.row == 2 {
pickerVisible = !pickerVisible
tableView.reloadData()
}
tableView.deselectRow(at: indexPath, animated: true)
}
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if indexPath.section == 1 && indexPath.row == 2 && toggle.isOn == false {
return 0.0
}
if indexPath.section == 1 && indexPath.row == 3 {
if toggle.isOn == false || pickerVisible == false {
return 0.0
}
return 165.0
}
return 44.0
}
override func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 44.0
}
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if indexPath.section == 0 {
// set height for rows in section 0
} else if indexPath.section == 1 {
// set height for rows in section 1
} else {
// default height for your tableview cell
return 44.0
}
}
How do I force those cells to take their height from storyboard?
-> I think you don't really need this.
How would I code their height so that the cell expansion code does not override it?
-> Its pretty easy to do what you want (sample code above)
I have found another answer that really gets to the root of what my problem was -- how to program one cell to be an exact height and have all the other cells take the height from what is put together in storyboard.
The answer is instead of returning a number in heightForRowAt, you can do the following:
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if indexPath.row == 0 {
return 170.0
}
// OTHERWISE, RETURN WHATEVER THE TABLEVIEW WANTS.
return self.tableView.rowHeight

How to hide UITableViewSections in Swift?

I have a static grouped table view that has 5 sections (all the sections have headers, no footers). I created all of this using a Storyboard. Now, how can I hide the first/top UITableViewSection (including the header). I tried making an outlet to the UITableViewSection but it tells me that it is not valid (undeclared type):
#IBOutlet var section: UITableViewSection!
I did it this way because I was planning on doing:
section.hidden = true
Can it not be done this way?
My delegates and data sources are set up 100% correctly.
Swift 5:
You can use the delegate method heightForHeaderInSection
:
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
if (section == 0) {
return 0.0
}
return UITableView.automaticDimension
}
Earlier than Swift 5: Use UITableViewAutomaticDimension instead of UITableView.automaticDimension
If it's not working with height 0.0, use height 0.1
If you want no cells in a particular section, use the delegate method:
func numberOfRowsInSection(section: Int) -> Int {
if (section == 0) {
return 0
}
else {
// return the number of rows you want
}
}
Or to a neater switch-case syntax:
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
switch section {
case 0:
return 0.0
default:
return UITableView.automaticDimension
}
}
I tested both and they are working fine.
I also wish you could just make an #IBOutlet to a section and hide it, but sadly it seems not, so...
Based on various suggestions here, I've established the following, which doesn't require any interfering with explicit size values, and preserves whatever you may have set on a storyboard/XIB already. It just makes the header nil and row count 0 for any section you want to hide (which results in a size of 0.0).
Obviously, you can configure sectionShouldBeHidden to work however you need; hiding #1 & #3 are just arbitrary examples.
Swift v5
private func sectionShouldBeHidden(_ section: Int) -> Bool {
switch section {
case 1, 3: return true
default: return false
}
}
override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
if sectionShouldBeHidden(section) {
return nil // Show nothing for the header of hidden sections
} else {
return super.tableView(tableView, titleForHeaderInSection: section) // Use the default header for other sections
}
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
if sectionShouldBeHidden(section) {
return 0 // Don't show any rows for hidden sections
} else {
return super.tableView(tableView, numberOfRowsInSection: section) // Use the default number of rows for other sections
}
}
Update: Unfortunately, the above is only enough if the style of the table view is Plain. When it's Grouped, there's also additional space added between each section, which needs taking care of too.
This extra space is the section's footer, so can be handled like so:
override public func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
if sectionShouldBeHidden(section) {
return CGFloat.leastNormalMagnitude // Use the smallest possible value for hidden sections
} else {
return super.tableView(tableView, heightForFooterInSection: section) // Use the default footer height for other sections
}
}
I tried all the solutions here with no success. At the end, adding these delegate methods this one worked:
Swift 5:
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return section == 4 ? 0 : return super.tableView(tableView, numberOfRowsInSection: section)
}
override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
return section == 4 ? 0.1 : super.tableView(tableView, heightForHeaderInSection: section)
}
override func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return section == 4 ? 0.1 super.tableView(tableView, heightForFooterInSection: section)
}
Note that you need to return 0.1 in height, returning 0 won't do it.
0.0 did not work for me. I had to do this in order to make it work.
override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
switch section {
case 0:
return 0.01
default:
return UITableViewAutomaticDimension
}
}
For group UITableView with static cells only this solution works:
self.tableView.sectionHeaderHeight = 0;
self.tableView.sectionFooterHeight = 0;
override func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
let count = self.tableView(tableView, numberOfRowsInSection: section)
if count == 0 {
return CGFloat(Double.leastNormalMagnitude)
}
return 44.0
}
For anyone wanting to hide sections because they are using a static grouped tableView with a dynamic number of sections, the solution below may be of help. In my case, each section with data to display needed to have a custom header. Any section that did not have data, needed to be hidden fully.
The answer above was of great help in my scenario. However, for those who don't always know which section(s) will need to be hidden here is a solution for you extending on the above.
In my scenario, I have up to 12 entries in an array that I want to show in up to 12 sections (amongst other sections in a grouped tableView). If there are less than 12 entries to display, I want to hide the unnecessary sections by giving them 0 height and 0 rows. I also wanted to hide the headerView.
To do this, I did the following:
Set up your tableView as per the excellent answer #sasquatch gave
above.
In the numberOfRowsInSection(section: Int) and tableView(_
tableView: UITableView, heightForHeaderInSection section: Int) functions, check whether the rows/height should be 0.
In my case, I was using sections 1 - 12 for my dynamic data so I used code as below:
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
//For section 0 and 13, just 1 row is ok
if section == 0 || section == 13 {
return 1
}
//For sections 1 - 12, determine if we have data to populate it, or if we should hide it
if section <= dynamicDataToDisplay.count {
return 2
}
//If it's section 1 - 12, but we don't have a corresponding data entry in dynamicDataToDisplay, then just return 0 rows
return 0
}
The code for the heightForHeader function is similar in logic:
override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
switch section {
case 0:
return 45.0
case 13:
return UITableViewAutomaticDimension
default:
if dynamicDataToDisplay.count >= section {
return 25.0
} else {
return 0.0
}
} //end switch
}
Even after setting up these functions, I found that I was still getting headers appearing for the sections I wanted to hide. I guess I thought that viewForHeaderInSection would not be called if the numberOfRows was 0 and heightOfHeader was also 0, but it was still being called.
Adding the following helped ensure that the header wasn't unnecessarily created:
override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
//set up header for dynamic data sections
if 1 ... 12 ~= section {
if tableView.numberOfRows(inSection: section) == 0 {
return nil
}
//Continue with the header set up for valid sections with rows to display data
......
}
}
This solution might help anyone who is still getting a header being created despite its height and rows being set to 0.

Resources