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

Question

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

Answer 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: Возьмите UIB-кнопку в файле пера> Сделайте ее пользовательской кнопкой> Подключите IBOutlet к вашей пользовательской кнопке в файле пера. Вот и все.

Answer 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];

Answer 3

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

. В конце у вас должно быть что-то вроде:

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

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

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

Answer 4

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

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

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

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

Answer 5

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

Answer 6

In 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)

Не забудьте установить привязки, если вы делаете это программно, чтобы они отображались / прикреплялись к вашей ссылке на кнопку в Интерфейсном Разработчике при использовании раскадровки

Answer 7

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

Answer 8

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

Мы должны установить значение 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];

Надеюсь, это поможетдля кого-то одного.

Answer 9

Использование кнопок подвидов работало для меня в 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))