ChatGPT解决这个技术问题 Extra ChatGPT

UIButton图片+文字IOS

我需要一个带有 图像的 UIButton文字。图片应该在顶部 &图片下方的文字都应该是可点击的。

希望这会有所帮助,请参阅 [UiButton with TEXT and IMAGE][1] stackoverflow.com/questions/4926581/… [1]: stackoverflow.com/questions/4926581/… 然后您可以在视图上添加一个 UITapGestureRecognizer 来处理自定义按钮的点击。
听起来更像是一个需求规范而不是一个问题。
请参阅接受的答案和关于 UIButton Edges 的 commandshift.co.uk/blog/2013/03/12/uibutton-edge-insets

A
Angel G. Olloqui

我看到非常复杂的答案,所有这些都使用代码。但是,如果您使用的是 Interface Builder,有一种非常简单的方法可以做到这一点:

选择按钮并设置标题和图像。请注意,如果您设置背景而不是图像,则如果图像小于按钮,则图像将被调整大小。通过更改边缘和插图来设置这两个项目的位置。您甚至可以在“控制”部分控制两者的对齐方式。

https://i.stack.imgur.com/hm7IA.png

您甚至可以通过代码使用相同的方法,而无需像其他建议的解决方案那样在内部创建 UILabels 和 UIImages。始终保持简单!

https://i.stack.imgur.com/NIEk8.png


这是对的。您需要使用标题和图像上的边缘插图来正确对齐两者。您可以通过设置 titleEdgeInsets 和 contentEdgeInsets 属性在代码中执行此操作。
是的,这几乎是正确的。只是您必须设置 Background 图像而不是 Image,否则您将看不到标题,甚至没有设置插入值来重新定位标题。
我也遇到了麻烦。如果您的标题未显示,请尝试为其设置负左偏移。看起来 IB 会自动将其推到图像的右侧。
这只会并排显示图像和文本,对吗?有没有办法从上到下改变方向?这就是原始问题所陈述的内容,也是我正在寻找的内容。谢谢!
对于使用 Xcode 8 的用户,您可能看不到 Edge 属性。添加图像后,文本也可能会消失。它将文本更改为白色,如果您在白色背景上,它看起来就像消失了。更改文本颜色,它会出现在图像附近。您可以在尺寸检查器下调整插图。
h
holex

我认为您正在为您的问题寻找此解决方案:

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 中的视图中,您也可以在那里设置相同的值。它几乎相同,但在一张简单的图片中也是这个版本。

您还可以在界面生成器中看到屏幕截图中的最终结果。

https://i.stack.imgur.com/Oez70.png


EdgeInsets 仅在您具有“设置按钮图像”并且当您设置按钮图像时您看不到标题时才有效。如果您设置背景图像,则 EdgeInsets 不能应用于图像。你可以看到标题。因此,您不能同时将 edgeinsect 设置为两者。
@BadalShah,是的,有一些场景(取决于按钮的大小、图像大小、标题的长度等......)当你说的是真的并且你不能同时看到标题和图像时,因为图像推出可见区域的标题;但是这种情况根本不是通用的,通用的情况是标题和图像可以并且将同时出现。
A
Alok

Xcode-9 和 Xcode-10 Apple 现在对 Edge Inset 做了一些更改,您可以在 size-inspector 下进行更改。

请按照以下步骤操作:

Step-1:输入文本并选择要显示的图像:

https://i.stack.imgur.com/ONPMf.png

步骤2:根据您的要求选择按钮控件,如下图所示:

https://i.stack.imgur.com/RFoXU.png

第 3 步:现在转到尺寸检查员并根据您的要求增加价值:

https://i.stack.imgur.com/84H0j.png


a
aturan23

快速版本:

var button = UIButton()

newGameButton.setTitle("Новая игра", for: .normal)
newGameButton.setImage(UIImage(named: "energi"), for: .normal)
newGameButton.backgroundColor = .blue
newGameButton.imageEdgeInsets.left = -50

https://i.stack.imgur.com/EOrIY.png


H
Harshil Patel

就我而言,我想在右侧添加 UIImage,在左侧添加 UILabel。也许我可以通过编写代码来实现这一点(就像上面提到的那样),但我不喜欢编写代码并尽可能使用 storyboard 来完成它。所以这是怎么做到的:

首先,在标签框中写下一些内容,然后选择要显示的图像:

https://i.stack.imgur.com/Mkop1.png

这将创建一个如下所示的按钮:

https://i.stack.imgur.com/0SdyX.png

接下来, 查找 Semantic 并选择 Force Right-to-Left(如果您不指定任何内容,那么它将在左侧显示图像并标记为右边如上图):

https://i.stack.imgur.com/OBhsy.png

最后,您会看到右侧的 UIImage 和左侧的 UILabel

https://i.stack.imgur.com/PBkHe.png

要在标签和图像之间添加空格,请转到尺寸检查器并根据您的要求更改这些值:

https://i.stack.imgur.com/fyaWF.png

而已!


成就了我的一天!!谢谢!
V
Vinodh
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 属性。


我需要将图像放在顶部,并且图像下方的文本都应该是可点击的..
H
Hemant Dixit

使用此代码:

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]

P
Prasad G

您应该为图像创建自定义图像视图,为文本创建自定义标签,然后将其作为子视图添加到按钮中。而已。

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");

}

我想这会对你有所帮助。


T
Tripti Kumar

使用此代码:

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

O
Oyashiro

我遇到了同样的问题,我通过创建 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 的答案是另一个很好的解决方案,如果您使用界面构建器手动放置所有这些,但我会保留我的解决方案,因为我不必修改每个按钮的内容插图。


R
Rajneesh071

制作 UIImageViewUILabel,并将图像和文本设置为这两者......然后在 imageView 和 Label 上放置一个自定义按钮......

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

简单实用。如何设置突出显示的图像和标题?
对于标签 setHighlightedTextColor ,你必须玩 forControlEvents
D
Dhruv

这真的很简单,只需将图像添加到按钮的背景,并为 uicontrolstatenormal 的按钮的标题标签提供文本。而已。

[btn setBackgroundImage:[UIImage imageNamed:@"img.png"] forState:UIControlStateNormal];
[btn setContentVerticalAlignment:UIControlContentVerticalAlignmentBottom];
[btn setTitle:@"Click Me" forState:UIControlStateNormal];

...以及文本如何在图像下方?
@holex:非常感谢你指导我,我发现了它的缺陷,然后相应地改变了。