ios 如何更改 UISearchBar 图标的颜色？

How to change the color of the UISearchBar Icon?

提问by Damien Romito

I don't know how to modify the original searchIcon's color.

我不知道如何修改原始searchIcon的颜色。

回答by raf

Best solution I found was here Changing the color of the icons in a UItextField inside a UISearchBar

我找到的最佳解决方案是 更改 UISearchBar 内 UItextField 中图标的颜色

(This solution uses the original UISearchBar's icon, no need to supply your own graphical asset)

（本方案使用原UISearchBar的图标，无需提供自己的图形资源）

Converted to Swift (Swift 3):

转换为 Swift (Swift 3)：

    if let textFieldInsideSearchBar = self.searchBar.value(forKey: "searchField") as? UITextField,
        let glassIconView = textFieldInsideSearchBar.leftView as? UIImageView {

            //Magnifying glass
            glassIconView.image = glassIconView.image?.withRenderingMode(.alwaysTemplate)
            glassIconView.tintColor = .whiteColor
    }

回答by Federica Venuto

You can use a custom image of a white search icon, as the search bar will not modify your supplied image. To set a custom image, use this method. (Link to documentation.)

您可以使用白色搜索图标的自定义图像，因为搜索栏不会修改您提供的图像。要设置自定义图像，请使用此方法。（链接到文档。）

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

Example Code:

示例代码：

[searchBar setImage:[UIImage imageNamed:@"SearchIcon"]
   forSearchBarIcon:UISearchBarIconSearch
              state:UIControlStateNormal];

In Swift:

在斯威夫特：

searchBar.setImage(UIImage(named: "SearchIcon"), for: .search, state: .normal)

回答by Darkwonder

This soultion worked for me on Xcode 8.2.1 in Swift 3.0. :

这个灵魂在 Swift 3.0 中的 Xcode 8.2.1 上对我有用。：

extension UISearchBar
{
    func setPlaceholderTextColorTo(color: UIColor)
    {
        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        textFieldInsideSearchBar?.textColor = color
        let textFieldInsideSearchBarLabel = textFieldInsideSearchBar!.value(forKey: "placeholderLabel") as? UILabel
        textFieldInsideSearchBarLabel?.textColor = color
    }

    func setMagnifyingGlassColorTo(color: UIColor)
    {
        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        let glassIconView = textFieldInsideSearchBar?.leftView as? UIImageView
        glassIconView?.image = glassIconView?.image?.withRenderingMode(.alwaysTemplate)
        glassIconView?.tintColor = color
    }
}

Usage example:

用法示例：

searchController.searchBar.setPlaceholderTextColorTo(color: mainColor)
searchController.searchBar.setMagnifyingGlassColorTo(color: mainColor)

回答by Milander

The searchIcon is located in the leftView of the searchTextField. Since this is accessible we can easily set the tintColor for the view. The tintColor is also used for the searchIcon.

searchIcon 位于 searchTextField 的 leftView 中。由于这是可访问的，我们可以轻松地为视图设置 tintColor。tintColor 也用于 searchIcon。

So in your code you can change the search icon to white with the following code:

因此，在您的代码中，您可以使用以下代码将搜索图标更改为白色：

searchBar.searchTextField.leftView?.tintColor = .white

回答by FARAZ

Swift-3:

斯威夫特-3：

extension UISearchBar
{

    func setMagnifyingGlassColorTo(color: UIColor)
    {
        // Search Icon
        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        let glassIconView = textFieldInsideSearchBar?.leftView as? UIImageView
        glassIconView?.image = glassIconView?.image?.withRenderingMode(.alwaysTemplate)
        glassIconView?.tintColor = color
    }

    func setClearButtonColorTo(color: UIColor)
    {
        // Clear Button
        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        let crossIconView = textFieldInsideSearchBar?.value(forKey: "clearButton") as? UIButton
        crossIconView?.setImage(crossIconView?.currentImage?.withRenderingMode(.alwaysTemplate), for: .normal)
        crossIconView?.tintColor = color
    }

    func setPlaceholderTextColorTo(color: UIColor)
    {
        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        textFieldInsideSearchBar?.textColor = color
        let textFieldInsideSearchBarLabel = textFieldInsideSearchBar!.value(forKey: "placeholderLabel") as? UILabel
        textFieldInsideSearchBarLabel?.textColor = color
    }
}

Call these extension method like this:

像这样调用这些扩展方法：

searchBarTextField.setMagnifyingGlassColorTo(color: yourColor)
searchBarTextField.setClearButtonColorTo(color: yourColor)
searchBarTextField.setPlaceholderTextColorTo(color: yourColor)

回答by Allreadyhome

As per Federica's anwser....To do this in swift

根据 Federica's anwser .... 迅速做到这一点

var image: UIImage = UIImage(named: "search")!
self.searchBar.setImage(image, forSearchBarIcon: UISearchBarIcon.Search, state: UIControlState.Normal)

回答by Benjamin Lowry

For just changing the color of the search icon, without altering the actual icon in Swift 3:

仅更改搜索图标的颜色，而不更改 Swift 3 中的实际图标：

if let textField = self.searchBar.value(forKey: "searchField") as? UITextField,
    let iconView = textField.leftView as? UIImageView {

    iconView.image = iconView.image?.withRenderingMode(UIImageRenderingMode.alwaysTemplate)
    iconView.tintColor = UIColor.red
}

Creates a result like so:

创建如下结果：

回答by Bocaxica

A solution for those using interface builder. You can add a User Defined Runtime Attribute to the UISearchBar:

适用于使用界面构建器的人的解决方案。您可以向 UISearchBar 添加用户定义的运行时属性：

searchField.leftView.tintColorof type ColorYou can select the desired color of the icon, can be selected from your Color Assets library to support different colors for both light and dark mode.

searchField.leftView.tintColor类型Color您可以选择所需的图标颜色，可以从您的颜色资源库中选择，以支持浅色和深色模式的不同颜色。

回答by Tom

Following on from some of the answers here

继这里的一些答案之后

If you would like to see and make the changes in storyboard first subclass UISearch bar and do as above.

如果您想在故事板第一个子类 UISearch 栏中查看并进行更改，请执行上述操作。

However add the changes in a @IBInspectable variable and not forgetting the @IBDesignable at the top of the class and setting the searchbar subclass in the "Identity inspector"

但是，在@IBInspectable 变量中添加更改，不要忘记类顶部的@IBDesignable 并在“身份检查器”中设置搜索栏子类

I have added the full working subclass and code below for swift 3.0 Here you will be able to change the placeholder text, search text and magnifying glass

我在下面为 swift 3.0 添加了完整的工作子类和代码 在这里您将能够更改占位符文本、搜索文本和放大镜

import UIKit

@IBDesignable

class CustomSearchBar: UISearchBar {
@IBInspectable var placeholderColor: UIColor? {
    didSet {

        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        let textFieldInsideSearchBarLabel = textFieldInsideSearchBar!.value(forKey: "placeholderLabel") as? UILabel
        textFieldInsideSearchBarLabel?.textColor = placeholderColor
    }
}

@IBInspectable var textColor: UIColor? {
    didSet {
        let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField
        textFieldInsideSearchBar?.textColor = textColor
    }
}

@IBInspectable var magnifyingGlassColor: UIColor? {

    didSet {

        if let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField,
            let glassIconView = textFieldInsideSearchBar.leftView as? UIImageView {

            //Magnifying glass
            glassIconView.image = glassIconView.image?.withRenderingMode(UIImageRenderingMode.alwaysTemplate)
            glassIconView.tintColor = magnifyingGlassColor

        }        }
}

}

}

回答by Enrico Susatyo

Make sure that when you use the setImageAPI, pass an image with rendering mode of UIImageRenderingModeAlwaysTemplate. For example:

确保在使用setImageAPI 时，传递渲染模式为UIImageRenderingModeAlwaysTemplate. 例如：

[self.searchBar setImage:[[UIImage imageNamed: @"icon-search"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate] forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal];