Section footer of UITableView is moving when keyboard is appearing - ios

I have a UITableView with different sections in it. Each section has its own footer (just a grey line for design reasons). When clicking on a table view cell in a section an AlertView and the keyboard appears (to enter a password). But when the keyboard appears the footer of the section is pushed up by the keyboard. U can see it behind the AlertView in the grey background. Looks very ugly.
How can i avoid that? The footer in the background should stay where it was (on the bottom of the section). Any ideas?

There is a work around for this which worked for me, set tableView.sectionFooterHeight = 0 when textFieldShouldBeginEditing.
func textFieldShouldBeginEditing(textField: UITextField) -> Bool {
tableView.beginUpdates()
tableView.sectionFooterHeight = 0
tableView.endUpdates()
return true
}
func textFieldShouldEndEditing(textField: UITextField) -> Bool {
tableView.beginUpdates()
tableView.sectionFooterHeight = 100
tableView.endUpdates()
return true
}
Make sure you're setting the footerView height using tableView.sectionFooterHeight = 100 in viewDidLoad() and not using the func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat

Related

Keyboard pushes FooterView up when its opening < TextView > Swift

I have a problem that I couldn't find any appropriate solution.
I have a tableView with custom cells which holds a textView inside.
also I have a blank grey footer for the section.
whenever I click on the textView and the keyboard pops up the footer in that section goes up and hides behind the textView field.
I don't know how to make that footer sticky so it won't move when the keyboard pops.
if anyone have a solution it will be great!
thank you!
func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
if section == 0 {
let footerView = UIView()
footerView.backgroundColor = .red
return footerView
}else {
return UIView()
}
}
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 8
}
Set your tableView as grouped give height to the tableview footer and tableView Header in the tableview header,footer height functions.
If you are not using tableview header the set the height of the header to .leastNormalMagnitude .
This is the way to make the tableView Footer Static.

UITableView weird scroll behaviour with navigation bar large title, bounce effect at the top auto cut off / jerky when scroll to top

I have a UITableView with multiple sections with the header, collapsable/expandable. And also a tableHeaderView with custom UIView.
Using custom section header UIView and also custom UITableViewCell.
When all sections and rows are fully expanded, there is this weird scroll behavior, when I'm scrolling to the top (scroll down), when I reach the very top, the large navigation bar title should follow my scroll down gesture and animate down its way (Bounce effect). However, in this case, the bounce effect did not happen, the moment I scrolled to the top and try to scroll more for bounce effect, the scroll automatically got cut off and the navigation bar automatically becomes a small title.
Surprisingly, when I collapsed all the rows of the first section, the scroll behavior goes back to normal.
Here's a gif to show my screen recording.
https://i.imgur.com/WwXmpmZ.gifv
I have set the following to my UITableView:
self.tableView.contentInset = UIEdgeInsets(top: 0, left: 0, bottom: 15, right: 0)
self.tableView.estimatedRowHeight = 0
self.tableView.estimatedSectionHeaderHeight = 0
self.tableView.estimatedSectionFooterHeight = 0
I have also tried:
self.tableView.contentInsetAdjustmentBehavior = .never
This indeed solved the weird scrolling behavior, however it causes my section headers and rows to overlap with my tableHeaderView.
The way I handle the collapse/expand. If the object property isCollapsed is true, I just simply return 0 row for that section:
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
if section == self.scheduleCount {
//Last section
return self.dataSource.count
}
guard let schedule = self.itineraryDataSource?.schedule[section] else { return 0 }
if schedule.isCollapsed {
return 0
} else {
return schedule.items.count
}
}
These are all the height delegates, the last section is having different UITableViewCell, hence the different height.
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
if section == self.scheduleCount {
//Last section
return 40
}
return 64
}
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
if indexPath.section == self.scheduleCount {
//Last section
return 112
} else {
return 76
}
}
Managed to fix this.
Turns out I was returning UIView for my viewForHeaderInSection and I wasn't using tableView.dequeueReusableHeaderFooterView. I literally init a new xib UIView every time I scroll the tableView which causes it to automatically adjust the content inset, hence, caused the jerky scroll.
So, I created new custom xib for my section header view with type UITableViewHeaderFooterView, and simply return it at viewForHeaderInSection.
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let dayHeaderView = tableView.dequeueReusableHeaderFooterView(withIdentifier: "ItineraryDayHeaderView") as? ItineraryDayHeaderView
// Configure View...
return dayHeaderView
}

How To Get Rid Of Extra Space Above The UITableViewStyleGrouped Section?

We're want to do two changes to our search results.
Change the Collection View Controller to a Table View Controller
Have only the second section header show and have it scroll away inline. In other words, don't be sticky and don't stay at the top.
In regards to changing the Collection View Controller to a Table View Controller. This involves changing the section headers from a UICollectionReusableView subclass to something else. Normally, the change would be to using a UITableViewHeaderFooterView.
In regards to making the second section header scroll on up inline and out of sight and thus not be sticky, there's an issue to my solution.
To make it non-sticky, I changed the tableview to be UITableViewStyleGrouped. This causes a look for the second section that is different than what we have now. We would like it back to how it looks now.
Here's what we have in the App Store now:
Here's what we have when trying the UITableViewStyleGrouped approach and other changes:
Notice the extra gray above the "Other cars..." section header? I figure I can probably solve the rounded corners and insets via a subclass of the UITableViewHeaderFooterView. However, it's not clear how to handle the extra space above the section.
Code:
override func viewDidLoad() {
super.viewDidLoad()
self.tableView.estimatedRowHeight = 800
self.tableView.rowHeight = UITableViewAutomaticDimension
let nib = UINib(nibName: "SearchResultsOtherCarsHeader", bundle: nil)
tableView.register(nib, forHeaderFooterViewReuseIdentifier: "SearchResultsOtherCarsHeader")
:
}
override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
if section != 1 {
return 0
}
return 30
}
override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
if section != 1 {
return nil
}
let searchResultsOtherCarsHeaderView = self.tableView.dequeueReusableHeaderFooterView(withIdentifier: "SearchResultsOtherCarsHeader") as! SearchResultsOtherCars
return searchResultsOtherCarsHeaderView
}
How to get rid of the extra gray space above the section header?
The solution:
override func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 0.01
}
This solution was inspired by the comment made by #maddy and iPhone UITableView : How to remove the spacing between sections in group style table?

Show/Hide tableView Header on UIButton click inside UIViewController in Swift 3

I have a tableView and created tableViewHeader using Xib. I am able to show tableViewHeader on UIViewController. Outside tableView their is a UIButton so when i click that button headerView will hide,tableView will scroll up upto its position and when i again click the same button tableView header will be shown & tableView will scroll down. Any help will be appreciated.
You can use boolean for the state of the UIButton Action and based on TRUE & FALSE you can hide the UITableViewHeader.
override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
if boolObj {
return 0.0
}else{
return 50.0
}
On Button Action
if boolObj {
boolObj = false
}else{
boolObj = true
}
tblOutlet.reloadData()

Prevent footer overlapping tableViewCell in UITableView - Swift

I have this table view which works how i want it to however i have a problem where the footer overlap the cells in the table view as seen in
How can i prevent this? This is my code for the footer
func tableView(tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
let footerView = UIView(frame: CGRectMake(0, 0, tableView.frame.size.width, 40))
// self.myTableView.tableFooterView = footerView;
let sectionString = Array(foodArray.keys)[section]
for value in caloriesArray[sectionString]! {
calories += value
}
totalCalories += calories
print(calories)
print(totalCalories)
let label = UILabel(frame: CGRectMake(footerView.frame.origin.x - 15, footerView.frame.origin.y, footerView.frame.size.width, 20))
label.textAlignment = NSTextAlignment.Right
label.text = "Total Calories: \(calories) "
footerView.addSubview(label)
calories = 0
return footerView
}
func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 20.0
}
#IBAction func addFoodTapped(sender: AnyObject) {
}
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
let sectionString = Array(foodArray.keys)[indexPath.section]
foodArray[sectionString]?.removeAtIndex(indexPath.row)
caloriesArray[sectionString]?.removeAtIndex(indexPath.row)
print(foodArray)
viewDidAppear(true)
}
You can do that, Just make Style Grouped as shown below:
Just add some padding to the bottom of the content so that it doesn't overlap with the footer:
self.tableView.contentInset = UIEdgeInsetsMake(0, 0, FOOTER_HEIGHT, 0)
I know this is an old thread, so this is more so for others that encountered this (like myself).
The floating section footer is default behavior from my understanding. There are a couple of options that I can think of:
Provide your footer view with a background color (footerView.backgroundColor = UIColor.white) thus cleaning up the overlap.
or
Replace the section footer with a custom "Total Calories" cell that you add to the table after the last cell in that section, effectively acting like a footer cell.
Sorry for the delay. If you have modified the standard contentInsetAdjustmentBehavior of the tableView, you must adjust the tableView contentInset property to take into account the total height of the views at the bottom of the UITableView, like the tab bar. If contentInsetAdjustmentBehavior is set to "automatic" (or you didn't change the default value), then set the clipsToBounds property of your footer view to true so that its child views cannot be painted outside the footer view layer's frame. That should solve your issue.
Try to override this method
override func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 44.0
}
Just set your label's background color to UIColor.white. and you are done !
label.backgroundColor = UIColor.white
Of course it overlaps. This is how footers and header work in UITableViews. You can set the footerView.backgroundColor to UIColor.gray, for example, to make it look better.

Resources