web-dev-qa-db-fra.com

Comment centrer le texte de substitution dans UISearchBar iOS 11

Avec iOS 11, les barres de recherche utilisent par défaut un texte aligné à gauche. Bien que cela ait l'air bien avec le reste des modifications natives d'iOS, cela ne correspond pas vraiment à ma conception, et j'aimerais qu'elle soit au centre, comme c'était le cas auparavant.

Je ne trouve pas de tels attributs d'alignement sur UISearchBar. Est-ce que je manque quelque chose, ou est-ce tout simplement impossible? Dois-je créer ma propre barre de recherche personnalisée, par exemple dérivée d'une UITextField, pour y parvenir?

ioscocoa-touchuisearchbarios11
12
Sti

J'ai eu exactement le même problème - j'ai du mal à comprendre pourquoi l'alignement par défaut serait modifié sans nous permettre de le recentrer facilement.

Le ci-dessous fonctionne pour moi (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

C'est un peu une solution de contournement.

Tout d’abord, vous devez obtenir le champ de texte de la barre de recherche et centrer l’alignement du texte:

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

Après cela, vous devez modifier l'alignement de l'espace réservé. Pour une raison quelconque, cela ne change pas avec l'alignement du champ de texte. Vous devriez le faire en ajoutant un remplissage à la vue gauche du champ de texte uniquement lorsque le contrôleur de recherche est actif, utilisez donc ses méthodes de délégation:

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
}

Bonne chance

4
RJiryes

Il n'y a pas de moyen officiel de faire ça. Essayez d’utiliser les méthodes UISearchBarDelegate et votre propre UILabel.

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

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

N'oubliez pas de masquer l'icône standard alignée à gauche (utilisez une image vierge):

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

let placeHolderOffSet = UIOffset (horizontal: 100, vertical: 0) setPositionAdjustment (placeHolderOffSet, pour: .search)

si vous voulez une position différente pendant que la barre est active, vous devrez la réinitialiser dans la méthode déléguée correspondante.

0
KVTaniguchi

Pour Swift 4.0+

Eh bien, comme votre question ne spécifie pas vraiment uniquement un espace réservé, je vais donner une réponse à la fois à un espace réservé et au texte. Dans mon projet, j'avais besoin que les deux textes soient centrés en tout temps, pas seulement lorsque je ne modifiais pas le champ de texte. Vous pouvez le renvoyer à gauche pour l'aligner avec certaines des réponses de ce message en utilisant le délégué comme ils l'ont indiqué.

De plus, je n'utilise pas SearchController, mais une prise SearchBar, de toute façon, il peut être facilement corrigé pour votre projet si vous utilisez un contrôleur. (remplacez simplement pour searchController.searchBar au lieu de simplement searchBar).

Il suffit donc d'appeler la fonction suivante où vous en avez besoin.

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