Comment mettre l'image à droite du texte dans un UIButton ?

Question

Je ne veux pas utiliser de sous-vue si je peux l'éviter. Je veux une UIButton avec une image de fond, du texte et une image. Actuellement, lorsque je fais cela, l'image se trouve à gauche du texte. L'image de fond, le texte et l'image ont tous des états de surbrillance différents.

Answer 1

Il suffit de mettre à jour les inserts lorsque le titre est modifié. Vous devez compenser l'encart par un encart égal et opposé de l'autre côté.

[thebutton setTitle:title forState:UIControlStateNormal];
thebutton.titleEdgeInsets = UIEdgeInsetsMake(0, -thebutton.imageView.frame.size.width, 0, thebutton.imageView.frame.size.width);
thebutton.imageEdgeInsets = UIEdgeInsetsMake(0, thebutton.titleLabel.frame.size.width, 0, -thebutton.titleLabel.frame.size.width);

Answer 2

Toutes ces réponses, en date de janvier 2016, sont inutiles. Dans Interface Builder, définissez la sémantique de la vue sur . Force Right-to-Left ou si vous préférez la méthode programmatique, semanticContentAttribute = .forceRightToLeft Ainsi, l'image apparaîtra à droite de votre texte.

Answer 3

Dans le constructeur d'interface, vous pouvez configurer les options Insets de bord pour UIButton, séparément chacune des trois parties : contenu, image, titre.

Xcode 8 :

Answer 4

Mise à jour : Swift 3

class ButtonIconRight: UIButton {
    override func imageRect(forContentRect contentRect:CGRect) -> CGRect {
        var imageFrame = super.imageRect(forContentRect: contentRect)
        imageFrame.origin.x = super.titleRect(forContentRect: contentRect).maxX - imageFrame.width
        return imageFrame
    }

    override func titleRect(forContentRect contentRect:CGRect) -> CGRect {
        var titleFrame = super.titleRect(forContentRect: contentRect)
        if (self.currentImage != nil) {
            titleFrame.origin.x = super.imageRect(forContentRect: contentRect).minX
        }
        return titleFrame
    }
}

Réponse originale pour Swift 2 :

Une solution qui gère tous les alignements horizontaux, avec un exemple de mise en œuvre en Swift. Il suffit de traduire en Objective-C si nécessaire.

class ButtonIconRight: UIButton {
    override func imageRectForContentRect(contentRect:CGRect) -> CGRect {
        var imageFrame = super.imageRectForContentRect(contentRect)
        imageFrame.origin.x = CGRectGetMaxX(super.titleRectForContentRect(contentRect)) - CGRectGetWidth(imageFrame)
        return imageFrame
    }

    override func titleRectForContentRect(contentRect:CGRect) -> CGRect {
        var titleFrame = super.titleRectForContentRect(contentRect)
        if (self.currentImage != nil) {
            titleFrame.origin.x = CGRectGetMinX(super.imageRectForContentRect(contentRect))
        }
        return titleFrame
    }
}

Il convient également de noter qu'il gère très bien les incrustations d'images et de titres.

Inspiré de la réponse de jasongregori ;)

Answer 5

J'ai décidé de ne pas utiliser l'affichage standard de l'image du bouton, car les solutions proposées pour le déplacer me semblaient peu pratiques. J'ai ainsi obtenu l'esthétique souhaitée, et il est intuitif de repositionner le bouton en modifiant les contraintes :

extension UIButton {
    func addRightIcon(image: UIImage) {
        let imageView = UIImageView(image: image)
        imageView.translatesAutoresizingMaskIntoConstraints = false

        addSubview(imageView)

        let length = CGFloat(15)
        titleEdgeInsets.right += length

        NSLayoutConstraint.activate([
            imageView.leadingAnchor.constraint(equalTo: self.titleLabel!.trailingAnchor, constant: 10),
            imageView.centerYAnchor.constraint(equalTo: self.titleLabel!.centerYAnchor, constant: 0),
            imageView.widthAnchor.constraint(equalToConstant: length),
            imageView.heightAnchor.constraint(equalToConstant: length)
        ])
    }
}