Мне нужен UIButton с изображением и текстом. Изображение должно быть в верхней части, а текст попадает под изображение, оба должны быть доступны для клика.
UIButton Image + Text IOS
Ответ 1
Я вижу очень сложные ответы, все они используют код. Однако , если вы используете Interface Builder, есть очень простой способ сделать это:
- Выберите кнопку и установите заголовок и изображение. Обратите внимание: если вы установите фон вместо изображения, тогда изображение будет изменено, если оно меньше кнопки.
- Установите положение обоих элементов, изменив край и вставки. Вы даже можете управлять выравниванием обоих в разделе "Управление".
Вы даже можете использовать один и тот же подход с помощью кода, не создавая внутри UILabels и UIImages внутри других предлагаемых решений. Всегда держите его просто!
EDIT: Приложил небольшой пример, содержащий 3 вещи (название, изображение и фон) с правильными вставками
Ответ 2
Я думаю, что вы ищете это решение для своей проблемы:
UIButton *_button = [UIButton buttonWithType:UIButtonTypeCustom];
[_button setFrame:CGRectMake(0.f, 0.f, 128.f, 128.f)]; // SET the values for your wishes
[_button setCenter:CGPointMake(128.f, 128.f)]; // SET the values for your wishes
[_button setClipsToBounds:false];
[_button setBackgroundImage:[UIImage imageNamed:@"jquery-mobile-icon.png"] forState:UIControlStateNormal]; // SET the image name for your wishes
[_button setTitle:@"Button" forState:UIControlStateNormal];
[_button.titleLabel setFont:[UIFont systemFontOfSize:24.f]];
[_button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal]; // SET the colour for your wishes
[_button setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted]; // SET the colour for your wishes
[_button setTitleEdgeInsets:UIEdgeInsetsMake(0.f, 0.f, -110.f, 0.f)]; // SET the values for your wishes
[_button addTarget:self action:@selector(buttonTouchedUpInside:) forControlEvents:UIControlEventTouchUpInside]; // you can ADD the action to the button as well like
... остальная часть настройки кнопки - ваша обязанность теперь, и не забудьте добавить кнопку к вашему виду.
ОБНОВЛЕНИЕ # 1 и ОБНОВЛЕНИЕ # 2
или , если вам не нужна динамическая кнопка, вы можете добавить свою кнопку в свой вид в Interface Builder, и вы также можете установить те же значения. это очень то же самое, но вот эта версия и в одной простой картине.
вы можете также увидеть конечный результат в построителе интерфейса, как это показано на скриншоте.
Ответ 3
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.imageView.image = [UIImage imageNamed:@"your image name here"];
button.titleLabel.text = @"your text here";
но следующий код покажет ярлык выше и изображение в фоновом режиме
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.background.image = [UIImage imageNamed:@"your image name here"];
button.titleLabel.text = @"your text here";
Нет необходимости использовать ярлык и кнопку в том же элементе управления, потому что UIButton имеет свойства UILabel и UIimageview.
Ответ 4
Используйте этот код:
UIButton *button=[UIButton buttonWithType:UIButtonTypeRoundedRect];
button.imageView.frame=CGRectMake(0.0f, 0.0f, 50.0f, 44.0f);///You can replace it with your own dimensions.
UILabel *label=[[UILabel alloc] initWithFrame:CGRectMake(0.0f, 35.0f, 50.0f, 44.0f)];///You can replace it with your own dimensions.
[button addSubview:label];
Ответ 5
Сделайте UIImageView
и UILabel
, и установите изображение и текст в оба из этого.... затем поместите пользовательскую кнопку над изображением и меткой....
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"search.png"]];
imageView.frame = CGRectMake(x, y, imageView.frame.size.width, imageView.frame.size.height);
[self.view addSubview:imageView];
UILabel *yourLabel = [[UILabel alloc] initWithFrame:CGRectMake(x, y,a,b)];
yourLabel.text = @"raj";
[self.view addSubview:yourLabel];
UIButton * yourBtn=[UIButton buttonWithType:UIButtonTypeCustom];
[yourBtn setFrame:CGRectMake(x, y,c,d)];
[yourBtn addTarget:self action:@selector(@"Your Action") forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:yourBtn];
Ответ 6
Используйте этот код:
UIButton *sampleButton = [UIButton buttonWithType:UIButtonTypeCustom];
[sampleButton setFrame:CGRectMake(0, 10, 200, 52)];
[sampleButton setTitle:@"Button Title" forState:UIControlStateNormal];
[sampleButton setFont:[UIFont boldSystemFontOfSize:20]];
[sampleButton setBackgroundImage:[[UIImage imageNamed:@"redButton.png"]
stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0] forState:UIControlStateNormal];
[sampleButton addTarget:self action:@selector(buttonPressed)
forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:sampleButton]
Ответ 7
Я столкнулся с той же проблемой, и исправил ее, создав новый подкласс UIButton
и переопределив метод layoutSubviews:
, как показано ниже:
-(void)layoutSubviews {
[super layoutSubviews];
// Center image
CGPoint center = self.imageView.center;
center.x = self.frame.size.width/2;
center.y = self.imageView.frame.size.height/2;
self.imageView.center = center;
//Center text
CGRect newFrame = [self titleLabel].frame;
newFrame.origin.x = 0;
newFrame.origin.y = self.imageView.frame.size.height + 5;
newFrame.size.width = self.frame.size.width;
self.titleLabel.frame = newFrame;
self.titleLabel.textAlignment = UITextAlignmentCenter;
}
Я думаю, что ответ Angel García Olloqui - еще одно хорошее решение, если вы поместите все из них вручную с помощью конструктора интерфейса, но я сохраню свое решение, так как мне не нужно изменять вставки содержимого для каждой из моих кнопок.
Ответ 8
Вы должны создать собственное изображение для изображения и пользовательского ярлыка для текста, и вы добавите его в качестве подзонов. Что это.
UIButton *yourButton = [UIButton buttonWithType:UIButtonTypeCustom];
yourButton.backgroundColor = [UIColor greenColor];
yourButton.frame = CGRectMake(140, 40, 175, 30);
[yourButton addTarget:self action:@selector(yourButtonSelected:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:yourButton];
UIImageView *imageView1 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, yourButton.frame.size.width, yourButton.frame.size.height/2)];
imageView1.image =[UIImage imageNamed:@"images.jpg"];
[yourButton addSubview:imageView1];
UILabel *label=[[UILabel alloc] initWithFrame:CGRectMake(0, yourButton.frame.size.height/2, yourButton.frame.size.width, yourButton.frame.size.height/2)];
label.backgroundColor = [UIColor greenColor];
label.textAlignment= UITextAlignmentCenter;
label.text = @"ButtonTitle";
[yourButton addSubview:label];
Для целей тестирования используйте метод yourButtonSelected:
-(void)yourButtonSelected:(id)sender{
NSLog(@"Your Button Selected");
}
Я думаю, это будет полезно для вас.
Ответ 9
Это действительно просто, просто добавьте изображение в фоновое изображение вашей кнопки и дайте текст заголовочной кнопке кнопки для uicontrolstatenormal. Что это.
[btn setBackgroundImage:[UIImage imageNamed:@"img.png"] forState:UIControlStateNormal];
[btn setContentVerticalAlignment:UIControlContentVerticalAlignmentBottom];
[btn setTitle:@"Click Me" forState:UIControlStateNormal];
Ответ 10
Проверьте этот awesome lib ImageCenterButton Он решает все проблемы, с которыми сталкиваются другие библиотеки, и я подтверждаю, что он работает с iOS 9
Ответ 11
Xcode-8 и Xcode-9. Теперь Apple внесла несколько изменений в Edge Inset, вы можете изменить их под контролем размера.
Пожалуйста, выполните следующие шаги:
Шаг 1: Введите текст и выберите изображение, которое вы хотите показать:
Шаг 2: Выберите кнопку управления в соответствии с вашим требованием, как показано ниже:
Шаг 3: Теперь перейдите к размерному инспектору и добавьте значение согласно вашему требованию: