Wie bringe ich das Bild auf der rechten Seite des Textes in einer UIButton?

Question

Ich möchte keine Unteransicht verwenden, wenn ich es vermeiden kann. Ich möchte eine UIButton mit einem Hintergrundbild, Text und einem Bild darin. Wenn ich das tue, befindet sich das Bild auf der linken Seite des Textes. Das Hintergrundbild, der Text und das Bild haben alle einen unterschiedlichen Hervorhebungsstatus.

Answer 1

Aktualisieren Sie einfach die Einsätze, wenn der Titel geändert wird. Sie müssen den Einschub durch einen gleichen und entgegengesetzten Einschub auf der anderen Seite ausgleichen.

[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

Alle diese Antworten (Stand Januar 2016) sind unnötig. Setzen Sie im Interface Builder die Ansichtssemantik auf Force Right-to-Left oder wenn Sie die programmatische Methode bevorzugen, semanticContentAttribute = .forceRightToLeft Dadurch wird das Bild rechts vom Text angezeigt.

Answer 3

Im Interface Builder können Sie die Optionen Edge Insets für UIButton konfigurieren, und zwar separat für jeden der drei Teile: Inhalt, Bild, Titel

Xcode 8:

Answer 4

Ich habe mich gegen die Standardansicht des Schaltflächenbildes entschieden, weil mir die vorgeschlagenen Lösungen zum Verschieben des Bildes zu umständlich erschienen. Damit habe ich die gewünschte Ästhetik erreicht, und es ist intuitiv, die Schaltfläche durch Ändern der Beschränkungen neu zu positionieren:

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)
        ])
    }
}

Answer 5

Aktualisierung: 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
    }
}

Originalantwort für Swift 2:

Eine Lösung, die alle horizontalen Ausrichtungen handhabt, mit einem Beispiel für eine Swift-Implementierung. Bei Bedarf einfach in Objective-C übersetzen.

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
    }
}

Es ist auch erwähnenswert, dass das Programm sehr gut mit Bild- und Titeleinschüben umgehen kann.

Inspiriert von jasongregoris Antwort ;)