21

I know this is a noob question but ...I have these labels on a tableview, but the text is completely squished to the left. I want to add a bit of padding. How do I go about it?

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section  {

    UIView* customView = [[[UIView alloc] initWithFrame:CGRectMake(10,0,300,60)] autorelease];

    UILabel *headerLabel = [[[UILabel alloc] initWithFrame:CGRectZero] autorelease];

    headerLabel.backgroundColor = [UIColor colorWithHexString:[[_months objectAtIndex:section] objectForKey:@"color"]];
    headerLabel.font = [UIFont boldSystemFontOfSize:18];
    headerLabel.frame = CGRectMake(0,0,400,30);
    headerLabel.text =  [[_months objectAtIndex:section] objectForKey:@"name"];

    headerLabel.textColor = [UIColor whiteColor];


    [customView addSubview:headerLabel];

    return customView;
}

any help is much appreciated! Thanks!

Meet Doshi
  • 4,241
  • 10
  • 40
  • 81
sixstatesaway
  • 1,106
  • 1
  • 12
  • 25
  • Possible duplicate of [UILabel text margin](http://stackoverflow.com/questions/3476646/uilabel-text-margin) – gblazex Mar 05 '16 at 17:24

8 Answers8

40

For a full list of available solutions, see this answer: UILabel text margin


The most flexible approach to add padding to UILabel is to subclass UILabel and add an edgeInsets property. You then set the desired insets and the label will be drawn accordingly.

OSLabel.h

#import <UIKit/UIKit.h>

@interface OSLabel : UILabel

@property (nonatomic, assign) UIEdgeInsets edgeInsets;

@end

OSLabel.m

#import "OSLabel.h"

@implementation OSLabel

- (id)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        self.edgeInsets = UIEdgeInsetsMake(0, 0, 0, 0);
    }
    return self;
}

- (void)drawTextInRect:(CGRect)rect {
    [super drawTextInRect:UIEdgeInsetsInsetRect(rect, self.edgeInsets)];
}

@end
Community
  • 1
  • 1
Brody Robertson
  • 8,506
  • 2
  • 47
  • 42
  • 1
    Thanks this is a nice solution. Just wanted to mention though that you don't need to return the `super drawTextInRect:` as it has no return value. – ChrisH Sep 06 '13 at 16:03
  • 3
    This solution doesn't work for multiple lines if you're hoping your label will be automatically resized to fit the text. If the added inset causes the text to wrap to an additional line, the label will not grow to show it. Any ideas on how to adapt this solution for that case? – James Harpe Nov 22 '13 at 16:51
  • if you don't want subclass of uilabel , simply add a background View , and put the uilabel on it and for example [UILabel alloc] initwithframe:CGRectMake(10,5,200,100)]; – chings228 Jun 13 '14 at 09:23
  • Is there any way i can reuse this feature? Like i have a situation where different label needs different spacing. Creating only one OSLabel and use it in different scenario, is it possible? – Swayambhu Dec 01 '15 at 06:29
  • @Swayambhu , I'm not sure I understand your question. Each of your label instances can subclass OSLabel and each instance can have a different edgeInsets value. – Brody Robertson Dec 01 '15 at 21:04
  • @BrodyRobertson how you can differentiate between different instances that are coming from a different labels. – Swayambhu Dec 02 '15 at 07:10
16

you can simple add white space at the begin of you text;

[NSString stringWithFormat:@"  %@",text];

It is 'evil' way to add 'padding', but it may help.

Kamen Tsvetkov
  • 519
  • 5
  • 9
Danyun Liu
  • 3,072
  • 24
  • 22
14

I found a better way to do this:

-  (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section  {

    CGRect frame = CGRectMake(0, 0, 320, 25);
    UIView *customView = [[UIView alloc] initWithFrame:frame];
    UILabel *sectionTitle = [[UILabel alloc] init];
    [customView addSubview:sectionTitle]; 
    customView.backgroundColor = [UIColor redColor];

    frame.origin.x = 10; //move the frame over..this adds the padding!
    frame.size.width = self.view.bounds.size.width - frame.origin.x;

    sectionTitle.frame = frame;
    sectionTitle.text = @"text";
    sectionTitle.font = [UIFont boldSystemFontOfSize:17];
    sectionTitle.backgroundColor = [UIColor clearColor];
    sectionTitle.textColor = [UIColor whiteColor];

    [sectionTitle release];

    tableView.allowsSelection = NO;

    return [customView autorelease];

}
sixstatesaway
  • 1,106
  • 1
  • 12
  • 25
8

Set the backgroundColor on the customView also

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    CGRect frame = tableView.bounds;
    frame.size.height = HEADER_HEIGHT;
    UIView* customView = [[[UIView alloc] initWithFrame:frame] autorelease];
    customView.backgroundColor = [UIColor redColor];    

    UILabel *headerLabel = [[[UILabel alloc] initWithFrame:CGRectInset(frame, LABEL_PADDING, 0)] autorelease];     
    // Orientation support   
    headerLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;    
    headerLabel.backgroundColor = [UIColor redColor];
    headerLabel.font = [UIFont boldSystemFontOfSize:18];
    headerLabel.text = @"My Text Label";        
    headerLabel.textColor = [UIColor whiteColor];

    [customView addSubview:headerLabel];

    return customView;    
}

Try not to hardcode magic numbers: (add these to top of file)

#define HEADER_HEIGHT 60.0f
#define LABEL_PADDING 10.0f

Should give this preview

Jason Harwig
  • 43,743
  • 5
  • 43
  • 44
  • 1
    this was what I thought too but unfortunately it moved the entire box (including the background color) so there is 10px of white, then the colored background with the text still squished against the left hand side :( – sixstatesaway Feb 29 '12 at 16:00
2

You can create a subclass of UILabel and override intrinsicContentSize and - (CGSize)sizeThatFits:(CGSize)size:

- (CGSize) intrinsicContentSize
{
    CGSize parentSize = [super intrinsicContentSize];
    parentSize.width += 2*PADDING_VALUE;
    return parentSize;
}

- (CGSize)sizeThatFits:(CGSize)size
{
    CGSize parentSize = [super sizeThatFits:size];
    parentSize.width += 2*PADDING_VALUE;
    return parentSize;
}
yageek
  • 4,115
  • 3
  • 30
  • 48
2

Try the following & play around with the padding etc.

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section  {

    CGFloat headerHeight = 60, padding = 10;

    UIView* customView = [[[UIView alloc] initWithFrame:CGRectMake(0,0,320,headerHeight)] autorelease];
    customView.backgroundColor = [UIColor colorWithHexString:[[_months objectAtIndex:section] objectForKey:@"color"]];

    CGRect frame = CGRectMake(padding,padding,320 - 2*padding,headerHeight-2*padding);

    UILabel *headerLabel = [[[UILabel alloc] initWithFrame:frame] autorelease];

    headerLabel.font = [UIFont boldSystemFontOfSize:18];
    headerLabel.backgroundColor = [UIColor clearColor];
    headerLabel.text =  [[_months objectAtIndex:section] objectForKey:@"name"];

    headerLabel.textColor = [UIColor whiteColor];

    [customView addSubview:headerLabel];

    return customView;
}
Shameem
  • 14,199
  • 13
  • 40
  • 43
0

True, it's a bit inexact and hackish, but you could always add a space in front of the month name like this:

headerLabel.text = [NSString stringWithFormat:@" %@",
                    [[_months objectAtIndex:section] objectForKey:@"name"]];
BP.
  • 10,033
  • 4
  • 34
  • 53
0

You could use a UITextView instead. I did this in Cocoa but I'm pretty sure it translates to UITextView:

    NSTextView *headerLabel = [[[NSTextView alloc] initWithFrame:NSMakeRect(20.0, 20.0, 400.0, 20.0)] autorelease];
[headerLabel setBackgroundColor: [NSColor redColor]];
[headerLabel setString: @"Testing Stuff"];
[headerLabel setTextColor:  [NSColor whiteColor]];

NSSize txtPadding; 
txtPadding.width = 20.0;
txtPadding.height = 0.0;
[headerLabel setTextContainerInset:txtPadding];

[[mainWin contentView] addSubview:headerLabel];
PruitIgoe
  • 6,166
  • 16
  • 70
  • 137
  • nope, it doesn't work. settextcontainerinset is not found on uilabel. – smihael Sep 27 '12 at 15:36
  • pruitlgoe suggests you use nstextview instead of uilabel and call settextcontainerinset. i think you called it over uilabel :) – Adem Özgür Dec 13 '12 at 21:17
  • 1
    A better solution - subclass UILabel and override the drawTextInRect method with: UIEdgeInsets insets = {5, 5, 5, 5}; return [super drawTextInRect:UIEdgeInsetsInsetRect(rect, insets)]; – PruitIgoe Dec 14 '12 at 12:54