How to Change Inside Background Color of Uisearchbar Component on iOS

How to change inside background color of UISearchBar component on iOS

Use this code to change the searchBar's UITextField backgroundImage:

UITextField *searchField;
NSUInteger numViews = [searchBar.subviews count];
for (int i = 0; i < numViews; i++) {
if ([[searchBar.subviews objectAtIndex:i] isKindOfClass:[UITextField class]]) { //conform?
searchField = [searchBar.subviews objectAtIndex:i];
}
}
if (searchField) {
searchField.textColor = [UIColor whiteColor];
[searchField setBackground: [UIImage imageNamed:@"yourImage"]]; //set your gray background image here
[searchField setBorderStyle:UITextBorderStyleNone];
}

Use the below code to change the UISearchBarIcon:

 UIImageView *searchIcon = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"yourSearchBarIconImage"]];
searchIcon.frame = CGRectMake(10, 10, 24, 24);
[searchBar addSubview:searchIcon];
[searchIcon release];

Also, to change the searchBar icon you can use the following built-in method on UISearchBar (which is available from iOS 5+):

- (void)setImage:(UIImage *)iconImage forSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state

Here you can set 4 types of UISearchBarIcon i.e.:

  1. UISearchBarIconBookmark
  2. UISearchBarIconClear
  3. UISearchBarIconResultsList
  4. UISearchBarIconSearch

I hope this help you...

How to change background color of the text field in the UISearchController?

Here is a an example on how to set the textField background.

class ViewController: UIViewController {

let searchController = UISearchController(searchResultsController: nil)

private lazy var searchTextField: UITextField? = { [unowned self] in
var textField: UITextField?
self.searchController.searchBar.subviews.forEach({ view in
view.subviews.forEach({ view in
if let view = view as? UITextField {
textField = view
}
})
})
return textField
}()

override func viewDidLoad() {
super.viewDidLoad()

searchController.obscuresBackgroundDuringPresentation = false
searchController.searchBar.placeholder = "Search Candies"
navigationItem.searchController = searchController
definesPresentationContext = true

if let bg = self.searchTextField?.subviews.first {
bg.backgroundColor = .green
bg.layer.cornerRadius = 10
bg.clipsToBounds = true
}
}
}

Result

Sample Image

How to change background color of UiSearchBar to black -SWIFT

You can use barStyle property of UISearchBar , if you are using story board you can use Attribute Inspector to change bar style, or use following code segment. It might help mate :)

categorySearchBar.barStyle = UIBarStyle.Black

UISearchBar: clear background color or set background image

I just came up with a solution that works really well. You have to override the UISearchBar and then hide both the Background and Segment Control layers. Then Draw the background.

@ .m

#import "UISearchBar.h" 
#import

@implementation UISearchBar(CustomBackground)

- (id)init
{
for ( UIView * subview in self.subviews )
{
if ([subview isKindOfClass:NSClassFromString(@"UISearchBarBackground") ] )
subview.alpha = 0.0;

if ([subview isKindOfClass:NSClassFromString(@"UISegmentedControl") ] )
subview.alpha = 0.0;
}

return self;
}

+ (UIImage *) bgImagePortrait
{
static UIImage *image = nil;
if (image == nil)
image = [[UIImage imageNamed:@"UISearchBarBack.png"] retain ];

return image;
}

+ (UIImage *) bgImageLandscape
{
static UIImage *image = nil;
if (image == nil)
image = [[UIImage imageNamed:@"UISearchBarBack.png"] retain];

return image;
}

- (void) drawLayer:(CALayer *)layer inContext:(CGContextRef)contenxt
{
if ([self isMemberOfClass:[UISearchBar class]] == NO)
return;

UIImage * image = ( self.frame.size.width > 320 ) ? [UISearchBar bgImageLandscape ] : [UISearchBar bgImagePortrait ];

for ( UIView * subview in self.subviews ) {
if ([subview isKindOfClass:NSClassFromString(@"UISearchBarBackground") ] )
subview.alpha = 0.0;

if ([subview isKindOfClass:NSClassFromString(@"UISegmentedControl") ] )
subview.alpha = 0.0;
}

CGContextTranslateCTM( contenxt , 0 , image.size.height );
CGContextScaleCTM( contenxt, 1.0, -1.0 );
CGContextDrawImage( contenxt , CGRectMake( 0 , 0 , image.size.width , image.size.height ), image.CGImage );
}

@end

@ .h

#import 
#import


@interface UISearchBar(CustomBackground)

@end

Hope this helps!

IOS UISearchBar Background Color In iOS 9

Swift 3

To remove the background altogether, set backgroundImage to an empty image:

searchBar.backgroundImage = UIImage()

To set a custom background color, use barTintcolor property:

searchBar.barTintColor = .green


Related Topics



Leave a reply



Submit