如何更改UISearchBar图标的颜色？

Question

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

- Damien Romito

Answer 1

搜索图标位于搜索文本框的左视图中。由于这是可访问的，因此我们可以轻松设置视图的tintColor。 tintColor也用于搜索图标。

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

searchBar.searchTextField.leftView?.tintColor = .white

- Milander

---

对于那些只需要改变颜色的人来说，这个解决方案非常完美！谢谢@Milander - Amir Mahdi Nassiri

完美运作且感觉比其他解决方案更不“棘手”，因为其他解决方案可能在未来的iOS版本中无法使用，但请注意，此属性在iOS 13之前不可用。 - doubotis

完美。为什么很难找到合适且简单的解决方案。 - Tilo Delau

这对我有用。简单的解决方案。谢谢。 - Rakshitha Muranga Rodrigo

Answer 2

我找到的最佳解决方案在这里：Changing the color of the icons in a UItextField inside a UISearchBar

(此解决方案使用原始的UISearchBar图标，无需提供自己的图形资源)

转换为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
    }

- raf

---

现在不起作用了，我猜你必须提供自己的图像（如果使用UISeachController）。 - JAHelia

仍然对我有用。 - Matt Rundle

Answer 3

如果您使用白色搜索图标的自定义图片，搜索栏将不会修改您提供的图片。要设置自定义图像，请使用此方法。(文档链接。)

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

示例代码：

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

在Swift中：

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

- Federica Venuto

---

例子：[searchBar setImage:[UIImage imageNamed:@"SearchIconSearch"] forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal]; - Damien Romito

这有点晚了，但如果有人需要知道，图标的大小是13x13像素。玻璃图标可以在这里找到。使用13x13作为1x，26x26作为2x，39x39作为3x。只是想提一下。 - Minebomber

Minebomer 这似乎有点小。在模拟器上，24x24 @1x 等比默认大小要小。 - Jeff

我非常确定图像会被调整大小，只要图像足够大，它就会缩小比例。 - Jeff

从iOS 13开始，您可以使用带有SF Symbols的系统搜索图像，因此您不必提供自己的图标。 - Tom Hamming

Answer 4

这个解决方案对我在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
    }
}

使用示例：

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

- Darkwonder

Answer 5

Swift-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
    }
}

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

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

- FARAZ

Answer 6

在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
}

创建一个如下所示的结果：

- Benjamin Lowry

Answer 7

根据Federica的回答...在Swift中实现此操作

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

- Allreadyhome

Answer 8

对于那些使用界面构建器的人，可以向UISearchBar添加一个用户定义的运行时属性： searchField.leftView.tintColor 类型为 Color，您可以选择所需的图标颜色，可从您的“颜色资产”库中选择不同颜色以支持浅色和深色模式。

图片链接：

- Bocaxica

Answer 9

自从 iOS 13 版本开始，我们就可以通过 SF Symbols 访问许多标准的系统图标。此外，如果你想为搜索栏设置统一的配色方案，以便它们看起来都相同，而不必重复编写代码，你可以使用 Appearance 工作流程一次性更改它们全部。例如：

    let image = UIImage(systemName: "magnifyingglass")?.withTintColor(.white, renderingMode: .alwaysOriginal)
    UISearchBar.appearance().setImage(image, for: .search, state: .normal)

这段代码将应用程序中的所有搜索栏都设置为使用标准放大镜图标，颜色为白色。您可以使用类似的代码来更改“清除”按钮图标、书签图标和结果列表图标。只需将.search更改为适当的枚举值，并找到适当图标的系统名称（您可以从免费的SF System应用程序中获取）。

另一种使用Appearance的方法是设置搜索视图中包含的所有视图的着色颜色，但在某些情况下可能会产生不想要的影响（即更改文本光标的颜色）:

UIView.appearance(whenContainedInInstancesOf: [UISearchBar.self]).tintColor = .yellow

这将使左侧图标和文本光标变为黄色，尽管令人讨厌的是清除按钮由于某种原因并没有变成黄色。我更喜欢不使用这种方法，因为它可能不具备未来性；苹果有一种改变内部内容的习惯，如果不使用他们认可的方法可能会导致意外的变化。

- Ash

Answer 10

继续上面的回答，如果你想在storyboard中看到并进行更改，请先子类化UISearchBar并按照上述步骤操作。

但是请将更改添加到@IBInspectable变量中，不要忘记在类顶部设置@IBDesignable和在“Identity inspector”中设置搜索栏子类。

下面是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

        }        }
}

}

- Tom