web-dev-qa-db-fra.com

Comment définir l'icône sur le bouton dans iOS avec Swift?

Je souhaite utiliser l'icône du bouton dans IOS à l'aide de Swift, tout comme les icônes des boutons de l'Android. Existe-t-il un moyen de ne pas définir l’image ou d’icône de fontAwesome pour définir une icône sur le bouton?

iosswiftuibutton
5
Lovish Dogra

 enter image description here 

    let icon = UIImage(named: "bmiCalculator")!
    button.setImage(icon, for: .normal)
    button.imageView?.contentMode = .scaleAspectFit
    button.imageEdgeInsets = UIEdgeInsets(top: 0, left: -20, bottom: 0, right: 0)

UIEdgeInsets

Les distances incrustées pour les vues. Les valeurs d'incrustation de bord sont appliquées à un rectangle pour réduire ou agrandir la zone représentée par ce rectangle. En règle générale, les incrustations de bord sont utilisées lors de la disposition de la vue pour modifier le cadre de la vue. Les valeurs positives entraînent l'insertion (ou la réduction) de la trame de la quantité spécifiée. Les valeurs négatives entraînent le début (ou l'agrandissement) de l'image de la valeur spécifiée.

7
Nazmul Hasan

Via le code dans Swift 3 et Swift 4: 

yourButton.setImage(UIImage(named: "imgName"), for: .normal)

ou pour l'image de fond:

yourButton.setBackgroundImage(UIImage(named: "imgName"), for: .normal)

Via le storyboard:

Vous pouvez également définir l'icône d'un bouton via le scénario, en définissant la variable image dans le attributes inspector d'un élément de bouton. Si vous voulez avoir un titre sur votre image, définissez votre image dans background de l'inspecteur d'attributs.

 enter image description here

17
ronatory

Utilisez ce code pour définir l’image (icône) sur votre bouton.

myButton.setImage(UIImage(named: "nameOfImage.png"), forState: UIControlState.Normal)
3
ios

Pour FontAwesome, vous pouvez utiliser un plugin sur github. 

https://github.com/thii/FontAwesome.Swift

Ensuite, vous pouvez définir des icônes assez facilement:

button.titleLabel?.font = UIFont.fontAwesomeOfSize(30)
button.setTitle(String.fontAwesomeIconWithName(.Github), forState: .Normal)

Et n’avez pas besoin de vous soucier de la résolution d’image pour différents appareils (x1, x2, x3) car les polices sont des vecteurs.

3
derdida

La solution suivante concerne le bouton centré, car l'icône sera toujours affichée juste à côté de l'étiquette du titre.

Je construis une extension facile pour elle (j'ai utilisé les IonIcons - Font, mais vous pouvez évidemment utiliser n'importe quel type de police, par exemple Font-Awesome ):

extension UIButton {
    func addIcon(icon: String, font:String = IonIcons.fontName.rawValue, fontSize: CGFloat = 16, text: String, color:UIColor) {
        let iconWithPlaceholder = icon + " "
        let iconRange = (iconWithPlaceholder as NSString).range(of: icon)

        let attributedString = NSMutableAttributedString(string: iconWithPlaceholder + text)
        attributedString.addAttributes([NSAttributedString.Key.font: UIFont(name: IonIcons.fontName.rawValue, size: fontSize) as Any], range: iconRange)

        self.setAttributedTitle(attributedString, for: .normal)
        self.tintColor = color
    }
}

Ainsi, vous pouvez facilement l'appeler depuis votre projet entier comme ceci:

self.myButton.addIcon(icon: IonIcons.navigateOutline.rawValue, text: "Start", color: .white)
1
Marco Weber

Si vous ne voulez pas utiliser un plugin tiers, vous pouvez simplement faire

if let font = UIFont(name: "FontAwesomeFontName", size: 18) {
    button.titleLabel?.font = font
    button.setTitle("\u{f053}", for: .normal)
}

Et utilisez le cheatsheet fontawesome comme référence pour l’icône spécifique que vous voulez.

0
Micah Montoya