iOS - Customizing Cancel button of UISearchBar

Question

In my iOS5 iPhone application, i'm setting the tint color of search bar using following code:

searchBar.tintColor = UIColorMake(@"#EFEFEF");

RGB value of #efefef is (239,239,239)
Its working fine. But when cancel button appears the text "Cancel" is not visible. Can I customize only the cancel button with transparent black and white text on that?
is it possible to customize?

I have written an answer to this topic here: http://stackoverflow.com/questions/19206757/how-to-change-textcolor-of-cancel-button-of-uisearchbar-in-ios7. Just use the SHSearchBar which is not such a pain in the ass like the UISearchBar. — blackjacx, Nov 25 '16 at 12:38

score 42 · Answer 1 · answered Sep 04 '12 at 14:08

42

You can customize the Cancel button on iOS 5 by using the appearance proxy. You need to change appearance of UIBarButtonItem when contained in UISearchBar. For example to change the title font of the Cancel button you can use:

NSDictionary *attributes =
    [NSDictionary dictionaryWithObjectsAndKeys:
     [UIColor whiteColor], UITextAttributeTextColor,
     [UIColor colorWithRed:0 green:0 blue:0 alpha:0.5], UITextAttributeTextShadowColor,
     [NSValue valueWithUIOffset:UIOffsetMake(0, 1)], UITextAttributeTextShadowOffset,
     [UIFont systemFontOfSize:12], UITextAttributeFont,
     nil];
[[UIBarButtonItem appearanceWhenContainedIn:[UISearchBar class], nil]
    setTitleTextAttributes:attributes forState:UIControlStateNormal];
[[UIBarButtonItem appearanceWhenContainedIn:[UISearchBar class], nil]
    setTitleTextAttributes:attributes forState:UIControlStateHighlighted];

answered Sep 04 '12 at 14:08

Marián Černý

15,096
4
70
83

5

THIS should be the accepted answer. It's not hacky, it's clear, and it works. The currently accepted answer could break at any time. – csotiriou Jun 10 '13 at 17:16
1

This is great for changing the text on the button, but how do you change the button itself? eg - change the button size – Zayin Krige Jul 11 '13 at 13:13
1

Unfortunately UISearchBar also contains a Clear button (grey circle with an x inside) so if you change Cancel button's background image using this method, Clear button is affected too... – Louis Nguyen Aug 05 '13 at 09:02

score 5 · Accepted Answer · answered Jun 16 '12 at 12:54

You could search for UISearchBar subViews and locate the cancel button, it is dangerous to do so, since the button could change For example you could add this in your viewWillAppear

- (void) viewWillAppear:(BOOL)animated
{
    //show the cancel button in your search bar
    searchBar.showsCancelButton = YES;
    //Iterate the searchbar sub views
    for (UIView *subView in searchBar.subviews) {
        //Find the button
        if([subView isKindOfClass:[UIButton class]])
        {
            //Change its properties
            UIButton *cancelButton = (UIButton *)[sb.subviews lastObject];
            cancelButton.titleLabel.text = @"Changed";
        }
    }
}

As i said before this could change, its a hack to do so, you better stick with the original, or create your own search bar.

This is not advisable and as of iOS 5 the better way to handle this is with the appearance proxy as Marián Černý descibes in his answer. — Craig B, Nov 27 '13 at 21:23

score 4 · Answer 3 · answered Jun 16 '12 at 13:25

Since iOS5 you can edit the Navigationbar, Toolbar, Tabbar and some more with this code...

NSDictionary *textTitleOptions = [NSDictionary dictionaryWithObjectsAndKeys:
                                          [UIColor darkGrayColor], 
                                          UITextAttributeTextColor, 
                                          [UIColor whiteColor], 
                                          UITextAttributeTextShadowColor, nil];
[[UINavigationBar appearance] setTitleTextAttributes:textTitleOptions];

I haven´t tested it with a searchbar, but it should work similar.

No it doesn't. If you look at the appearance documentation for the search bar, it does not provide a clear handler for changing the attributes of the search button. — csotiriou, Jun 10 '13 at 17:18

score 0 · Answer 4 · edited May 23 '17 at 12:16

This method works in IOS7

for (UIView *view in searchBar.subviews)
    {
        for (id subview in view.subviews)
        {
            if ( [subview isKindOfClass:[UIButton class]] )
            {
                // customize cancel button
                UIButton* cancelBtn = (UIButton*)subview;
                [cancelBtn setEnabled:YES];
                break;
            }
        }
    }

Check this https://stackoverflow.com/a/18150826/1767686

iOS - Customizing Cancel button of UISearchBar

4 Answers4

Linked