UITableView - change section header color

Question

How can I change color of a section header in UITableView   EDIT  The answer provided by DJ-S should be considered for iOS 6 and above  The accepted answer is out of date

User · Answer

Swift 4  To change the background color  text label color and font for the Header View of a UITableView Section  simply override willDisplayHeaderView for your table view like so   override func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            let header   view as  UITableViewHeaderFooterView         header backgroundView  backgroundColor    white         header textLabel  textColor    black         header textLabel  font   UIFont name   Helvetica-Bold   size  14       This worked perfectly for me  hope it does help you too

User · Answer

Just set the background color of the background view   func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int              let tableHeader   view as  UITableViewHeaderFooterView           tableHeader backgroundView  backgroundColor   UIColor white

User · Answer

Here s how to add an image in header view   -  UIView    tableView  UITableView   tableView viewForHeaderInSection  NSInteger section        UIView  headerView      UIView alloc  initWithFrame CGRectMake 0  0  tableView bounds size width  30   autorelease       UIImageView  headerImage      UIImageView alloc  initWithImage  UIImage imageNamed   top-gery-bar png    autorelease        headerImage frame   CGRectMake 0  0  tableView bounds size width  30         headerView addSubview headerImage        return headerView

User · Answer

I got message from Xcode through console log      TableView  Setting the background color on   UITableViewHeaderFooterView has been deprecated  Please set a custom   UIView with your desired background color to the backgroundView   property instead    Then I just create a new UIView and lay it as background of HeaderView  Not a good solution but it easy as Xcode said

User · Answer

Here s how to change the text color   UILabel  label      UILabel alloc  initWithFrame CGRectMake 10  3  tableView bounds size width - 10  18   autorelease   label text     Section Header Text Here   label textColor    UIColor colorWithRed 1 0 green 1 0 blue 1 0 alpha 0 75   label backgroundColor    UIColor clearColor    headerView addSubview label

User · Answer

Don t forget to add this piece of code from the delegate or your view will be cut off or appear behind the table in some cases  relative to the height of your view label   -  CGFloat tableView  UITableView   tableView heightForHeaderInSection  NSInteger section       return 30

User · Answer

Just change the color of layer of the header view   -  UIView    tableView  UITableView   tableView viewForHeaderInSection  NSInteger section      UIView  headerView      UIView alloc  initWithFrame CGRectMake 0  0     tableView bounds size width  30   autorelease    headerView layer backgroundColor    UIColor clearColor  CGColor

User · Answer

SWIFT 2  I was able to successfully change the section background color with an added blur effect  which is really cool   To change the background color of section easily    First go to Storyboard and select the Table View  Go to Attributes Inspector List item Scroll down to View Change  Background    Then for blur effect  add to code   override func tableView tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            This is the blur effect      let blurEffect   UIBlurEffect style   Light      let blurEffectView   UIVisualEffectView effect  blurEffect          Gets the header view as a UITableViewHeaderFooterView and changes the text colour and adds above blur effect     let headerView  UITableViewHeaderFooterView   view as  UITableViewHeaderFooterView     headerView textLabel  textColor   UIColor darkGrayColor       headerView textLabel  font   UIFont name   HelveticaNeue-Light   size  13      headerView tintColor    groupTableViewBackgroundColor       headerView backgroundView   blurEffectView

User · Answer

Using UIAppearance you can change it for all headers in your application like this   UITableViewHeaderFooterView appearance   backgroundColor   theme subViewBackgroundColor

User · Answer

For swift 5   In willDisplayHeaderView Method func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            For Header Background Color      view tintColor    black         For Header Text Color     let header   view as  UITableViewHeaderFooterView     header textLabel  textColor    white    I hope this helps you

User · Answer

If you don t want to create a custom view  you can also change the color like this  requires iOS 6    - void  tableView  UITableView   tableView willDisplayHeaderView  UIView   view forSection  NSInteger section       if   view isKindOfClass   UITableViewHeaderFooterView class              UITableViewHeaderFooterView  castView    UITableViewHeaderFooterView   view          UIView  content   castView contentView          UIColor  color    UIColor colorWithWhite 0 85 alpha 1       substitute your color here         content backgroundColor   color

User · Answer

Hopefully this method from the UITableViewDelegate protocol will get you started   Objective-C   -  UIView    tableView  UITableView   tableView viewForHeaderInSection  NSInteger section      UIView  headerView      UIView alloc  initWithFrame CGRectMake 0  0  tableView bounds size width  30   autorelease     if  section    integerRepresentingYourSectionOfInterest        headerView setBackgroundColor  UIColor redColor      else        headerView setBackgroundColor  UIColor clearColor      return headerView      Swift   func tableView   tableView  UITableView   viewForHeaderInSection section  Int  - gt  UIView      let headerView   UIView frame  CGRect x  0  y  0  width  tableView bounds size width  height  30     if  section    integerRepresentingYourSectionOfInterest        headerView backgroundColor   UIColor redColor       else       headerView backgroundColor   UIColor clearColor         return headerView     Updated 2017   Swift 3   func tableView   tableView  UITableView  viewForHeaderInSection section  Int  - gt  UIView                let headerView   UIView frame  CGRect x  0  y  0  width  tableView bounds size width  height  30           if  section    integerRepresentingYourSectionOfInterest                headerView backgroundColor   UIColor red           else               headerView backgroundColor   UIColor clear                   return headerView         Replace  UIColor redColor  with whichever UIColor you would like  You may also wish to adjust the dimensions of headerView

User · Answer

I think this code is not so bad   func tableView tableView  UITableView  viewForHeaderInSection section  Int  - gt  UIView        let headerView   tableView dequeueReusableHeaderFooterViewWithIdentifier MyHeaderView reuseIdentifier  as MyHeaderView     let backgroundView   UIView       backgroundView backgroundColor   UIColor whiteColor       headerView backgroundView   backgroundView     headerView textLabel text    hello      return headerView

User · Answer

Although func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int  will work as well  you can acheive this without implementing another delegate method  in you func tableView   tableView  UITableView  viewForHeaderInSection section  Int  - gt  UIView  method  you can use view contentView backgroundColor   UIColor white instead of view backgroundView  backgroundColor   UIColor white which is not working   I know that backgroundView is optional  but even when it is there  this is not woking without implementing willDisplayHeaderView

User · Answer

You can do this if you want header with custom color     UITableViewHeaderFooterView appearance  setTintColor  UIColor redColor      This solution works great since iOS 6 0

User · Answer

You can do it on main storyboard in about 2 seconds    Select Table View Go to Attributes Inspector List item Scroll down to View subheading  Change  background

User · Answer

In my case  It worked like this   let headerIdentifier    HeaderIdentifier  let header   self tableView dequeueReusableHeaderFooterView withIdentifier  headerIdentifier  header contentView backgroundColor   UIColor white

User · Answer

If you are using a custom header view  class YourCustomHeaderFooterView  UITableViewHeaderFooterView     override func awakeFromNib         super awakeFromNib       self contentView backgroundColor    white   Or any color you want

User · Answer

For me none of above works after wasting 2 hours what this is the solution  In my case it was custom view but I cannot able to change it from storyboard and view s awakeFromNib for some reason  override func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            let header   view as  UITableViewHeaderFooterView         header contentView backgroundColor    white

User · Answer

I know its answered  just in case  In Swift use the following      override func tableView tableView  UITableView  viewForHeaderInSection section  Int  - gt  UIView            let tableViewWidth   self tableView bounds          let headerView   UIView frame  CGRectMake 0  0  tableViewWidth size width  self tableView sectionHeaderHeight           headerView backgroundColor   UIColor greenColor            return headerView

User · Answer

iOS 13 gt  swift 5 func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int   view tintColor   UIColor red

User · Answer

This is an old question  but I think the answer needs to be updated   This method does not involve defining and creating your own custom view  In iOS 6 and up  you can easily change the background color and the text color by defining the   - void tableView  UITableView   tableView      willDisplayHeaderView  UIView   view      forSection  NSInteger section   section delegate method    For example   -  void tableView  UITableView   tableView willDisplayHeaderView  UIView   view forSection  NSInteger section          Background color     view tintColor    UIColor blackColor           Text Color     UITableViewHeaderFooterView  header    UITableViewHeaderFooterView   view       header textLabel setTextColor  UIColor whiteColor            Another way to set the background color        Note  does not preserve gradient effect of original header        header contentView backgroundColor    UIColor blackColor       Taken from my post here  https   happyteamlabs com blog ios-how-to-customize-table-view-header-and-footer-colors   Swift 3   4  func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int       view tintColor   UIColor red     let header   view as  UITableViewHeaderFooterView     header textLabel  textColor   UIColor white

User · Answer

If anyone needs swift  keeps title   override func tableView tableView  UITableView  viewForHeaderInSection section  Int  - gt  UIView        let view   UIView frame  CGRect x  0 y  0 width  self tableView frame width  height  30       view backgroundColor   UIColor redColor       let label   UILabel frame  CGRect x  15 y  5 width  200 height  25       label text   self tableView tableView  titleForHeaderInSection  section      view addSubview label      return view

User · Answer

For iOS8  Beta  and Swift choose the RGB Color you want and try this   override func tableView tableView  UITableView   viewForHeaderInSection section  Int  - gt  UIView        var header  UITableViewHeaderFooterView   UITableViewHeaderFooterView        header contentView backgroundColor   UIColor red  254 0 255 0  green  190 0 255 0  blue  127 0 255 0  alpha  1      return header       The  override  is there since i  m using the UITableViewController instead of a normal UIViewController in my project  but it  s not mandatory for changing the section header color   The text of your header will still be seen  Note that you will need to adjust the section header height   Good Luck

User · Answer

I have a project using static table view cells  in iOS 7 x   willDisplayHeaderView does not fire  However  this method works ok   -  UIView   tableView  UITableView   tableView viewForHeaderInSection  NSInteger section       NSLog    s     FUNCTION         CGRect headerFrame   CGRectMake x  y  w  h           UIView  headerView     UIView alloc  initWithFrame headerFrame         headerView backgroundColor    UIColor blackColor

User · Answer

Based on  Dj S answer  using Swift 3  This works great on iOS 10   func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int           Background color     view tintColor   UIColor black         Text Color     let headerView   view as  UITableViewHeaderFooterView     headerView textLabel  textColor   UIColor white

User · Answer

- void  tableView  UITableView   tableView willDisplayHeaderView  UIView   view   forSection  NSInteger section             if   view isKindOfClass   UITableViewHeaderFooterView class                           UITableViewHeaderFooterView  castView    UITableViewHeaderFooterView    view               UIView  content   castView contentView               UIColor  color    UIColor whiteColor      substitute your color here              content backgroundColor   color                castView textLabel setTextColor  UIColor blackColor

User · Answer

With RubyMotion   RedPotion  paste this into your TableScreen     def tableView    willDisplayHeaderView  view  forSection  section      view textLabel textColor   rmq color your text color     view contentView backgroundColor   rmq color your background color   end   Works like a charm

User · Answer

Setting the background color on UITableViewHeaderFooterView has been deprecated  Please use contentView backgroundColor instead

User · Answer

iOS 8   func tableView tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            tableView tableHeaderView  backgroundColor   UIColor blue

User · Answer

In iOS 7 0 4 I created a custom header with it s own XIB  Nothing mentioned here before worked  It had to be the subclass of the UITableViewHeaderFooterView to work with the dequeueReusableHeaderFooterViewWithIdentifier  and it seems that class is very stubborn regarding the background color  So finally I added an UIView  you could do it either with code or IB  with name customBackgroudView  and then set it s backgroundColor property  In layoutSubviews  I set that view s frame to bounds  It work with iOS 7 and gives no glitches      in MyTableHeaderView xib drop an UIView at top of the first child of the owner    first child becomes contentView     in MyTableHeaderView h  property  nonatomic  weak  IBOutlet UIView   customBackgroundView      in MyTableHeaderView m - void layoutSubviews         super layoutSubviews        self customBackgroundView frame   self bounds       if you don t have XIB   use IB  put in the initializer  - id initWithReuseIdentifier  NSString   reuseIdentifier               UIView   customBackgroundView     UIView alloc  init        self contentView addSubview customBackgroundView        customBackgroundView   customBackgroundView                 in MyTableViewController m - UIView   tableView  UITableView   tableView viewForHeaderInSection  NSInteger section       MyTableHeaderView   header    self tableView                                           dequeueReusableHeaderFooterViewWithIdentifier   MyTableHeaderView        header customBackgroundView backgroundColor    UIColor redColor       return header

User · Answer

Set the background and text color of section area   Thanks to William Jockusch and Dj S   -  void tableView  UITableView   tableView willDisplayHeaderView  UIView   view forSection  NSInteger section       if   view isKindOfClass   UITableViewHeaderFooterView class              UITableViewHeaderFooterView  castView    UITableViewHeaderFooterView   view          castView contentView backgroundColor    UIColor grayColor            castView textLabel setTextColor  UIColor grayColor

User · Answer

The following solution works for Swift 1 2 with iOS 8    override func tableView tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            This changes the header background     view tintColor   UIColor blueColor           Gets the header view as a UITableViewHeaderFooterView and changes the text colour     var headerView  UITableViewHeaderFooterView   view as  UITableViewHeaderFooterView     headerView textLabel textColor   UIColor redColor

User · Answer

Swift 4 makes it very easy   Simply add this to your class and set the color as needed   override func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            view backgroundColor   UIColor red  0 094  green  0 239  blue  0 424  alpha  1 0          or if a simple color  override func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            view backgroundColor   UIColor white         Updated for Swift 5  override func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            view tintColor   UIColor red  0 094  green  0 239  blue  0 424  alpha  1 0          or if a simple color  override func tableView   tableView  UITableView  willDisplayHeaderView view  UIView  forSection section  Int            view tintColor   UIColor white

[ios] UITableView - change section header color

Examples related to ios

Examples related to uitableview

Examples related to cocoa-touch