Как поместить изображение с правой стороны текста в UIButton?

Question

Я не хочу использовать подпредставление, если смогу его избежать. Я хочу UIButton с фоновым изображением, текстом и изображением в нем. Прямо сейчас, когда я это делаю, изображение находится на левой стороне текста. Фоновое изображение, текст и изображение имеют разные состояния выделения.

Answer 1

Самое простое решение:

iOS 10 и выше, Swift:

button.transform = CGAffineTransform(scaleX: -1.0, y: 1.0)
button.titleLabel?.transform = CGAffineTransform(scaleX: -1.0, y: 1.0)
button.imageView?.transform = CGAffineTransform(scaleX: -1.0, y: 1.0)

До iOS 10, Swift / Obj-C:

button.transform = CGAffineTransformMakeScale(-1.0, 1.0);
button.titleLabel.transform = CGAffineTransformMakeScale(-1.0, 1.0);
button.imageView.transform = CGAffineTransformMakeScale(-1.0, 1.0);

Answer 2

Несмотря на то, что некоторые из предложенных ответов очень креативны и чрезвычайно умны, самое простое решение выглядит следующим образом:

button.semanticContentAttribute = UIApplication.shared
    .userInterfaceLayoutDirection == .rightToLeft ? .forceLeftToRight : .forceRightToLeft

Так просто. В качестве бонуса изображение будет слева направо в языках справа налево.

РЕДАКТИРОВАТЬ : поскольку вопрос задавался несколько раз, это iOS 9 + .

Answer 3

ОБНОВЛЕНО ДЛЯ XCODE 9 (через Интерфейсный Разработчик)

Есть более простой способ от Interface Builder . Выберите UIButton и выберите эту опцию в View Utilities :

Вот и все! Красиво и просто!

ДОПОЛНИТЕЛЬНО - 2-й шаг:

Если вы хотите настроить интервал между изображением и заголовком, вы можете изменить Вставка изображения здесь:

Надеюсь, это поможет!

Answer 4

Подкласс UIButton совершенно не нужен.Вместо этого вы можете просто установить высокое левое значение для вставки изображения и маленькое правое значение для заголовка.Как то так:

button.imageEdgeInsets = UIEdgeInsetsMake(0., button.frame.size.width - (image.size.width + 15.), 0., 0.);
button.titleEdgeInsets = UIEdgeInsetsMake(0., 0., 0., image.size.width);

Answer 5

Я даю Inspire48 кредит на это.Основываясь на его предложении и глядя на этот другой вопрос, я придумал это.Подкласс UIButton и переопределите эти методы.

@implementation UIButtonSubclass

- (CGRect)imageRectForContentRect:(CGRect)contentRect
{
    CGRect frame = [super imageRectForContentRect:contentRect];
    frame.origin.x = CGRectGetMaxX(contentRect) - CGRectGetWidth(frame) -  self.imageEdgeInsets.right + self.imageEdgeInsets.left;
    return frame;
}

- (CGRect)titleRectForContentRect:(CGRect)contentRect
{
    CGRect frame = [super titleRectForContentRect:contentRect];
    frame.origin.x = CGRectGetMinX(frame) - CGRectGetWidth([self imageRectForContentRect:contentRect]);
    return frame;
}

@end

Answer 6

Просто обновите вставки при изменении названия.Вы должны компенсировать вставку равной и противоположной вставкой на другой стороне.

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

Все эти ответы по состоянию на январь 2016 г. не нужны.В Интерфейсном Разработчике установите Просмотр семантики на Force Right-to-Left, или, если вы предпочитаете программный способ, semanticContentAttribute = .forceRightToLeft Это приведет к тому, что изображение появится справа от вашего текста.

Answer 8

В конструкторе интерфейсов вы можете настроить параметры Edge Insets для UIButton, отдельно каждую из трех частей: контент, изображение, заголовок

Xcode 8:

Answer 9

Обновление: 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
    }
}

Оригинальный ответ для Swift 2:

Решение, которое обрабатывает все горизонтальные выравнивания, с примером реализации Swift. Просто переведите на Objective-C, если это необходимо.

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

Также стоит отметить, что он довольно хорошо обрабатывает вставки изображений и заголовков.

Вдохновленный ответом jasongregori;)

Answer 10

Если это необходимо сделать в UIBarButtonItem , следует использовать дополнительное обтекание
Это будет работать

let view = UIView()
let button = UIButton()
button.setTitle("Skip", for: .normal)
button.setImage(#imageLiteral(resourceName:"forward_button"), for: .normal)
button.semanticContentAttribute = .forceRightToLeft
button.sizeToFit()
view.addSubview(button)
view.frame = button.bounds
navigationItem.rightBarButtonItem = UIBarButtonItem(customView: view)

Этоне будет работать

let button = UIButton()
button.setTitle("Skip", for: .normal)
button.setImage(#imageLiteral(resourceName:"forward_button"), for: .normal)
button.semanticContentAttribute = .forceRightToLeft
button.sizeToFit()
navigationItem.rightBarButtonItem = UIBarButtonItem(customView: button)