IOS mimic table by default tableView

Question

I want to emulate the programmatically accurate look of this header:

So far, my best attempt has been as follows:

UILabel* header = [[UILabel alloc] init] ; header.backgroundColor = [UIColor clearColor]; header.textAlignment = NSTextAlignmentCenter; header.textColor = [[UIColor alloc] initWithRed:86 green:92 blue:112 alpha:0.1]; header.shadowColor = [UIColor darkGrayColor]; header.shadowOffset = CGSizeMake(1,0); header.font = [UIFont boldSystemFontOfSize:18]; 

But it looks like this:

Can someone please help me with the exact way to do this?

Thanks in advance!

Answer 1

A Norwegian guy wrote a blog post about this a while ago: http://www.gersh.no/posts/view/default_styling_of_sections_headers_in_uitableview_grouped

All loans go to him for the code.

 - (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section { UIView *containerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 40)]; containerView.backgroundColor = [UIColor groupTableViewBackgroundColor]; CGRect labelFrame = CGRectMake(20, 2, 320, 30); if(section == 0) { labelFrame.origin.y = 13; } UILabel *label = [[UILabel alloc] initWithFrame:labelFrame]; label.backgroundColor = [UIColor clearColor]; label.font = [UIFont boldSystemFontOfSize:17]; label.shadowColor = [UIColor colorWithWhite:1.0 alpha:1]; label.shadowOffset = CGSizeMake(0, 1); label.textColor = [UIColor colorWithRed:0.265 green:0.294 blue:0.367 alpha:1.000]; label.text = [self tableView:tableView titleForHeaderInSection:section]; [containerView addSubview:label]; return containerView; } 

Answer 2

THIS

You need to set header.frame = CGRectMake(10,1, 100, 18 );

OR

Use UITableView Data Source Method

 - (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section { return @"Header"; // just pass name of your hearder } 

Edition:

 -(UIView*)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section { UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 20)]; UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(50, 2, 100, 18)]; label.text= [self.listOfHeader objectAtIndex:section]; label.backgroundColor=[UIColor clearColor]; label.textAlignment=NSTextAlignmentLeft; [view addSubview:label]; return view; } 

Also add

 - (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section { return 20; } 

Answer 3

What you can do is calculate the width of your UILabel dynamically / programmatically. Using this code:

 CGSize maximumLabelSize = CGSizeMake(296,9999); CGSize expectedLabelSize = [yourString sizeWithFont:yourLabel.font constrainedToSize:maximumLabelSize lineBreakMode:yourLabel.lineBreakMode]; 

Then add 10 pixels to the width you get. Install the frame of your UILabel. And install it as follows:

 header.frame = CGRectMake(0.0,5.0,expectedLabelSize.width + 10.0,expectedLabelSize.height); header.textAlignment = NSTextAlignmentRight;