UIButton с изображением и текстом возможно?

У меня есть кнопка размером 200 и высотой 270. Я хочу, чтобы текст и изображение были на одной кнопке. Не в качестве фонового изображения для этого текста. Вместо этого я хочу отобразить текст с высотой 120 и изображением высотой 150 на одной кнопке. Как это сделать?

Ответ 1

Вы можете использовать этот код, он будет служить вашей цели

.h file code
IBOutlet UIButton *testBtn;

.m file code
[testBtn setImage: [UIImage imageNamed:@"Image name.png"] forState:UIControlStateNormal];
[testBtn setTitleEdgeInsets:UIEdgeInsetsMake(70.0, -150.0, 5.0, 5.0)];
[testBtn setTitle:@"Your text" forState:UIControlStateNormal];

Отрегулируйте координаты и размер вашей кнопки в качестве вашего требования. Это пример кода, который поможет вам.

PS: Возьмите UIButton в файле nib > Сделайте его пользовательской кнопкой > Подключите IBOutlet к вашей пользовательской кнопке в файле nib.Thats it.

Ответ 2

В приведенном ниже коде показано размещение изображения и текста кнопкой с использованием свойств setImageEdgeInsets и setTitleEdgeInsets класса UIButton.

UIButton *butt=[UIButton buttonWithType:UIButtonTypeCustom ];
    [butt setFrame:CGRectMake(0, 0, 100, 100)];
    [butt setBackgroundImage:[UIImage imageNamed:@"sig.png"] forState:UIControlStateNormal];
    [butt setImageEdgeInsets:UIEdgeInsetsMake(0.0, 0.0, 50.0, 0.0)];
    [butt setTitleEdgeInsets:UIEdgeInsetsMake(75.0, 0.0, 0.0, 0.0)];
    [butt setTitle:@"hello" forState:UIControlStateNormal];
    [butt setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [self.view addSubview:butt];

Ответ 3

Использовать концепцию subviews. Возьмите 3 элемента управления, UIButton (200x270), UILabel (200x120) и UIImageView (200x150). Назначьте изображение UIImageView и установите текст для UILabel. Расположите элементы управления метками и изображениями на основе местоположения (x, y) UIButton.

В конце вы должны иметь что-то вроде:

В следующих случаях:

UIButton *button;
UILabel *label;
UIImageView *imageView;

[button addSubView:imageView];
[button addSubView:label];

Ответ 4

[testBtn setBackgroudImage: [UIImage imageNamed:@"Image name.png"] forState:UIControlStateNormal];
[testBtn setTitle:@"Your text" forState:UIControlStateNormal];

Ответ 5

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

Вы можете играть с contentVerticalAlignment и contentHorizontalAlignment свойствами UIButton (унаследованными от UIControl).

Вы также можете использовать свойства titleEdgeInsets и imageEdgeInsets, чтобы сместить заголовок и изображение с места размещения, которое они получают, на основе свойств выравнивания.

Если вы хотите очень точное или выборочное размещение, я предлагаю переопределить методы titleRectForContentRect: и imageRectForContentRect: UIButton. Это позволяет вам определять кадры для вашего названия и изображения, и они вызывается всякий раз, когда нужно выложить кнопку. Одно предупреждение, если вы хотите ссылаться на self.titleLabel внутри titleRectForContentRect:, сначала убедитесь, что self.currentTitle определен. Я получаю ошибку с плохим доступом, возможно, метод вызывается при первой инициализации titleLabel.

Ответ 6

В Swift 3

let button = UIButton()

//make sure the image (jpg, png) you are placing in the button
//is about the right size or it will push the label off the button

//add image
let image = UIImage(named:"my_button_image")
button.setImage(image, for: .normal)
button.imageView?.contentMode = .scaleAspectFit
button.imageEdgeInsets = UIEdgeInsets(top:0, left:-30, bottom:0, right:0) //adjust these to have fit right

//add title
button.setTitle("Fan", for: .normal)
button.titleEdgeInsets = UIEdgeInsets(top:0, left:10, bottom:0, right:0) //adjust insets to have fit how you want

//add button to your view - like in viewDidLoad or your own custom view setup
addSubview(button)

Не забудьте установить привязки, если это так программно, чтобы он появился/привязал его к ссылке на ссылку в Interface Builder, если вы используете раскадровку

Ответ 7

Если вы хотите получить больше контроля над макетом, создайте подкласс UIControl и упорядочите нужные представления (UILabel, UIImageView) в файле xib. Затем вы можете использовать Autolayout регулярно, не сортируя UIEdgeInsets.

Ответ 8

Использование кнопок подпредставлений работало для меня в Swift 4.

  • Создай свою кнопку
  • Установить изображение для кнопки
  • Создать ярлык для текста
  • Добавьте ярлык как подпредставление вашей кнопки
  • Ограничить метку внутри кнопки

           let imageAndTextButton : UIButton = {
                let button = UIButton(frame: .zero)
                button.tintColor = .clear
                button.setImage(#imageLiteral(resourceName: "buttonImage"), for: .normal)
                button.imageView?.contentMode = .scaleToFill
                button.translatesAutoresizingMaskIntoConstraints = false
                return button
            }()
            let textForButtonLabel = UILabel(frame: .zero)
            textForButtonLabel.translatesAutoresizingMaskIntoConstraints = false
            textForButtonLabel.attributedText = NSAttributedString(string: "Text For Button", attributes: buttonTextAttributes)
            textForButtonLabel.textAlignment = .center
            textForButtonLabel.backgroundColor = .clear
            imageAndTextButton.addSubview(textForButtonLabel)
            imageAndTextButton.addConstraint(NSLayoutConstraint(item: textForButtonLabel, attribute: .centerX, relatedBy: .equal, toItem: imageAndTextButton, attribute: .centerX, multiplier: 1.0, constant: 0))
            imageAndTextButton.addConstraint(NSLayoutConstraint(item: textForButtonLabel, attribute: .centerY, relatedBy: .equal, toItem: imageAndTextButton, attribute: .centerY, multiplier: 1.0, constant: 0))
    

Ответ 9

Попробуйте, это работает для меня,

Мы должны установить значение базы UIEdgeInsets в зависимости от размера кнопки и наших требований.

[self.testButton setTitle: @"myTitle" forState: UIControlStateNormal];
UIImage *iconImage = [UIImage imageWithIcon:@"fa-dot-circle-o" backgroundColor:[UIColor clearColor] iconColor:[UIColor whiteColor] fontSize:10.0f];

//UIEdgeInsets insets = {top, left, bottom, right};

[self.testButton setImageEdgeInsets:UIEdgeInsetsMake(3.0, 0.0, 3.0, 2.0)];
[self.testButton setTitleEdgeInsets:UIEdgeInsetsMake(3.0, 1.0, 3.0, 0.0)];
[self.testButton setImage:iconImage forState:UIControlStateNormal];
[self.testButton addTarget:self action:@selector(testButtonTapped:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:self.testButton];

Надеюсь, это поможет кому-то.