I've been banging my head against the wall with this one, so maybe someone here has done this before.
Anyway, I'm trying to change how the delete button looks in my UITableView, and I've got it mostly figured out. I'm changing it by setting the background Color to a UIImage of what I actually want it to look like.
Apparently, though, a UITableViewRowAction has a faint grey line under it, and I can't figure out how to make this disappear. Any pointers would be greatly appreciated. There's a link to what I'm talking about here:
Thank you very much!
This is a separator line of UITableView. You can remove it by setting it's style as None.
Objective C:
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
Swift:
self.tableView.separatorStyle = UITableViewCellSeparatorStyle.None
Initially separator line is not visible, because I think height of image or view added in cell is more than cell height.
And that's why while you swipe separator line is visible. If you are testing in Simulator than use Debug > Color Blended Layers of Simultor. Which is helpful to track overlapping views.
Edit:
iOS 8.0 introduced layoutMargins for UITableView. So it may be possible reason for that also.
Check out this answer for more information.
It explains to clear layout margins by setting cell layoutMargins as UIEdgeInsetsZero.
Try this on cellForRowAtIndexPath Method
for iOS lower versions
if(indexPath.row != self.newCarArray.count-1){
UIImageView *line = [[UIImageView alloc] initWithFrame:CGRectMake(0, 44, 320, 2)];
line.backgroundColor = [UIColor redColor];
[cell addSubview:line];
}
for iOS 7 upper versions
if (indexPath.row == self.newCarArray.count-1) {
cell.separatorInset = UIEdgeInsetsMake(0.f, 0.f, 0.f, cell.bounds.size.width);
}
Related
I have attached an image of cells in a table view, and you can notice the 2 separator lines in the middle are a tiny bit thicker/darker than the 2 outer lines. I want the lines to all be consistent, and the color/thickness of the outer two lines. I could not find a solution, so I am wondering if anyone knows of any. I figure it would be a simple solution, but I haven't been able to figure it out. Thanks guys.
Select your UITableView from xib or storyboard, then make the UITableView separator to None.
See the image
Then place a UILabel with the width same as of UITableViewCell and height=1 in the bottom of your cell, clear the text of the label and set the backGround color as per your wish, this will solve your problem.
Hope this helps you.
Create a custom separator Line Programatically:
UIView *separatorLine = [[UIView alloc] initWithFrame:
CGRectMake(0, cell.contentView.frame.size.height - 1.0,
cell.contentView.frame.size.width, 1)];
separatorLine.backgroundColor = [UIColor blackColor];;
[cell.contentView addSubview: separatorLine];
or you can add a image view for separator in custom UITableviewCell in UI
I have a UITableViewCell in which I'm trying to make 1 cells separators height larger than the rest. I tried the following:
UIView* separator = [[UIView alloc] initWithFrame:CGRectMake(0, 0, cell.frame.size.width, 2)];
separator.backgroundColor = [UIColor blackColor];
[cell.contentView addSubview:separator];
That works, but results in the following look:
The separator line for all the cells are set to red. In the picture above, you can see the red above the black. How can I remove the red for that cell?
I tried: cell.separatorInset = UIEdgeInsetsZero; and that didn't do anything.
Use table view separator style property to remove default separator,
[self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];
This will remove default separator and you can use your own. Make sure that you remove custom separators properly as cell view is reused.
You cannot draw your own separator and use the built-in separators - well, you can, but you will see both of them, as you have clearly shown. If you are going to draw your own separator, tell the cell or table view not to supply separators at all.
first of all remove the default UITableViewCellSeparatorStyle to none as below..
[tableview setSeparatorStyle:UITableViewCellSeparatorStyleNone];
and after that use your own separator..
I have been using the following code for tableview
_comboBoxTableView = [[UITableView alloc] initWithFrame:CGRectMake(1, _selectContentLabel.frame.origin.y+_selectContentLabel.frame.size.height-1, frame.size.width+1, 48) style:UITableViewStylePlain];
_comboBoxTableView.layer.borderColor=[UIColor colorWithRed:226.0/255.0 green:226.0/255.0 blue:226.0/255.0 alpha:1].CGColor;
_comboBoxTableView.layer.cornerRadius = 10;
_comboBoxTableView.layer.borderWidth = 1.0f;
_comboBoxTableView.separatorColor = [UIColor colorWithRed:166.0/255.0 green:166.0/255.0 blue:166.0/255.0 alpha:1];
[_comboBoxTableView setSeparatorStyle:UITableViewCellSeparatorStyleSingleLine];
There is an unwanted white color on the left of each separator as shown below.
Is it a bug? I am running it with ios7.1. Any work around ?
It's not a bug. As of iOS 7, table views are capable of adjusting the insets of their separators. If you want an edge to edge separator, eliminate the insets:
if ([_comboBoxTableView respondsToSelector:#selector(separatorInset)]) { // In case running iOS < 7
_comboBoxTableView.separatorInset = UIEdgeInsetsZero;
}
More info in the UITableView documentation.
Just in case that you do not have time to fix this programatically, you can add subview patching the while line.
I do know that this not the properly solution, but works.
What worked for me: in Interface Builder, the tableview has a thing called Separator Inset. It's normally on Default (this seems to be 15).
You can switch it to Custom and replace the 15 with 0. No more weird lines.
In case if someone needs non-zero separator insets, those white lines are UITableCell which are not covered by the cell content view and separators. Just select UITableCell in the document outline (not the content view!) and set it the same background color as content view's background (or any color which you want).
I have a fairly simple TableViewController listing items that can be checked as they are collected. I have successfully implemented a word wrapped label in each cell, and updated heightForRowAtIndexPath such that each row is a suitable height. This is working well:
note: I have set a garish background color on the cell's contentView for testing purposes.
The problem comes when I try to add a checkmark button as the accessoryView for each cell:
UIImage *image = [UIImage imageNamed:#"checked.png"];
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
CGRect frame = CGRectMake(0.0, 0.0, 44.0, 44.0);
button.frame = frame;
[button setImage:image forState:UIControlStateNormal]
button.backgroundColor = [UIColor redColor];
cell.accessoryView = button;
For some reason, the alignment is not quite right for my cells that span more than one line once the button size exceeds about 26x26 pixels.
The example above uses 44x44 as the button width.
Can anyone explain what is going on here? Why would there be a different alignment when the contentView is 2-lines versus one? Infact, for each extra line that the text uses, the alignment is increasingly off. I can add the code for the row text if it will help.
I found that this can be resolved by setting the height of the button in the accessory view to match what will be calculated for the row.
So, the code used in heightForRow:atIndexPath: should be copied in to the cellForRowAtIndexPath and used to set the button's height.
I had the same issue and unfortunately I neither can explain the odd behaviour, nor did I solve it. But I made some observations that may be help to others struggling with this issue.
I am using a UIImageView as an accessory view for my cells, and ended up fiddling around with the image dimensions. What finally worked were images to a size of about 16x16 pixels or lower.
As I just wanted a rather tiny image, this worked for me.
I've used -[UITableView setSeparatorColor:] to set the red border in the attached image. But how do I set the color of the border showing up as white?
EDIT: I know I can use the UITableViewSeparatorStyleSingleLine style to get rid of the white color entirely. But I don't want to do that: I want to change its color. Thanks!
The white color is because the separator style is set to Single Line Edged. If you change it to Single Line the white lines will disappear. Not sure if that solves your problem but I don't think you change the color without doing a lot more work.
Try making a "line view" for the cells. So in cellForRowAtIndexPath: method just add that to the cell that you need:
UIView *lineView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, cell.contentView.bounds.size.width, 1)] autorelease];
lineView.backgroundColor = [UIColor whiteColor];
lineView.autoresizingMask = 0x3f;
[cell.contentView addSubview:lineView];
that will add that white line to the top of the each cell. If you don't want it for the very first row add an if-statement:
if (indexPath.row != 0)
{
UIView *lineView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, cell.contentView.bounds.size.width, 1)] autorelease];
lineView.backgroundColor = [UIColor whiteColor];
lineView.autoresizingMask = 0x3f;
[cell.contentView addSubview:lineView];
}
Hope it helps.
You are trying to change the default iOS user interface but the change is so complex that it can't be done with the default properties.
What is the solution? Just remove the lines drawn by UITableVie (setting the color to [UIColor clearColor]) and customize UITableViewCell background.
Of course, you need 3 types of backgrounds - for the first cell, for the last cell and for the middle ones:
- (UITableViewCell*)tableView:(UITableView*)tableView cellForRowAtIndexPath (NSIndexPath*)indexPath {
UITableViewCell* cell = [...];
UIView* background;
if (indexPath.row == 0) {
background = [...]; //background for the first cell
}
else if (indexPath.row + 1 == [self tableView:tableView numberOfRowsInSection:indexPath.section]) {
background = [...]; //background for the last cell
}
else {
background = [...]; //background for the middle cells
}
cell.backgroundView = background;
}
The question is how to create the background. Usually I just use an UIImageView or a combination of several UIImageView (rounded corner as one image and the lines as resizible images).
You can't.
This built-in drawing is specific to grouped-style tableView, and can't be changed (to my knowledge...)
There's a workaround to this (we've used -> sorry no source code), but i guess you're not going to like it :
1/ have information of each cell's position
2/ to re-implement drawing of EACH cell's background, depending on its position (so you have to save this position : FirstCell, MiddleCell, LastCell,) to reproduce the grouped tableView look.
A way to do this is with CoreGraphics :
From your subclassed CellGroupedBackgroundView (or customGroupedTableViewCell, depending on the design you choose) you create 2 nearly identical CAShapeLayers. Each one for each separator color. And you expose these colors as properties of your CellGroupedBackgroundView.
You set these layer's path depending on the position property you have set (using only CGPathAddLineToPointfor middle cells, and CGPathAddArcToPoint for first and last cell)
2/ use that created custom backgroundView on a plain UITableView, setting each cell's 'position' according to its indexPath...
Good luck :)