Changing the color of UITableView section headers - iphone

OK, I know that this has been asked previously, so please forgive me for asking again. It just seems like there has got to be an easier way to do this.
Is there a 'simple' way to change the UITableView section header background color? I know that I can use the delegate method 'viewForHeaderInSection' to hand the UITableView a custom UIView to use for the section headers, but all I really want to do is set the 'tintColor'. There is a tintColor property on the search bar, why not for the section headers.
If I use viewForHeaderInSection to create my own custom UIView, I have to create my own label as well. I have to style and position my label to look just like the rest of the Apple standard. I have to style and size the 'background' to look like the rest of the Apple standard.
I can't find a way to simply ask for the section header and then change it's color. Am I missing something or do I really have to do this the hard way.
If I have to do this the hard way, does someone have all of the styling information that matches the Apple standard?
- bar is 'translucent'
- bar has some shading on the top and the bottom
- label has a certain size, position, shadings, etc
Thanks. And once again, sorry for asking this question again.

With the newer UIAppearance way of doing things, in versions > iOS 6.0 you can just do, for example:
[[UITableViewHeaderFooterView appearance] setTintColor:[UIColor redColor]];

With UIAppearance you can change UILabel text color on your UITableView headers like this:
[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setTextColor:[UIColor whiteColor]];
[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setShadowColor:[UIColor whiteColor]];
Should work on iOS 6.0+. Can be called anywhere (viewDidLoad etc).

This is something I spent quite a while grappling with myself, only to find that there is no way to just change the tintColor of the section header. The solution I came up with was to screenshot the background of the section header, change the tint of it in Photoshop, and then use that as the background of the section header. Then its just a case of laying out the label.
As you said, the thing to use is the viewForHeaderInSection delegate method.
Here is what I've found works and looks like the Apple default:
UIView *customView = [[[UIView alloc] initWithFrame:CGRectMake(10.0, 0.0, 320.0, 22.0)] autorelease];
customView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"headerbackground.png"]];;
UILabel *headerLabel = [[[UILabel alloc] initWithFrame:CGRectZero] autorelease];
headerLabel.backgroundColor = [UIColor clearColor];
headerLabel.opaque = NO;
headerLabel.textColor = [UIColor whiteColor];
headerLabel.font = [UIFont boldSystemFontOfSize:18];
headerLabel.shadowOffset = CGSizeMake(0.0f, 1.0f);
headerLabel.shadowColor = [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.5];
headerLabel.frame = CGRectMake(11,-11, 320.0, 44.0);
headerLabel.textAlignment = UITextAlignmentLeft;
headerLabel.text = #"Header Label";
[customView addSubview:headerLabel];
return customView;
Here "headerbackground.png" is a 1 pixel by 22 pixel (double that for iPhone 4) image that will get repeated across the length of the header.
Hope this helps!

If you change the appearance, like in the other answers, it is application wide.
If you want to change just for a specific tableview, implement:
-(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
UITableViewHeaderFooterView * headerview = (UITableViewHeaderFooterView *)view;
headerview.contentView.backgroundColor = [UIColor greenColor];
headerview.textLabel.textColor = [UIColor whiteColor];
}

The UIAppearance method appearanceWhenContainedIn has been deprecated as of iOS 9.0; instead you can still do the exact same thing with the appearanceWhenContainedInInstancesOfClasses method and an array.
[UILabel appearanceWhenContainedInInstancesOfClasses:#[[UITableViewHeaderFooterView class]]].textColor = [UIColor darkTextColor];

we can change the header background color like this :
func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int){
let tableHeader = view as! UITableViewHeaderFooterView
tableHeader.backgroundView?.backgroundColor = UIColor.white
}

Related

How to set the background color of UIPickerView on iOS 7 using SDK 7?

How to set the background color of UIPickerView on iOS 7 using SDK 7 and use a standard picker on iOS 5 and 6? It's transparent by default on iOS 7.
What's wrong with:
[picker setBackgroundColor:[UIColor whiteColor]];
I'm assuming you have a reference to the picker view if you're invoking it, and it's a subclass of UIView so backgroundColor is a valid property...
I wanted to write it as a comment, but it would be hard to read :) Sooo....
-(UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
{
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 50, 44)]; // your frame, so picker gets "colored"
label.backgroundColor = [UIColor lightGrayColor];
label.textColor = [UIColor blackColor];
label.font = [UIFont fontWithName:#"HelveticaNeue-Bold" size:18];
label.text = [NSString stringWithFormat:#"%d",row];
return label;
}
Also it doesnt have to be only label, I think you can insert other subviews there as well...
It works on iOS7 as far as I know
This worked for me, in iOS 7.1:
[[UIPickerView appearance] setBackgroundColor:[UIColor whiteColor];
This changes the color of all pickers. You can put a conditional around it if you only want this to run on devices with iOS 7.
I have added UIView under UIPickerView with code:
CGRect framePickerView = CGRectMake(0, self.view.frame.size.height, self.view.frame.size.width, 216);
pickerView = [[[UIView alloc] initWithFrame:framePickerView] autorelease];
pickerView.backgroundColor = [UIColor whiteColor];
[self.view addSubview:pickerView];
[pickerView addSubview:picker];
instead the code:
[self.view addSubview:picker];
Even though I set UIPickerView.backgorundColor, but I had weird background color.
removing following line fixed the issue:
UITextField.keyboardAppearance = .dark
Or just reset keyboardAppearance back to default, like so:
UITextField.keyboardAppearance = .default
For anyone working in swift, and potentially using multiple pickers:
pickerView1.backgroundColor = UIColor.darkGrayColor()
pickerView2.backgroundColor = UIColor.greenColor()
Xcode 7.3

How to make a UITableView as transparent one?

In my application, i am presenting an UITableViewController class (Grouped style) to the user for the particular scenario. I want to show the table view's cells only. The background should be transparent so that the user can see the previous page.
I tried with the following codes in viewDidLoad method of the table view controller. But they are not working..
self.tableView.backgroundColor = [UIColor clearColor];
self.tableView.opaque = NO;
self.tableView.backgroundView = nil;
Is it possible to show the cells with a dimmed background?
Thanks in Advance
I use: (in viewDidLoad)
self.tableView.backgroundColor = [UIColor clearColor];
self.tableView.opaque = NO;
Then in cellForRowAtIndexPath:
cell.textLabel.backgroundColor = [UIColor clearColor];
cell.detailTextLabel.backgroundColor = [UIColor clearColor];
cell.backgroundColor = [UIColor colorWithWhite:1 alpha:.55];
Not sure if this is what you wanted, but it gives you the option to make everything clear. (obviously the alpha would change for your case, but that measures theo pacity of the cells)
Just altering the tableView doesn't help. You have to mess with the cells also. Inside the cellForRowAtIndexPath:(NSIndexPath *)indexPath method, put this before the return statement:
UIView * bgView =[[UIView alloc] initWithFrame:CGRectZero] autorelease];
bgView.backgroundColor = [UIColor clearColor];
cell.backgroundView = bgView;

Customize UITableView section border color for each section

I am using a UITableView with grouping. My first group I have built a custom cell with no background color, and I would also like to remove the border around the cell. How can I do this just for one section?
For my first cell, I would like to set the border/seperator style to [UIColor clearColor].
EDIT: Apple does this in their contacts app, and I wanted to design something similar.
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
if(indexPath.section == 0){
cell.backgroundView = [[[UIView alloc] initWithFrame:CGRectZero] autorelease];
}
}
I believe what Apple uses for its contact heading is tableView:viewForHeaderInSection: for section 0, instead of a cell in the first section. You can still specify a transparent background and the pinstripe will show behind it. The border will not be there as grouped table view section headers do not have borders.
Whether you built your custom cell in Interface Builder or using code, it should be a fairly trivial task to migrate those views from a UITableViewCell to a UIView for use with tableView:viewForHeaderInSection:.
I don't know if you'll be able to keep the Details title for, say, section 1, unless you make a label containing that word and add it to the section 0 header view manually.
If i understood your question, in the cellForRawIndexPath you should add-
if(indexPath.section==0){
//set the style you wish to add only to the first section
}
good luck
EDIT
I use this function for that -
+(void)setTransparentBgToCell:(UITableViewCell*)cell{
UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 44.0f)];
backgroundView.backgroundColor = [UIColor clearColor];
cell.backgroundView = backgroundView;
[backgroundView release];
cell.selectionStyle=UITableViewCellSelectionStyleNone;
cell.textLabel.backgroundColor = [UIColor clearColor];
cell.detailTextLabel.backgroundColor = [UIColor clearColor];
}
shani

Removing cell borders from a section of grouped-style UITableView

I have a UITableViewController initialized with the grouped style and having multiple sections. For one of these sections, I'd like its constituent cells to be completely transparent and have no border. I plan to assign a custom view for every row in this section, but having that custom view surrounded by the grouped table cell looks bad :(
The following makes the background color of a cell black instead of transparent... And I still don't know how to get rid of the border.
cell.backgroundColor = [UIColor clearColor];
Any pointers? Thanks!
NOTE: This doesn't appear to be working in iOS7 and above. For iOS7 try this answer.
For iOS6 and below, to remove the grouped background from a cell in a grouped table view cell:
This didn't work
cell.backgroundView = nil; // Did Not Work
This did
cell.backgroundView = [[[UIView alloc] initWithFrame:CGRectZero] autorelease];
If you have moved to ARC (I've heard this works, but haven't tested it)
cell.backgroundView = [UIView new];
You have to actually set
tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
to remove the border of cells.
The following hack works in iOS 7 – for now. :)
Subclass UITableViewCell, and use this cell for the section that shouldn't have separators.
Override the addSubview method in your cell subclass:
-(void)addSubview:(UIView *)view
{
// The separator has a height of 0.5pt on a retina display and 1pt on non-retina.
// Prevent subviews with this height from being added.
if (CGRectGetHeight(view.frame)*[UIScreen mainScreen].scale == 1)
{
return;
}
[super addSubview:view];
}
This is what worked for with having a Grouped style table
[tableView setSeparatorColor:[UIColor clearColor]];
This code worked for me :)
[self.tableView setSeparatorColor:[UIColor clearColor]];
[self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];
Set the backgroundView of the cell to nil. For a grouped table, the cell image is part of that view.
cell.backgroundColor = [UIColor clearColor];
cell.backgroundView = [[[UIView alloc] initWithFrame:CGRectZero] autorelease];
Try using tableView.separatorColor = [UIColor clearColor];
And, don't use tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
I tested with both, if style is none, making the section borders invisible is not working, but instead just change its color, and section border will appear to be none.
iOS seems to be differentiating making an object none and making an object transparent
cell.backgroundView = [UIView new];
Works like a charm! Tested! iOS6
As of iOS 8, setting the separator attribute to none works as well.
Setting a content view also gets rid of the border. Set your custom view to cell.contentView.
The easiest way to remove cell borders from a section of grouped-style UITableView:
[tableViewOutlet setBackgroundView:nil];
in the viewDidLoad method.
UIView *backView = [[UIView alloc] initWithFrame:CGRectZero];
backView.backgroundColor = [UIColor clearColor];
cell.backgroundView = backView;
cell.backgroundColor = [UIColor clearColor];
[cell.contentView addSubview:imageView];
If you have a custom UITableCellView then you can add the following method to your view to remove the background view.
- (void)setBackgroundView:(UIView *)backgroundView
{
// We don't want background views for this cell.
[super setBackgroundView:nil];
}
I just thought I would convert my comment to #Intentss into an answer, because it maybe useful for those, using his solution.
Using iOS6.1 with a grouped UITabelView, using ARC:
[tableView setSeparatorColor:[UIColor clearColor]];
Does not work
cell.backgroundView = [[UIView alloc] initWithFrame:CGRectZero];
Does work

Transparent background in grouped UITableView - iPhone

I want to make the grouped UITableView transparent. I partially succeded with the following code:
UIColor *bgColor = [[UIColor alloc] initWithWhite:1 alpha:0.0];
historyTable.backgroundColor = bgColor;
Unfortunately, black corners appeared in the rounded cells. How to get rid of them?
Instead of using
UIColor *bgColor = [[UIColor alloc] initWithWhite:1 alpha:0.0];
historyTable.backgroundColor = bgColor;
Just use:
historyTable.backgroundColor = [UIColor clearColor];
That also clears up the memory leak you were creating.
remove UITableView backgroundView
xxx.backgroundView = nil;
This is necessary on iPad builds. When compiling to run on iPad and iPhone, check the tableView responds to the selector with ...
if ([self.tableView respondsToSelector:#selector(setBackgroundView:)]) {
[self.tableView setBackgroundView:nil];
}
for me it worked finaly after setting both to nil/clear:
[myTableView setBackgroundView:nil];
[myTableView setBackgroundColor:[UIColor clearColor]];
I had this issue and found that there was no difference between using:
[[UIColor alloc] initWithWhite:1 alpha:0.0];
and using:
[UIColor clearColor];
I tried both of these and still had the little black corners on my table view.
I also tried setting the backgroundView to nil as suggested, but this didn't work either.
I solved this by setting the backgrounds of the individual cells to transparent in the cellForRowAtIndexPath method:
cell.backgroundColor = [UIColor clearColor];
Of course, this has the side effect that your cells themselves are transparent, which isn't ideal for everyone, but it ok for me in this case.