How to make textLabel on UITableViewCell with multiple colours?

Question

I am using UITableview for listing names of person and also implement UISearchbar for searching different names.I want to change textLabel color on UITableViewCell when user searching on specific item,for example when i am typing name “Ant” on searchbar,need to change color of “Ant” on UItableview. Please help me.

see this link http://stackoverflow.com/questions/14231879/is-it-possible-to-change-color-of-single-word-in-uitextview-and-uitextfield — Dharmesh Dhorajiya, Jul 21 '15 at 06:47

score 0 · Answer 1 · answered Jul 21 '15 at 06:48

0

You need to look at using NSAttributedString to specify the colour of the text. You will need to process the visible cells on each change in the search criteria and check when configuring cells for display, find the search text in the name string and set the appropriate format attributes for the found range.

answered Jul 21 '15 at 06:48

Wain

118,658
15
128
151

4

Try implementing it and ask if you have issues, otherwise you don't really actually learn anything from this... – Wain Jul 21 '15 at 06:57

score 0 · Answer 2 · answered Jul 21 '15 at 07:23

You can use below method to fulfil your requirement.

- (NSAttributedString *)highlightText:(NSString *)textToBeHighlighted inString:(NSString *)fullString {
    NSDictionary *attributeForFullText = @{
                                    NSForegroundColorAttributeName  : [UIColor blackColor],
                                    NSFontAttributeName             : [UIFont systemFontOfSize:10.0f]
                                    // And more......
                                    };
    NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:fullString attributes:attributeForFullText];


    [attributedString addAttribute:NSForegroundColorAttributeName value:[UIColor redColor] range:[fullString rangeOfString:textToBeHighlighted]];

    /* you can use the above statement to do single style, 
    but if you want to do something more like size, font, alignment etc. 
    then you can do by below */

    [attributedString addAttributes:dictionary_with_more_style range:[fullString rangeOfString:textToBeHighlighted]];
    return attributedString;
}

And just call it from your cellForRowAtIndexPath

UILabel *titleLabel;
NSString *fullTitle;
NSString *searchString;

[titleLabel setAttributedText:[self highlightText:searchString inString:fullTitle];

score 0 · Answer 3 · answered Jul 21 '15 at 07:23

You can make use of attributedText property of UILabel. This decorates the text on a label. Create a category for UITableViewCell and write a method and do the following:

@implementation UITableViewCell(asdf)

- (void)setText:(NSString *)text withMatchingText:(NSString *)matchingText;
{
    // Set the default text color to the label text.
    self.textLabel.textColor = // Default text color
    if (matchingText.length > 0) {

        // Create the color for the matching text.
        UIColor *matchingColor = // Text color for the matching text, eg. "Ant"

        //Find the range of the matching text from the whole text.
        NSRange firstMatchingRange = [text rangeOfString:matchingText options:NSCaseInsensitiveSearch];

        // Create an attributed string with matching color for your matching text on the whote text.
        NSMutableAttributedString *mString = [[NSMutableAttributedString alloc] initWithString:text];
        [mString addAttribute:NSForegroundColorAttributeName
                        value:matchingColor
                        range:firstMatchingRange];
        self.textLabel.attributedText = mString;

    }else {
        self.textLabel.text = text;
    }
}

In your viewController's tableView:cellForRowAtIndexPath: method do the following:

NSString *text = // the name property
cell setText:text withMatchingText:self.searchBar.text];

self.searchBar is the property of type UISearchBar you have on your ViewController connected with the search bar on your storyboard/xib.

The above code does like, If your search bar is having text then, It set the matchingColor to the matching text (eg. Ant) and the other letter(ony) will be the default colour. If no more matching text is there, then the whole text will be displayed with the default text colour.

This may help you.

score 0 · Answer 4 · answered Jul 21 '15 at 07:32

Check this code. It may solve your problem. Put this code in tableView:cellForRowAtIndexPath: method of your controller.

NSString  *title = @"Test this answer";
NSString *searchText = @"ans";

NSMutableAttributedString *originalString = [[NSMutableAttributedString alloc] initWithString:title];

NSRange range = [title rangeOfString:searchText];

if (range.location == NSNotFound) {
    NSLog(@"No match found");
}
else {
    NSLog(@"Found the range of the substring at (%lu, %lu)", (unsigned long)range.location, range.location + range.length);
    [originalString addAttribute:NSForegroundColorAttributeName value:[UIColor redColor] range:range];
}

cell.lbl_Title.attributedText = originalString;

How to make textLabel on UITableViewCell with multiple colours?

4 Answers4