How to remove iOS TableView Separator - ios

Hello, thanks for reading.
I 've tried to remove these separators since a while, it's horrible I can't delete them. I have tried a lot of answers in stackoverflow but no one was helpfull :/
Here is the problem :
I can't remove these white spaces between cells :s.
I've tried :
Change background color to same grey than cell,but it does not works
Checking cell size
Set separatorStyle to UITableViewCellSeparatorStyle.None
Returning the good height with tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat
Disabling separator in main storyboard
... I really don't understand how to remove these white space ...
Sorry for my english,
Thanks
I'm adding this. Now you can check my settings : (And you can see separators are disabled)

you just need to change this in the Attribute inspector:

Try this tableView method:
override func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat
{
return 0.00001
}

Try this hope it will be help full to you.
Objective C :
-(CGFloat)tableView:(UITableView*)tableView heightForFooterInSection:(NSInteger)section
{
return 0.1f;
}
-(UIView*)tableView:(UITableView*)tableView viewForFooterInSection:(NSInteger)section
{
return [[UIView alloc] initWithFrame:CGRectZero] ;
}
Swift :
override func tableView(tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
return UIView(frame: CGRectZero)
}
override func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 0.1f
}

set the tableviewcell separator none likewise the image http://imgur.com/MbVA7pM

Try this out:
func tableView(tableView: UITableView!, willDisplayCell cell: UITableViewCell!, forRowAtIndexPath indexPath: NSIndexPath!) {
// Remove seperator inset
if cell.respondsToSelector("setSeparatorInset:") {
cell.separatorInset = UIEdgeInsetsZero
}
// Prevent the cell from inheriting the Table View's margin settings
if cell.respondsToSelector("setPreservesSuperviewLayoutMargins:") {
cell.preservesSuperviewLayoutMargins = false
}
// Explictly set your cell's layout margins
if cell.respondsToSelector("setLayoutMargins:") {
cell.layoutMargins = UIEdgeInsetsZero
}
}

In swift hiding the table view separator
func tableView(tableView: UITableView!, willDisplayCell cell: UITableViewCell!, forRowAtIndexPath indexPath: NSIndexPath!)
{
cell.backgroundColor = UIColor.clearColor()
}

Ok I'm sorry, the problem was on my code, so you could not answer me ...
It was in my function : tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
Somewhere I wanted a border on my cell, so I have write:
var layer: CALayer = cell.layer
layer.borderColor = UIColor.rgbaColor(red: 288, green: 83, blue: 88, alpha: 1).CGColor
layer.borderWidth = 2
But this code didn't work because red:288 should be red:188, so I had a white border instead of an error, and I did not noticed ... Sorry for this, thanks a lot for your help :)

Just set the footer view to empty view:
self.tableView.tableFooterView = [[UIView alloc] initWithFrame:CGRectZero];
so separator will disappear for empty cells (you still keep separator for normal cells).

In objective c
[self.tableView setSeparatorColor:[UIColor myColor]];
In Swift
tableView.separatorColor = UIColor.clear

Related

How to remove UITableView section header separator

I would like to remove (or make them clearColor) UITableView's section header separators. Setting tableView.separatorStyle = .none doesn't work. I've also tried solutions from here, but none of them actually worked for me (maybe because the answers are pretty old). I still get this tiny separator below the section header.
I created the UITableView in Storyboard and add a UITableViewCell there. Then I set it as a header like this:
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let cell = tableView.dequeueReusableCell(withIdentifier: "headerTableViewCell")
return cell
}
func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
if section == 1 {
return 49
}
return 0
}
Don't know why you are returning UITableViewCell in viewForHeaderInSection method so may be it is possible that is showing separator of that UITableViewCell. Try returning the contentView of cell instead of cell from viewForHeaderInSection method.
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let cell = tableView.dequeueReusableCell(withIdentifier: "headerTableViewCell")
return cell.contentView
}
Try this:
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let headerView = UIView()
headerView.backgroundColor = UIColor.clear
return headerView
}
I have solved this by following way:
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
return 0.01
}
Turns out overriding layoutSubviews removes all the cell's separators, both section-related and cell-related.
#interface MyCustomCell : UITableViewCell
#end
#implementation MyCustomCell
- (void)layoutSubviews {
// don't call [super layoutSubviews]
// can be left empty
// does not harm other UI elements inside the contentView
}
#end
In multiple-cell sections, you may just want to only remove the Section-related separators (at the top of first cell and at the bottom of last cell), keeping inset, inter-cell, separators shown:
- (void)layoutSubviews {
[super layoutSubviews];
for (UIView *view in self.subviews) {
if ([view isEqual:self.contentView]) continue;
view.hidden = view.bounds.size.width == self.bounds.size.width;
}
}

Adjust UITableViewCell separator line when in multiple edit mode

I'm looking to adjust the separator inset margin when in multiple edit mode in a standard UITableView in iOS 9/10.
My goal is to align the separator line with the left edge of the cell's text label.
In the past, I've removed the margins entirely by doing:
override func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
cell.separatorInset = .zero
cell.layoutMargins = .zero
}
That gives me a view such as:
If I try to increase the separator inset, the entire text label moves over, which I don't want. :
cell.separatorInset = UIEdgeInsetsMake(0, 40, 0, 0)
How can I just move the separator line, without affecting the text layout, and preferably without doing any overriding of layoutSubviews or drawing lines manually?
You can add separator manually, try to use below code
func viewDidLoad() {
self.tableview.separatorStyle = UITableViewCellSeparatorStyle.None
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
{
let separator = CALayer()
separator.backgroundColor = UIColor.grayColor();
separator.frame = CGRectMake(0, 43, self.view.frame.size.width, 1);
cell.layer.insertSublayer(separator, atIndex:0)
return cell;
}
I'm on xcode 8, with ios 9
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
{
cell.layoutMargins = .zero
}
gives you the what you want as per your third picture.
I've tried
func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath)
{
cell.layoutMargins = .zero
}
it works too, not sure why its not working on your side..

UITableView row separator cut off when updating cell

I have a grouped UITableView in which I display some car data in the second section. I load the image from a web server using SDWebImage. In its callback I resize the picture and update my image view.
However, as soon as I update my image view, the UITableView separator is cut off.
For illustration purposes I've given the respective elements background colors
When the image is not loaded yet, it looks like this:
When the image is updated, it looks like this
Notice that the row separator is somehow cut off between the UITableView cells even though no subview (the UIImageView) is hiding it.
Depending on the UITableView section the row height varies, so I've overwritten the heightForRowAtIndexPath UITableView delegate
override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
if indexPath.section == 0 {
return GFFloat(44)
}
else {
return CGFloat(220)
}
}
Can someone tell me why the separators disappear and how I can fix this? I've read about reloading the next UITableViewCell when I update the image, but since I display a lot of cars, my app crashes when I try this.
Just add below method it will resolve separator issue.
override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
if cell.respondsToSelector("setSeparatorInset:") {
cell.separatorInset = UIEdgeInsetsZero
}
if cell.respondsToSelector("setPreservesSuperviewLayoutMargins:") {
cell.preservesSuperviewLayoutMargins = false
}
if cell.respondsToSelector("setLayoutMargins:") {
cell.layoutMargins = UIEdgeInsetsZero
}
}
Solution for Swift 5
Add this to your controller:
override func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
if cell.responds(to: #selector(setter: UITableViewCell.separatorInset)) {
cell.separatorInset = UIEdgeInsets.zero
}
if cell.responds(to: #selector(setter: UIView.preservesSuperviewLayoutMargins)) {
cell.preservesSuperviewLayoutMargins = false
}
if cell.responds(to: #selector(setter: UIView.layoutMargins)) {
cell.layoutMargins = UIEdgeInsets.zero
}
}

UITableView checkmark style remove highlight on select

I am trying to remove the highlight when selecting a table view cell, but want to keep the checkmark that appears.
When I try this in cellForRowAtIndexPath:
cell.backgroundView = UIView()
cell.backgroundView?.backgroundColor = UIColor.clearColor()
It only removes the highlight underneath the checkmark, rather than the whole row (refer to image attached).
When I try this in cellForRowAtIndexPath:
cell.selectionStyle = UITableViewCellSelectionStyle.None
It no longer displays the checkmark.
UPDATE: tried this, does the same thing as cell.selectionStyle where it no longer does checkmark
func tableView(tableView: UITableView, shouldHighlightRowAtIndexPath indexPath: NSIndexPath) -> Bool {
return false
}
What is a good way of doing this? I want it to still function like a checkbox but just don't want the blue highlighting to occur. TableView is dynamically generated:
checkBoxView = UITableView()
checkBoxView.frame = CGRect(x: qView.bounds.midX, y: qView.bounds.midY, width: qView.bounds.width - 100, height: qView.bounds.height/1.5)
checkBoxView.center = CGPointMake(qView.bounds.midX, qView.bounds.midY)
checkBoxView.delegate = self
checkBoxView.dataSource = self
checkBoxView.tag = 100
checkBoxView.registerClass(UITableViewCell.self, forCellReuseIdentifier: "cell")
checkBoxView.setEditing(true, animated: true)
self.qView.addSubview(checkBoxView)
Table View Functions:
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.checkBoxContent.count
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
var cell:UITableViewCell = checkBoxView.dequeueReusableCellWithIdentifier("cell") as! UITableViewCell
cell.textLabel?.text = self.checkBoxContent[indexPath.row]
cell.backgroundColor = UIColor.clearColor()
cell.tintColor = UIColor.greenColor()
return cell
}
func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle {
return UITableViewCellEditingStyle(rawValue: 3)!
}
In order to keep the checkmark, you can't set false to this shouldHighlightRowAtIndexPath method. If you do so, this wouldn't even show the checkmark on the left hand side at all.
What i have done is changing the "selectedBackgroundView" of cell which would keep the left-hand side checkmark and giving me the chance to set the background color. I enclose some code here and hope it would help.
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCellWithIdentifier(cellID, forIndexPath: indexPath) as! RecordTableViewCell
cell.selectedBackgroundView = UIView(frame: cell.frame)
cell.selectedBackgroundView?.backgroundColor = UIColor.orangeColor()
return cell
}
None of the suggestions above worked for me. In Swift 5, add this line to your cellForRowAtIndexPath function:
cell.selectionStyle = UITableViewCell.SelectionStyle.none
Swift 1.2 use:
tableView.deselectRowAtIndexPath(indexPath, animated: true)
In the didSelectRowAtIndexPath delegate method.
Theres an official way to do this with a UITableView, which is to use this :
optional func tableView(_ tableView: UITableView, shouldHighlightRowAtIndexPath indexPath: NSIndexPath) -> Bool
If you return YES for this method, then the tableview will highlight a cell when it is clicked.
Also note if you dont want to use that, that you need to change the contentView.backgroundColor, rather than just the cell backgroundColor. But the highlighting route is the best one to go down.
Documentation here : https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITableViewDelegate_Protocol/index.html#//apple_ref/occ/intfm/UITableViewDelegate/tableView:shouldHighlightRowAtIndexPath:

tableView section headers disappear SWIFT

I have a tableView set up so that when a cell is touched, it expands in height to reveal more information. The tableView has 5 sections.
I have a bug: when a cell expands, all headersCells below that cell go invisible. The console outputs the following: "[31233:564745] no index path for table cell being reused"
In my storyboard I have 2 custom cells : "myCell" for the data bearing cells, and "headerCell" for the headers.
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
let thisGoal : GoalModel = goalArray[indexPath.section][indexPath.row]
if self.currentPath != nil && self.currentPath == indexPath {
self.currentPath = nil
} else {
self.currentPath = indexPath
}
tableView.beginUpdates()
tableView.endUpdates()
}
If I enter tableView.reloadData() in between the begin/end updates, it functions properly, although the header background turns black, and loses animation.
I have all of the stuff for headers declared in: func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?
what am I missing? I'd really like the tableView to still have animations, and keep the background clearColor().
Thanks in advance. I did read through the objective C answers, but couldn't get them to work for me. I'd really appreciate some SWIFT help.
I think the problem is the no index path for table cell being reused.
I found an answer in the console output. Use this code in the header function:
func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?
Do not return your headerCell, or your reusable identifier. Return the reuseIdentifier.contentView. For me it's: return headerCell!.contentView.
Just to add, I was baffled for WAY longer than I should have been as to why I couldn't refer to the contentView of my cell, when I could quite clearly see it was there. My custom class (using UITableViewCell rather than UITableViewHeaderFooterView) would return a fatal error each time. Therefore make sure any custom styling is setup under UITableViewHeaderFooterView class like:
class CustomHeaderCell: UITableViewHeaderFooterView {
You will also need to register the resuableIdentifer like this:
tableView.registerNib(UINib(nibName: "HeaderCell", bundle: nil), forHeaderFooterViewReuseIdentifier: "CellHeader")
Then this bad boy:
func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let headerCell = tableView.dequeueReusableHeaderFooterViewWithIdentifier("CellHeader") as! CustomHeaderCell!
return headerCell!.contentView
}
Since I'm not at 50 reputation yet, I can't comment on the previous answer, so I apologize for listing this as another answer.
Returning the ContentView will make the function work but will remove all formatting done to the reuseIdentifier (headerCell)
headerCell.backgroundColor = UIColor.cyanColor()
This will NOT provide a Cyan color to your headerCell
To fix this, just add the ".contentView" to your formatting lines
headerCell.contentView.backgroundColor = UIColor.cyanColor()
Table view headers in 2 tables disappeared when I converted my app to IOS 10 - I found the reason in Apple developer API documentation on table headers. When I added the following, the missing headers reappeared!
override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat
{
return 44 // where 44 is the header cell view height in my storyboard
}
You could wrap the TableViewCell inside an UIView
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let containerView = UIView(frame: CGRect(x: 0, y: 0, width: tableView.frame.size.width, height: 50)) // 50 = Header height
guard let headerCell = tableView.dequeueReusableCell(withIdentifier: "MyHeaderView") as? MyHeaderView else { fatalError(" Failed to load MyHeaderView") }
headerCell.frame = containerView.bounds
containerView.addSubview(headerCell)
return containerView
}
I had the same bug because I was returning a cell using dequeue method instead of a UITableViewHeaderFooterView.
Solution:
Add a view outside of the view hierarchy
Set the type to UITableViewHeaderFooterView
Customize
Link to an #IBOutlet
In func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? return the outlet
Common pitfalls:
Don't forget to set the header sizes
Don't forget to set the outlet as strong.

Resources