web-dev-qa-db-ja.com

UISearchControllerの検索バーをカスタマイズする方法は?

次のように、独立したUISearchBarの外観を設定する方法を知っています。

_    let searchField = searchBar.value(forKey: "searchField") as? UITextField

    if let field = searchField {
        field.backgroundColor = UIColor.defaultBackgroundColor
        field.layer.cornerRadius = 15.0
        field.textColor = .white
        field.tintColor = .white

        field.font = UIFont.systemFont(ofSize: fl(13))
        field.layer.masksToBounds = true
        field.returnKeyType = .search
    }
_

しかし、これはUISearchControllerでは機能しません。

enter image description here

プレースホルダーのテキストの色と左の拡大レンズのアイコンを真っ白に設定したい。 (今それらの上に着色された層があるようです)。

また、入力テキストが黒になっているので、白にもしたいです。

結論として、次のプロパティを変更します。
1。 textFieldの背景色
2。 textFiledプレースホルダーテキストの色
3。 textFiledテキストの色
4。 textFiledフォント

誰もがそれをどのように行うか知っていますか?

次のコードをviewDidAppearに追加します。

_            let placeholderString = NSAttributedString(string: "Placeholder", attributes: [NSAttributedStringKey.foregroundColor: UIColor.white])
            field.attributedPlaceholder = placeholderString

            let iconView = field.leftView as! UIImageView
            iconView.image = iconView.image?.withRenderingMode(.alwaysTemplate)
            iconView.tintColor = .white
_

アップデータ:
これらの設定をViewDidAppear()に入れて、私の問題の一部を解決しました。
しかし、バーの背景色を設定すると、_textfield's background color_が変わりました。
_searchBar.barTintColor = .red_がiOS11のナビゲーションアイテムに埋め込まれたUISearchControllerで機能しないため、_searchBar.backgroundColor = .red_を使用しました
それは私をとても混乱させました。
では、searchBarの背景とtextFieldの背景を別々に変更するにはどうすればよいですか?

6
JsW

検索バーのテキストフィールドにattributedPlaceholderを設定します

@IBOutlet weak var sbSearchBar: UISearchBar!
if let textfield = sbSearchBar.value(forKey: "searchField") as? UITextField {

    textfield.backgroundColor = UIColor.red
    textfield.attributedPlaceholder = NSAttributedString(string: textfield.placeholder ?? "", attributes: [NSAttributedStringKey.foregroundColor : UIColor.white])

    if let leftView = textfield.leftView as? UIImageView {
        leftView.image = leftView.image?.withRenderingMode(.alwaysTemplate)
        leftView.tintColor = UIColor.white
    }

}

これが結果です:

enter image description here

更新:

私はこれがあなたを助けるかもしれないと思います: searchcontrollerでuitextfieldの色を変更する方法?

このコードで色の組み合わせを適用して、見てください。

if #available(iOS 11.0, *) {
            let sc = UISearchController(searchResultsController: nil)
            sc.delegate = self
            let scb = sc.searchBar
            scb.tintColor = UIColor.white
            scb.barTintColor = UIColor.white


            if let textfield = scb.value(forKey: "searchField") as? UITextField {
                //textfield.textColor = // Set text color
                if let backgroundview = textfield.subviews.first {

                    // Background color
                    backgroundview.backgroundColor = UIColor.white

                    // Rounded corner
                    backgroundview.layer.cornerRadius = 10;
                    backgroundview.clipsToBounds = true;

                }
            }

            if let navigationbar = self.navigationController?.navigationBar {
                navigationbar.barTintColor = UIColor.blue
            }
            navigationItem.searchController = sc
            navigationItem.hidesSearchBarWhenScrolling = false

}

結果:

enter image description here

7
Krunal

次のコードをviewDidAppearに追加します。

            let placeholderString = NSAttributedString(string: "Placeholder", attributes: [NSAttributedStringKey.foregroundColor: UIColor.white])
            field.attributedPlaceholder = placeholderString

            let iconView = field.leftView as! UIImageView
            iconView.image = iconView.image?.withRenderingMode(.alwaysTemplate)
            iconView.tintColor = .white

更新-以下は、UISearchControllerの色をカスタマイズするための完全なコードです。

override func viewDidAppear(_ animated: Bool) {

    //sets navigationbar backgroundColor
    if let navigationbar = self.navigationController?.navigationBar {
        navigationbar.barTintColor = UIColor.Magenta
    }

    let searchField = searchController.searchBar.value(forKey: "searchField") as? UITextField

    //sets searchBar backgroundColor
    searchController.searchBar.backgroundColor = .blue

    if let field = searchField {
        field.layer.cornerRadius = 15.0
        //sets text Color
        field.textColor = .brown

        //sets indicator and cancel button Color
        field.tintColor = .green

        field.font = UIFont.systemFont(ofSize: 13)
        field.layer.masksToBounds = true
        field.returnKeyType = .search

        //sets placeholder text Color
        let placeholderString = NSAttributedString(string: "placeholder", attributes: [NSAttributedStringKey.foregroundColor: UIColor.red])
        field.attributedPlaceholder = placeholderString

        //sets icon Color
        let iconView = field.leftView as! UIImageView
        iconView.image = iconView.image?.withRenderingMode(.alwaysTemplate)
        iconView.tintColor = .cyan

        //sets textField backgroundColor
        if let backgroundview = field.subviews.first {
            backgroundview.backgroundColor = UIColor.yellow
        }
    }
}
2
R. K.

承認されたソリューションはiOS 13では機能しません。次のエラーが発生します(Obj-Cコードのテステット)。

キャッチされない例外「NSGenericException」が原因でアプリを終了しています。理由:「UISearchBarの_searchField ivarへのアクセスは禁止されています。これはアプリケーションのバグです」

しかし、今では、プライベートAPIを使用せずに、UISearchBarのTextFieldに直接アクセスするオプションがあります。

if (@available(iOS 13, *)) {
        self.searchController.searchBar.searchTextField.backgroundColor = [UIColor whiteColor];
        self.searchController.searchBar.searchTextField.tintColor = [UIColor darkGrayColor];
    }
    else {
        UITextField *txfSearchField = [self.searchController.searchBar valueForKey:@"_searchField"];
        UIView *background = txfSearchField.subviews.firstObject;
        background.layer.cornerRadius = 10;
        background.clipsToBounds = true;
        background.backgroundColor=[UIColor whiteColor];

        txfSearchField.tintColor=[UIColor darkGrayColor];
        txfSearchField.textColor = [UIColor redColor];
    }
1