webentwicklung-frage-antwort-db.com.de

So zentrieren Sie den Platzhaltertext in UISearchBar iOS 11

Bei iOS 11 wird für searchBars standardmäßig ein links ausgerichteter Text verwendet. Während dies mit den restlichen nativen Änderungen an iOS gut aussieht, passt es nicht wirklich zu meinem Design, und ich möchte, dass es in der Mitte steht, wie es vorher war.

Ich kann solche Ausrichtungsattribute in UISearchBar nicht finden. Fehlt mir etwas oder ist es einfach nicht möglich? Muss ich eine eigene Suchleiste erstellen, die beispielsweise von einer UITextField abgeleitet ist, um dies zu erreichen?

12
Sti

Ich hatte genau das gleiche Problem - ich kann nur schwer verstehen, warum die Standardausrichtung geändert wird, ohne dass wir dies einfach auf die Mitte zurücksetzen können.

Das Folgende funktioniert für mich (Swift):

let placeholderWidth = 200 // Replace with whatever value works for your placeholder text
var offset = UIOffset()

override func viewDidLoad() {
    offset = UIOffset(horizontal: (searchBar.frame.width - placeholderWidth) / 2, vertical: 0)
    searchBar.setPositionAdjustment(offset, for: .search)
}

func searchBarShouldBeginEditing(_ searchBar: UISearchBar) -> Bool {
    let noOffset = UIOffset(horizontal: 0, vertical: 0)
    searchBar.setPositionAdjustment(noOffset, for: .search)

    return true
}


func searchBarShouldEndEditing(_ searchBar: UISearchBar) -> Bool {
    searchBar.setPositionAdjustment(offset, for: .search)

    return true
}
7
user6219797

Dies ist ein bisschen ein Workaround.

Zunächst müssen Sie das Textfeld der Suchleiste abrufen und die Textausrichtung zentrieren:

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

Danach müssen Sie die Ausrichtung des Platzhalters ändern. Aus irgendeinem Grund ändert sich dies nicht mit der Ausrichtung des Textfelds. Sie sollten dies tun, indem Sie der linken Ansicht des Textfelds nur dann eine Auffüllung hinzufügen, wenn der Such-Controller aktiv ist.

func presentSearchController(_ searchController: UISearchController) {
    //Is active
    let width: CGFloat = 100.0 //Calcualte a suitable width based on search bar width, screen size, etc..

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

    let paddingView = UIView(x: 0, y: 0, w: width, h: searchController.searchBar.frame.size.height)
    textfieldOfSearchBar?.leftView = paddingView
    textfieldOfSearchBar?.leftViewMode = .unlessEditing
}

func willDismissSearchController(_ searchController: UISearchController) {
    let textfieldOfSearchBar = searchController.searchBar.value(forKey: "searchField") as? UITextField
    textfieldOfSearchBar?.leftView = nil
}

Viel Glück

4
RJiryes

Es gibt keinen offiziellen Weg, das zu tun. Versuchen Sie es mit UISearchBarDelegate-Methoden und Ihrer eigenen UILabel.

extension YourViewController: UISearchBarDelegate {
    func searchBarTextDidBeginEditing(_ searchBar: UISearchBar) {
        placeholderLabel.isHidden = true
    }

    func searchBarTextDidEndEditing(_ searchBar: UISearchBar) {
        placeholderLabel.isHidden = false
    }
}

Vergessen Sie nicht, das linksbündige Standardsymbol auszublenden (leeres Bild verwenden):

    searchBar.setImage(UIImage.imageWithColor(.clear), for: .search, state: .normal)
1
SoftDesigner

let placeHolderOffSet = UIOffset (horizontal: 100, vertikal: 0) setPositionAdjustment (placeHolderOffSet, für: .search)

wenn Sie eine andere Position wünschen, während der Balken aktiv ist, müssen Sie diese in der entsprechenden Delegat-Methode zurücksetzen

0
KVTaniguchi

Für Swift 4.0+

Nun, da Ihre Frage nicht wirklich nur Platzhalter enthält, gebe ich eine Antwort auf den Platzhalter und den Text. In meinem Projekt musste ich immer beide Texte zentrieren, nicht nur, wenn ich das Textfeld nicht bearbeitet habe. Sie können es mit einigen Antworten in diesem Beitrag wieder links ausrichten, indem Sie den Delegierten wie angegeben verwenden.

Ich benutze auch keinen SearchController, sondern einen SearchBar-Outlet. So kann er problemlos für Ihr Projekt repariert werden, wenn Sie einen Controller verwenden. (Ersetzen Sie einfach searchController.searchBar anstelle von SearchBar).

Sie müssen also nur die nächste Funktion aufrufen, wo Sie sie benötigen.

func searchBarCenterInit(){
    if let searchBarTextField = searchBar.value(forKey: "searchField") as? UITextField {

        //Center search text
        searchBarTextField.textAlignment = .center

        //Center placeholder
        let width = searchBar.frame.width / 2 - (searchBarTextField.attributedPlaceholder?.size().width)!
        let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: width, height: searchBar.frame.height))
        searchBarTextField.leftView = paddingView
        searchBarTextField.leftViewMode = .unlessEditing
    }
}
0
rheligon

Dies ist die einzige, die für mich funktioniert hat, Swift 4.2 :

extension UISearchBar {
func setCenteredPlaceHolder(){
    let textFieldInsideSearchBar = self.value(forKey: "searchField") as? UITextField

    //get the sizes
    let searchBarWidth = self.frame.width
    let placeholderIconWidth = textFieldInsideSearchBar?.leftView?.frame.width
    let placeHolderWidth = textFieldInsideSearchBar?.attributedPlaceholder?.size().width
    let offsetIconToPlaceholder: CGFloat = 8
    let placeHolderWithIcon = placeholderIconWidth! + offsetIconToPlaceholder

    let offset = UIOffset(horizontal: ((searchBarWidth / 2) - (placeHolderWidth! / 2) - placeHolderWithIcon), vertical: 0)
    self.setPositionAdjustment(offset, for: .search)
}
}


Verwendungszweck:

searchBar.setCenteredPlaceHolder()

Ergebnis:
enter image description here

0
Danny182