iPhone UIButton - posizione dell'immagine

Ho un UIButtontesto con il testo "Esplora l'app" e UIImage(>) Interface Builderche appare come:

[ (>) Explore the app ]

Ma devo UIImageinserirlo DOPO il testo:

[ Explore the app (>) ]

Come posso spostare il UIImagea destra?

La mia soluzione a questo è abbastanza semplice

[button sizeToFit];
button.titleEdgeInsets = UIEdgeInsetsMake(0, -button.imageView.frame.size.width, 0, button.imageView.frame.size.width);
button.imageEdgeInsets = UIEdgeInsetsMake(0, button.titleLabel.frame.size.width, 0, -button.titleLabel.frame.size.width);

Su iOS 9 in poi, sembra che un modo semplice per ottenere ciò sia forzare la semantica della vista.

O in modo programmatico, utilizzando:

button.semanticContentAttribute = .ForceRightToLeft

Imposta imageEdgeInsete titleEdgeInsetper spostare i componenti all'interno dell'immagine. Potresti anche creare un pulsante usando quella grafica a grandezza naturale e usarla come immagine di sfondo per il pulsante (quindi usarla titleEdgeInsetsper spostare il titolo).

La risposta di Raymond W è la migliore qui. Sottoclasse UIButton con layout personalizzatoSubviews. Estremamente semplice da fare, ecco un'implementazione di layoutSubviews che ha funzionato per me:

- (void)layoutSubviews
{
    // Allow default layout, then adjust image and label positions
    [super layoutSubviews];

    UIImageView *imageView = [self imageView];
    UILabel *label = [self titleLabel];

    CGRect imageFrame = imageView.frame;
    CGRect labelFrame = label.frame;

    labelFrame.origin.x = imageFrame.origin.x;
    imageFrame.origin.x = labelFrame.origin.x + CGRectGetWidth(labelFrame);

    imageView.frame = imageFrame;
    label.frame = labelFrame;
}

Che dire della sottoclasse UIButtone dell'override layoutSubviews?

Quindi post-elaborazione delle posizioni di self.imageView&self.titleLabel

Un altro modo semplice (che NON è solo iOS 9) è quello di sottoclassare UIButton per sovrascrivere questi due metodi

override func titleRectForContentRect(contentRect: CGRect) -> CGRect {
    var rect = super.titleRectForContentRect(contentRect)
    rect.origin.x = 0
    return rect
}

override func imageRectForContentRect(contentRect: CGRect) -> CGRect {
    var rect = super.imageRectForContentRect(contentRect)
    rect.origin.x = CGRectGetMaxX(contentRect) - CGRectGetWidth(rect)
    return rect
}

contentEdgeInsets è già preso in considerazione utilizzando super.

Forzare "da destra a sinistra" per il pulsante non è un'opzione se la tua app supporta sia "da sinistra a destra" che "da destra a sinistra".

La soluzione che ha funzionato per me è una sottoclasse che può essere aggiunta al pulsante nello Storyboard e funziona bene con i vincoli (testata in iOS 11):

class ButtonWithImageAtEnd: UIButton {

    override func layoutSubviews() {
        super.layoutSubviews()

        if let imageView = imageView, let titleLabel = titleLabel {
            let padding: CGFloat = 15
            imageEdgeInsets = UIEdgeInsets(top: 5, left: titleLabel.frame.size.width+padding, bottom: 5, right: -titleLabel.frame.size.width-padding)
            titleEdgeInsets = UIEdgeInsets(top: 0, left: -imageView.frame.width, bottom: 0, right: imageView.frame.width)
        }

    }

}

Dove "padding" sarebbe lo spazio tra il titolo e l'immagine.

In Swift:

override func layoutSubviews(){
    super.layoutSubviews()

    let inset: CGFloat = 5

    if var imageFrame = self.imageView?.frame,
       var labelFrame = self.titleLabel?.frame {

       let cumulativeWidth = imageFrame.width + labelFrame.width + inset
       let excessiveWidth = self.bounds.width - cumulativeWidth
       labelFrame.origin.x = excessiveWidth / 2
       imageFrame.origin.x = labelFrame.origin.x + labelFrame.width + inset

       self.imageView?.frame = imageFrame
       self.titleLabel?.frame = labelFrame  
    }
}

Costruendo la risposta di @split ...

La risposta è fantastica, ma ignora il fatto che il pulsante può avere immagini personalizzate e inserti sul bordo del titolo impostati in anticipo (ad esempio nello storyboard).

Ad esempio, potresti volere che l'immagine abbia un po 'di riempimento dalla parte superiore e inferiore del contenitore, ma sposta comunque l'immagine sul lato destro del pulsante.

Ho esteso il concetto con questo metodo: -

- (void) moveImageToRightSide {
    [self sizeToFit];

    CGFloat titleWidth = self.titleLabel.frame.size.width;
    CGFloat imageWidth = self.imageView.frame.size.width;
    CGFloat gapWidth = self.frame.size.width - titleWidth - imageWidth;
    self.titleEdgeInsets = UIEdgeInsetsMake(self.titleEdgeInsets.top,
                                            -imageWidth + self.titleEdgeInsets.left,
                                            self.titleEdgeInsets.bottom,
                                            imageWidth - self.titleEdgeInsets.right);

    self.imageEdgeInsets = UIEdgeInsetsMake(self.imageEdgeInsets.top,
                                            titleWidth + self.imageEdgeInsets.left + gapWidth,
                                            self.imageEdgeInsets.bottom,
                                            -titleWidth + self.imageEdgeInsets.right - gapWidth);
}

// Get the size of the text and image
CGSize buttonLabelSize = [[self.button titleForState:UIControlStateNormal] sizeWithFont:self.button.titleLabel.font];
CGSize buttonImageSize = [[self.button imageForState:UIControlStateNormal] size];

// You can do this line in the xib too:
self.button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;

// Adjust Edge Insets according to the above measurement. The +2 adds a little space 
self.button.imageEdgeInsets = UIEdgeInsetsMake(0, 0, 0, -(buttonLabelSize.width+2));
self.button.titleEdgeInsets = UIEdgeInsetsMake(0, 0, 0, buttonImageSize.width+2);

Questo crea un pulsante allineato a destra, in questo modo:

[           button label (>)]

Il pulsante non regola la sua larghezza in base al contesto, quindi lo spazio apparirà a sinistra dell'etichetta. È possibile risolvere questo problema calcolando la larghezza della cornice del pulsante da buttonLabelSize.width e buttonImageSize.width.

button.semanticContentAttribute = UISemanticContentAttributeForceRightToLeft;
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;

Questa soluzione funziona con iOS 7 e versioni successive

Basta sottoclasse UIButton

@interface UIButton (Image)

- (void)swapTextWithImage;

@end

@implementation UIButton (Image)

- (void)swapTextWithImage {
   const CGFloat kDefaultPadding = 6.0f;
   CGSize buttonSize = [self.titleLabel.text sizeWithAttributes:@{
                                                               NSFontAttributeName:self.titleLabel.font
                                                               }];

   self.titleEdgeInsets = UIEdgeInsetsMake(0, -self.imageView.frame.size.width, 0, self.imageView.frame.size.width);
   self.imageEdgeInsets = UIEdgeInsetsMake(0, buttonSize.width + kDefaultPadding, 0, -buttonSize.width); 
}

@end

Utilizzo (da qualche parte nella tua classe):

[self.myButton setTitle:@"Any text" forState:UIControlStateNormal];
[self.myButton swapTextWithImage];

Basandosi sulle risposte precedenti. Se vuoi avere un margine tra l'icona e il titolo del pulsante, il codice deve cambiare leggermente per evitare che l'etichetta e l'icona fluttuino sopra i limiti dei pulsanti di dimensioni intrinseche.

let margin = CGFloat(4.0)
button.titleEdgeInsets = UIEdgeInsetsMake(0, -button.imageView.frame.size.width, 0, button.imageView.frame.size.width);
button.imageEdgeInsets = UIEdgeInsetsMake(0, button.titleLabel.frame.size.width, 0, -button.titleLabel.frame.size.width)
button.contentEdgeInsets = UIEdgeInsetsMake(0, margin, 0, margin)

L'ultima riga di codice è importante per il calcolo della dimensione intrinseca del contenuto per il layout automatico.

Ecco il mio modo di fare la cosa, (dopo circa 10 anni)

1. Sottoclasse di UIButton (Button, poiché viviamo nell'era Swift)
2. Metti un'immagine e un'etichetta in una vista pila.

class CustomButton: Button {

    var didLayout: Bool = false // The code must be called only once

    override func layoutSubviews() {
        super.layoutSubviews()
        if !didLayout, let imageView = imageView, let titleLabel = titleLabel {
            didLayout = true
            let stack = UIStackView(arrangedSubviews: [titleLabel, imageView])
            addSubview(stack)
            stack.edgesToSuperview() // I use TinyConstraints library. You could handle the constraints directly
            stack.axis = .horizontal
        }
    }
}

Soluzione a linea singola in Swift:

// iOS 9 and Onwards
button.semanticContentAttribute = .forceRightToLeft