ios - Hoe de achtergrondkleur van de UISearchBar-component op iOS te veranderen

Ik weet hoe ik de UISearchBarachtergrondkleur rond het zoekveld moet verwijderen/wijzigen:

[[self.searchBar.subviews objectAtIndex:0] removeFromSuperview];
self.searchBar.backgroundColor = [UIColor grayColor];

Maar weet niet hoe je dit er zo in moet doen:

Dit moet compatibel zijn met iOS 4.3+.

Antwoord 1, autoriteit 100%

Pas het tekstveld zelf aan.

Ik doe dit gewoon en het werkt prima voor mij (iOS 7).

UITextField *txfSearchField = [_searchBar valueForKey:@"_searchField"];
txfSearchField.backgroundColor = [UIColor redColor];

Op deze manier hoeft u geen afbeelding te maken, het formaat ervan te wijzigen, enz…

Antwoord 2, autoriteit 89%

Details

Xcode versie 11.0 (11A420a), snel 5

UISearchBar-aanpasvoorbeeld

Oplossing

import UIKit
extension UISearchBar {
    func getTextField() -> UITextField? { return value(forKey: "searchField") as? UITextField }
    func setTextField(color: UIColor) {
        guard let textField = getTextField() else { return }
        switch searchBarStyle {
        case .minimal:
            textField.layer.backgroundColor = color.cgColor
            textField.layer.cornerRadius = 6
        case .prominent, .default: textField.backgroundColor = color
        @unknown default: break
        }
    }
}

Gebruik

let searchBar = UISearchBar(frame: CGRect(x: 0, y: 20, width: UIScreen.main.bounds.width, height: 44))
//searchBar.searchBarStyle = .prominent
view.addSubview(searchBar)
searchBar.placeholder = "placeholder"
searchBar.setTextField(color: UIColor.green.withAlphaComponent(0.3))

Resultaat 1

searchBar.searchBarStyle = .prominent // or default

Resultaat 2

searchBar.searchBarStyle = .minimal

Volledig voorbeeld

import UIKit
class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        let searchBar = UISearchBar(frame: CGRect(x: 0, y: 20, width: UIScreen.main.bounds.width, height: 44))
        //searchBar.searchBarStyle = .minimal
        searchBar.searchBarStyle = .prominent
        view.addSubview(searchBar)
        searchBar.placeholder = "placeholder"
        searchBar.setTextField(color: UIColor.green.withAlphaComponent(0.3))
    }
}

Antwoord 3, autoriteit 83%

Oplossing die geen privé-API vereist! 🙂

Momenteel (waarschijnlijk sinds iOS 5) kun je dit doen, voor slechts één kleur, op deze manier:

[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBackgroundColor:[UIColor redColor]];

maar houd er rekening mee dat de wijziging op basis van uiterlijk globaal is voor de app (het kan een voordeel of een nadeel van de oplossing zijn).

Voor Swift kun je gebruiken (het werkt voor iOS 9 en hoger):

if #available(iOS 9.0, *) {
    UITextField.appearanceWhenContainedInInstancesOfClasses([UISearchBar.self]).backgroundColor = UIColor.darkGrayColor()
}

Je hebt #availableniet nodig als je project iOS 9 en nieuwer ondersteunt.

Als je eerdere versies van iOS moet ondersteunen en Swift wilt gebruiken, bekijk dan ditvraag.

Antwoord 4, autoriteit 77%

Gebruik deze code om de UITextFieldbackgroundImage van de searchBar te wijzigen:

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];
}

Gebruik de onderstaande code om de UISearchBarIconte wijzigen:

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

Om het zoekbalkpictogram te wijzigen, kunt u ook de volgende ingebouwde methode gebruiken op UISearchBar(die beschikbaar is vanaf iOS 5+):

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

Hier kunt u 4 soorten UISearchBarIconinstellen, d.w.z.:

UISearchBarIconBookmark
UISearchBarIconClear
UISearchBarIconResultsList
UISearchBarIconSearch

Ik hoop dat dit je helpt…

Antwoord 5, autoriteit 51%

Volgens de UISearchBar-documentatie:

Je zou deze functie voor iOS 5.0+ moeten gebruiken.

- (void)setSearchFieldBackgroundImage:(UIImage *)backgroundImage forState:(UIControlState)state

Gebruiksvoorbeeld:

[mySearchBar setSearchFieldBackgroundImage:myImage forState:UIControlStateNormal];

Helaas moet je in iOS 4 terugvallen op minder geavanceerde methoden. Zie andere antwoorden.

Antwoord 6, autoriteit 43%

Zoals Accatyyc zegt voor iOS5+ gebruik setSearchFieldBackgroundImage, maar je moet ofwel een afbeelding maken, of het volgende doen:

CGSize size = CGSizeMake(30, 30);
// create context with transparent background
UIGraphicsBeginImageContextWithOptions(size, NO, [UIScreen mainScreen].scale);
// Add a clip before drawing anything, in the shape of an rounded rect
[[UIBezierPath bezierPathWithRoundedRect:CGRectMake(0,0,30,30)
                            cornerRadius:5.0] addClip];
[[UIColor grayColor] setFill];
UIRectFill(CGRectMake(0, 0, size.width, size.height));
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[self.searchBar setSearchFieldBackgroundImage:image forState:UIControlStateNormal];

Antwoord 7, autoriteit 36%

hoe zit het met Apple Way?

UISearchBar.appearance().setSearchFieldBackgroundImage(myImage, for: .normal)

je kunt elke afbeelding op je ontwerp zetten!

Maar als u alle programmaticles wilt maken, kunt u dit doen

mijn oplossing op Swift 3

let searchFieldBackgroundImage = UIImage(color: .searchBarBackground, size: CGSize(width: 44, height: 30))?.withRoundCorners(4)
UISearchBar.appearance().setSearchFieldBackgroundImage(searchFieldBackgroundImage, for: .normal)

waar ik de helpers-extensie gebruik

public extension UIImage {
    public convenience init?(color: UIColor, size: CGSize = CGSize(width: 1, height: 1)) {
        let rect = CGRect(origin: .zero, size: size)
        UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0)
        color.setFill()
        UIRectFill(rect)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        guard let cgImage = image?.cgImage else { return nil }
        self.init(cgImage: cgImage)
    }
    public func withRoundCorners(_ cornerRadius: CGFloat) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        let rect = CGRect(origin: CGPoint.zero, size: size)
        let context = UIGraphicsGetCurrentContext()
        let path = UIBezierPath(roundedRect: rect, cornerRadius: cornerRadius)
        context?.beginPath()
        context?.addPath(path.cgPath)
        context?.closePath()
        context?.clip()
        draw(at: CGPoint.zero)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext();
        return image;
    }
}

Antwoord 8, autoriteit 30%

Om dit te doen op iOS 13+,

searchController.searchBar.searchTextField.backgroundColor = // your color here

Houd er rekening mee dat searchTextField.borderStylestandaard is ingesteld op roundedRect, wat een lichte grijze overlay toepast bovenop de kleur die u instelt. Als dit ongewenst is, doe dan

searchController.searchBar.searchTextField.borderStyle = .none

Hiermee verdwijnt de grijze overlay, maar ook de afgeronde hoeken.

Antwoord 9, autoriteit 15%

Ik heb ontdekt dat dit de beste manier is om het uiterlijk van verschillende zoekbalkkenmerken in Swift 2.2 en iOS 8+ aan te passen met behulp van UISearchBarStyle.Minimal

searchBar = UISearchBar(frame: CGRectZero)
searchBar.tintColor = UIColor.whiteColor() // color of bar button items
searchBar.barTintColor = UIColor.fadedBlueColor() // color of text field background
searchBar.backgroundColor = UIColor.clearColor() // color of box surrounding text field
searchBar.searchBarStyle = UISearchBarStyle.Minimal
// Edit search field properties
if let searchField = searchBar.valueForKey("_searchField") as? UITextField  {
  if searchField.respondsToSelector(Selector("setAttributedPlaceholder:")) {
    let placeholder = "Search"
    let attributedString = NSMutableAttributedString(string: placeholder)
    let range = NSRange(location: 0, length: placeholder.characters.count)
    let color = UIColor(white: 1.0, alpha: 0.7)
    attributedString.addAttribute(NSForegroundColorAttributeName, value: color, range: range)
    attributedString.addAttribute(NSFontAttributeName, value: UIFont(name: "AvenirNext-Medium", size: 15)!, range: range)
    searchField.attributedPlaceholder = attributedString
    searchField.clearButtonMode = UITextFieldViewMode.WhileEditing
    searchField.textColor = .whiteColor()
  }
}
// Set Search Icon
let searchIcon = UIImage(named: "search-bar-icon")
searchBar.setImage(searchIcon, forSearchBarIcon: .Search, state: .Normal)
// Set Clear Icon
let clearIcon = UIImage(named: "clear-icon")
searchBar.setImage(clearIcon, forSearchBarIcon: .Clear, state: .Normal)
// Add to nav bar
searchBar.sizeToFit()
navigationItem.titleView = searchBar

Antwoord 10, autoriteit 13%

zonder privé-API’s te gebruiken:

for (UIView* subview in [[self.searchBar.subviews lastObject] subviews]) {
    if ([subview isKindOfClass:[UITextField class]]) {
        UITextField *textField = (UITextField*)subview;
        [textField setBackgroundColor:[UIColor redColor]];
    }
}

Antwoord 11, autoriteit 11%

Alleen voor het wijzigen van kleur:

searchBar.tintColor = [UIColor redColor];

Voor het toepassen van achtergrondafbeelding:

[self.searchBar setSearchFieldBackgroundImage:
                          [UIImage imageNamed:@"Searchbox.png"]
                                     forState:UIControlStateNormal];

Antwoord 12, autoriteit 11%

Een betere oplossing is om het uiterlijk van het UITextFieldin UISearchBar

in te stellen

[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBackgroundColor:[UIColor grayColor]];

Antwoord 13, autoriteit 11%

probeer dit snel in iOS13

@IBOutlet weak var searchBar: UISearchBar!
searchBar.barTintColor = .systemIndigo
searchBar.searchTextField.backgroundColor = .white

Antwoord 14, autoriteit 9%

Doorloop alle weergaven met behulp van een categoriemethode (geverifieerd in iOS 7 en gebruikt geen privé-API):

@implementation UISearchBar (MyAdditions)
- (void)changeDefaultBackgroundColor:(UIColor *)color {
  for (UIView *subview in self.subviews) {
    for (UIView *subSubview in subview.subviews) {
      if ([subSubview isKindOfClass:[UITextField class]]) {
        UITextField *searchField = (UITextField *)subSubview;
        searchField.backgroundColor = color;
        break;
      }
    }
  }
}
@end

Dus na het importeren van de categorie in je klas, gebruik het gewoon als:

[self.searchBar changeDefaultBackgroundColor:[UIColor grayColor]];

Houd er rekening mee dat als u dit onmiddellijkachter de regel [[UISearchBar alloc] init]plaatst, het nog niet zal werken aangezien de subweergaven van de zoekbalk worden nog steeds gecreëerd. Zet het een paar regels lager nadat je de rest van de zoekbalk hebt ingesteld.

Antwoord 15, autoriteit 6%

- (void)viewDidLoad
{
    [super viewDidLoad];
    [[self searchSubviewsForTextFieldIn:self.searchBar] setBackgroundColor:[UIColor redColor]];
}
- (UITextField*)searchSubviewsForTextFieldIn:(UIView*)view
{
    if ([view isKindOfClass:[UITextField class]]) {
        return (UITextField*)view;
    }
    UITextField *searchedTextField;
    for (UIView *subview in view.subviews) {
        searchedTextField = [self searchSubviewsForTextFieldIn:subview];
        if (searchedTextField) {
            break;
        }
    }
    return searchedTextField;
}

Antwoord 16, autoriteit 6%

Dit is de Swift-versie ( swift 2.1 /IOS 9 )

for view in searchBar.subviews {
    for subview in view.subviews {
        if subview .isKindOfClass(UITextField) {
            let textField: UITextField = subview as! UITextField
            textField.backgroundColor = UIColor.lightGrayColor()
        }
    }
}

Antwoord 17, autoriteit 4%

iOS 13, Swift 5

searchBar.searchTextField.backgroundColor = .gray
 searchBar.searchTextField.tintColor = .white
 searchBar.searchTextField.textColor = .white

Antwoord 18, Autoriteit 4%

SearchBar heeft nu een nieuw exemplaar-eigenschap SearchTextfield Start IOS 13,
https://developer.apple.com/documentation/uikit/Uisearchbar/3175433- SearchTextfield

if(@available(iOS 13, *))
    searchBar.searchTextField.backgroundColor = [UIColor whiteColor];
    searchBar.searchTextField.textColor = [UIColor blackColor];
else{
    //API that supports below iOS 13
    //This will set it for all the UISearchBars in your application
    [[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setBackgroundColor:[UIColor whiteColor]];
    [[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setTextColor:[UIColor blackColor]];
}

Antwoord 19, Autoriteit 2%

Gebruik dit voor iOS 9:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Override point for customization after application launch.
// Remove lag on oppening the keyboard for the first time
UITextField *lagFreeField = [[UITextField alloc] init];
[self.window addSubview:lagFreeField];
[lagFreeField becomeFirstResponder];
[lagFreeField resignFirstResponder];
[lagFreeField removeFromSuperview];
//searchBar background color change
[[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setBackgroundColor:[UIColor greenColor]];
[[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setTextColor:[UIColor blackColor];
return YES;
}

Antwoord 20, Autoriteit 2%

Swift 3

for subview in searchBar.subviews {
    for innerSubview in subview.subviews {
        if innerSubview is UITextField {
            innerSubview.backgroundColor = UIColor.YOUR_COLOR_HERE
        }
    }
}

Antwoord 21, Autoriteit 2%

Voor Swift 3+, gebruik dit:

for subView in searchController.searchBar.subviews {
    for subViewOne in subView.subviews {
        if let textField = subViewOne as? UITextField {
           subViewOne.backgroundColor = UIColor.red
           //use the code below if you want to change the color of placeholder
           let textFieldInsideUISearchBarLabel = textField.value(forKey: "placeholderLabel") as? UILabel
                textFieldInsideUISearchBarLabel?.textColor = UIColor.blue
        }
     }
}

Antwoord 22, Autoriteit 2%

Met SWIFT 4 zou ik aanraden dat u dit alleen doet, geen extra code nodig:

self.searchBar.searchBarStyle = .prominent
self.searchBar.barStyle = .black

U kunt ook wijzigen. Prominente tot .minimal Mocht u niet willen dat de buitenste achtergrond grijs is.

Antwoord 23

@evgeniy ilyin evgeniy ilyin’s oplossing is de beste.
Ik schreef een objectief-c -versie op basis van deze oplossing.

Maak een UIImageCATEGORIE en adverteer twee klassenmethoden in uiimage + yourcategory.h

+ (UIImage *)imageWithColor:(UIColor *)color withSize:(CGRect)imageRect;
+ (UIImage *)roundImage:(UIImage *)image withRadius:(CGFloat)radius;

Implementeer methoden in uiimage + yourcategory.m

// create image with your color
+ (UIImage *)imageWithColor:(UIColor *)color withSize:(CGRect)imageRect
{
    UIGraphicsBeginImageContext(imageRect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [color CGColor]);
    CGContextFillRect(context, imageRect);
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}
// get a rounded-corner image from UIImage instance with your radius
+ (UIImage *)roundImage:(UIImage *)image withRadius:(CGFloat)radius
{
    CGRect rect = CGRectMake(0.0, 0.0, 0.0, 0.0);
    rect.size = image.size;
    UIGraphicsBeginImageContextWithOptions(image.size, NO, [UIScreen mainScreen].scale);
    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:rect
                                                cornerRadius:radius];
    [path addClip];
    [image drawInRect:rect];
    image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}

Maak uw eigen UISearchBarin uw ViewController

CGRect rect = CGRectMake(0.0, 0.0, 44.0, 30.0);
UIImage *colorImage = [UIImage imageWithColor:[UIColor yourColor] withSize:rect];
UIImage *finalImage = [UIImage roundImage:colorImage withRadius:4.0];
[yourSearchBar setSearchFieldBackgroundImage:finalImage forState:UIControlStateNormal];

Antwoord 24

Dit werkte voor mij.

- (void)setupSearchBar
{
    [self.searchBar setReturnKeyType:UIReturnKeySearch];
    [self.searchBar setEnablesReturnKeyAutomatically:NO];
    [self.searchBar setPlaceholder:FOLocalizedString(@"search", nil)];
    [self.searchBar setBackgroundImage:[UIImage new]];
    [self.searchBar setBackgroundColor:[UIColor myGreyBGColor]];
    [self.searchBar setBarTintColor:[UIColor myGreyBGColor]];
    [self.searchBar setTintColor:[UIColor blueColor]];
}

Antwoord 25

Gebruik het om het zoektekstveld backgroud_color bij te werken voor xcode10 en xcode11 werkt prima voor mij

[[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setTextColor:[UIColor greenColor]];

Antwoord 26

Dit heeft me geholpen om de achtergrondkleur van textField in de zoekbalk te wijzigen.

UITextField.appearance(whenContainedInInstancesOf: [UISearchBar.self]).backgroundColor = .white

Hoe de achtergrondkleur van de UISearchBar-component op iOS te veranderen