0

I’m trying to customize the appearance of a UITextField inside a UISearchBar. Specifically, I want to change the background color and other style properties. I am using the following code to make some adjustments

func configureMarkerSearchBar(with placeholder: String) { backgroundColor = .clear tintColor = .clear searchTextField.layer.cornerRadius = CGFloat(SearchBarConstants.searchBarLayerRadius) searchTextField.layer.masksToBounds = true sizeToFit() if let textField = value(forKey: SearchBarConstants.searchFieldKey) as? UITextField { let attributedString = NSAttributedString(string: placeholder, attributes: [NSAttributedString.Key.foregroundColor: SearchBarConstants.searchBarTextInputColor]) textField.attributedPlaceholder = attributedString textField.font = UIFont.regularDMSans(of: SearchBarConstants.textFieldFontSize) textField.layer.cornerRadius = SearchBarConstants.searchBarCornerRadius textField.translatesAutoresizingMaskIntoConstraints = false textField.backgroundColor = .clear textField.tintColor = .clear NSLayoutConstraint.activate([ textField.heightAnchor.constraint(equalToConstant: CGFloat(46)), textField.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 0), textField.trailingAnchor.constraint(equalTo: trailingAnchor, constant: 0), textField.centerYAnchor.constraint(equalTo: centerYAnchor, constant: 0) ]) searchTextField.clipsToBounds = true if let searchIcon = UIImage(named: SearchBarConstants.iconSearch) { let imageView = UIImageView(image: searchIcon) searchIcon.withRenderingMode(.alwaysTemplate) searchIcon.withTintColor(SearchBarConstants.searchBarTextInputColor) let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: SearchBarConstants.searchIconOffset + searchIcon.size.width, height: searchIcon.size.height)) imageView.frame = CGRect(x: SearchBarConstants.searchIconOffset, y: 0, width: searchIcon.size.width, height: searchIcon.size.height) paddingView.addSubview(imageView) textField.leftView = paddingView textField.leftViewMode = .always } }

}

The issue I’m facing is that whenever I try to access and modify the background view of the UITextField, it always defaults to tertiarySystemFillColor instead of the custom color I set.

Has anyone encountered this issue before? How can I successfully change the background color and ensure my customizations are applied properly?

Thank you!

View Hierarchy

Has anyone encountered this issue before? How can I successfully change the background color and ensure my customizations are applied properly?

Improve this question

1 Answer 1

Reset to default
0

You can modify text field directly through searchTextField property of UISearchBar.

Example UIViewController to demonstrate customization of text field.

import UIKit class ViewController: UIViewController { // MARK: - UISearchController lazy var searchBar: UISearchBar = { let view = UISearchBar() view.placeholder = "Search here..." return view }() override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view. setupSearchBar() customizeSearchBar() } private func setupSearchBar() { view.addSubview(searchBar) searchBar.translatesAutoresizingMaskIntoConstraints = false NSLayoutConstraint.activate([ searchBar.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor), searchBar.leadingAnchor.constraint(equalTo: view.leadingAnchor), searchBar.trailingAnchor.constraint(equalTo: view.trailingAnchor) ]) } private func customizeSearchBar() { searchBar.setImage(UIImage(systemName: "magnifyingglass.circle.fill"), for: .search, state: .normal) searchBar.searchTextField.font = .italicSystemFont(ofSize: 15) searchBar.searchTextField.borderStyle = .none searchBar.searchTextField.backgroundColor = .red searchBar.searchTextField.layer.cornerRadius = 24.0 } }

Result:

Customized UITextField inside UISearchBar

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.