it-swarm.com.ru

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

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

64
Viral Narshana

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

.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 к вашей пользовательской кнопке в файле пера. Вот и все.

114
Aditya

Приведенный ниже код показывает размещение изображения и текста в кнопке с использованием свойств 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];
14
Abhilash Reddy kallepu

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

В итоге у вас должно получиться что-то вроде:

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

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

[button addSubView:imageView];
[button addSubView:label];
6
Vaishnavi Naidu
[testBtn setBackgroudImage: [UIImage imageNamed:@"Image name.png"] forState:UIControlStateNormal];
[testBtn setTitle:@"Your text" forState:UIControlStateNormal];
5
Amit Battan

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

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

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

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

4
ohnit

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

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

3
ColossalChris

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

1
orkoden

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

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

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

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

0
Jaywant Khedkar