Customize search bar

问题:

I am designing a search bar. I need the search bar to look like one in the image. Tried few ways but no changes. Help much appreciated.

[Edited] See the image after using Richard's code it looks like this. I want the gray color to be clear.

回答1:

self.searchBar is an IBOutlet. You can also create it dynamically.

self.searchBar.layer.borderWidth = 2.0;
self.searchBar.layer.borderColor = [UIColor brownColor].CGColor;
self.searchBar.layer.cornerRadius = 15.0;
self.searchBar.barTintColor = [UIColor colorWithRed:255/255.0 green:246/255.0 blue:241/255.0 alpha:1.0];
self.searchBar.backgroundColor = [UIColor clearColor];

UITextField *textField = [self.searchBar valueForKey:@"_searchField"];
textField.textColor = [UIColor brownColor];
textField.placeholder = @"Search";
textField.leftViewMode = UITextFieldViewModeNever; //hiding left view
textField.backgroundColor = [UIColor colorWithRed:255/255.0 green:246/255.0 blue:241/255.0 alpha:1.0];
textField.font = [UIFont systemFontOfSize:18.0];
[textField setValue:[UIColor brownColor] forKeyPath:@"_placeholderLabel.textColor"];

UIImageView *imgview = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 20, 30)];
imgview.image = [UIImage imageNamed:@"searchIcon.png"]; //you need to set search icon for textfield's righ view

textField.rightView = imgview;
textField.rightViewMode = UITextFieldViewModeAlways;

Output :

回答2:

You can use image to change UISearchBar appearance-

[[UISearchBar appearance] setBackgroundColor:[UIColor clearColor]];   
[[UISearchBar appearance] setBackgroundImage:[UIImage imageNamed:@"searchBG.png"]];
[[UISearchBar appearance] setSearchFieldBackgroundImage:[UIImage imageNamed:@"search.png"] forState:UIControlStateNormal];

回答3:

You can use some custom solutions (it's better for customizing) For example SSSearchBar or try find some similar