CODEWITHSUNDEEP
iphoneobjective-cuitableviewuilabel
DixieFlatline
DixieFlatline

Reputation: 8035

How to make UITableViewCell with 2 labels of different color?

I would like to have UITableViewCell like this:

enter image description here

The text color of "Tel:" must be different from text color of number. Right now i set text to cell as usual:

cell.textLabel.text=@"Something";

Is it possible to have 1 label and change color of some parts of it?

How can I make table cell like on my picture?

Thank you.

Upvotes: 6

Views: 11072

Answers (5)

Mat
Mat

Reputation: 7633

many use the technique of adding the labels as subviews of the cell, and maybe you run into unexpected results with the reuse of the cells. Apple already offers templates that can be customized in every aspect. In your case, without using custom cells, and without adding labels, i would use the template UITableViewCellStyleValue2, you can play with the existing labels and accessoryView, like cell.textLabel, cell.detailTextLabel and cell.accessoryView, see this snippet that emulates more or less your interface:

- (UITableViewCell *)tableView:(UITableView *)tableView 
                     cellForRowAtIndexPath:(NSIndexPath *)indexPath{

    static NSString *CellID = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellID];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue2 
        reuseIdentifier:CellIdentifier] autorelease];
    }

        cell.textLabel.contentMode=UIViewContentModeScaleToFill;
        cell.textLabel.lineBreakMode = UILineBreakModeWordWrap;
        cell.textLabel.baselineAdjustment=UIBaselineAdjustmentAlignCenters;
        cell.textLabel.textAlignment=UITextAlignmentCenter;
        cell.textLabel.font=[UIFont boldSystemFontOfSize:22];
        cell.textLabel.textColor=[UIColor lightGrayColor];

        cell.detailTextLabel.contentMode=UIViewContentModeScaleToFill;
        cell.detailTextLabel.lineBreakMode = UILineBreakModeWordWrap;
        cell.detailTextLabel.baselineAdjustment=UIBaselineAdjustmentAlignCenters;
        cell.detailTextLabel.textAlignment=UITextAlignmentLeft;
        cell.detailTextLabel.font=[UIFont boldSystemFontOfSize:23];
        cell.detailTextLabel.textColor=[UIColor blackColor];

        cell.textLabel.text=@"Tel.:";
        cell.detailTextLabel.text=@"+3912345678";

        UIImageView *imageView = [[UIImageView alloc] initWithImage:
                                  [UIImage imageNamed:@"phone.png"]];
        cell.accessoryView = imageView;
        [imageView release];
        return cell;
}

Hope this helps.

Upvotes: 5

Mehul Mistri
Mehul Mistri

Reputation: 15147

You should have to take two Labels and in Cell...and add this both Label in subview of UITableViewCell

Write this in cellForRowAtIndexPath method.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 
{

    static NSString *CellIdentifier = @"Cell";  
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil)
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];

    for(UIView *eachView in [cell subviews])
        [eachView removeFromSuperview];

    //Initialize Label
    UILabel *lbl1 = [[UILabel alloc]initWithFrame:YOURFRAME];
    [lbl1 setFont:[UIFont fontWithName:@"FontName" size:12.0]];
    [lbl1 setTextColor:[UIColor grayColor]];
    lbl1.text = YOUR CELL TEXT;
    [cell addSubview:lbl1];
    [lbl1 release];

    UILabel *lbl2 = [[UILabel alloc]initWithFrame:YOURFRAME];
    [lbl2 setFont:[UIFont fontWithName:@"FontName" size:12.0]];
    [lbl2 setTextColor:[UIColor blackColor]];
    lbl2.text = YOUR CELL TEXT;
    [cel2 addSubview:lbl2];
    [lbl2 release];

    return cell;
}

UPDATE:

Along with this you can also create Custom cell as define here

Happy Coding..

Upvotes: 8

jbat100
jbat100

Reputation: 16827

It is not possible to change font or colour for parts of a UILabel. The easiest way here is to create a cell subclass, and add two labels either interface builder or in code. This post shows you how to calculate the size of the text in the label so that you can adjust dynamically the size of the label if you want the text of the two labels to be "thouching".

Upvotes: 0

alloc_iNit
alloc_iNit

Reputation: 5183

Either go with custom cell and initialize as per requirement or you can use UITableviewCell and in that add multiple UILabels as per desired formats.

For example...,

static NSString *MyIdentifier =@"MyIdentifier";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:MyIdentifier];

if (cell == nil) 
{       
    cell = [[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:MyIdentifier];     
}

UILabel *lblPhone = [[UILabel alloc] initwithFrame:CGRectMake(5, 5, 150, 30)];
lblPhone.text = @"Tel.";
[cell addSubView: lblPhone];

Upvotes: 0

Saurabh Passolia
Saurabh Passolia

Reputation: 8109

only way is to add new labels as subview with different colors as their background.

Upvotes: 4

Related Questions