Ich sehe sehr komplizierte Antworten, alle mit Code. Allerdings , wenn Sie Interface Builder verwenden , gibt es eine sehr einfache Möglichkeit , dies zu tun:
Wählen Sie die Schaltfläche und legen Sie einen Titel und ein Bild fest. Beachten Sie, dass die Größe des Bilds geändert wird, wenn Sie den Hintergrund anstelle des Bilds festlegen, wenn es kleiner als die Schaltfläche ist.
Stellen Sie die Position beider Elemente ein, indem Sie die Kante und die Einsätze ändern. Sie können sogar die Ausrichtung beider Elemente im Abschnitt Steuerung steuern.
Sie können sogar denselben Code-Ansatz verwenden, ohne darin UILabels und UIImages zu erstellen, wie dies bei anderen vorgeschlagenen Lösungen der Fall ist. Halte es immer einfach!
BEARBEITEN: Anbei ein kleines Beispiel mit den 3 eingestellten Dingen (Titel, Bild und Hintergrund) mit korrekten Einfügungen
Das ist richtig. Sie sollten die Kanteneinsätze auf dem Titel und dem Bild verwenden, um die beiden richtig auszurichten. Sie können dies im Code tun, indem Sie die Eigenschaften titleEdgeInsets und contentEdgeInsets festlegen.
Tim Mahoney
4
Ja, es ist fast richtig. Sie müssen nur das BackgroundBild anstelle von festlegen Image, da sonst der Titel nicht angezeigt wird und nicht einmal die eingefügten Werte festgelegt werden, um den Titel neu zu positionieren.
Holex
6
Ich hatte auch Probleme damit. Wenn Ihr Titel nicht angezeigt wird, versuchen Sie, einen negativen linken Versatz dafür festzulegen. Es sieht so aus, als würde IB es automatisch rechts neben das Bild schieben.
Brian
8
Dies zeigt nur das Bild und den Text nebeneinander an, oder? Gibt es eine Möglichkeit, die Ausrichtung von oben nach unten zu ändern? Dies ist, was die ursprüngliche Frage besagt und wonach ich auch suche. Vielen Dank!
Flohei
12
Für Benutzer von Xcode 8 wird die Edge-Eigenschaft möglicherweise nicht angezeigt. Der Text kann auch nach dem Hinzufügen eines Bildes verschwinden. Der Text wird in Weiß geändert. Wenn Sie sich auf einem weißen Hintergrund befinden, scheint er verschwunden zu sein. Ändern Sie die Textfarbe und es wird in der Nähe des Bildes angezeigt. Sie können die Einfügungen unter Größeninspektor anpassen.
Micah Montoya
67
Ich denke, Sie suchen nach dieser Lösung für Ihr Problem:
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
... der Rest der Anpassung der Schaltfläche ist jetzt Ihre Pflicht, und vergessen Sie nicht, die Schaltfläche Ihrer Ansicht hinzuzufügen.
UPDATE # 1 und UPDATE # 2
oder, wenn Sie nicht über eine dynamische Schaltfläche benötigen könnten Sie Ihre Schaltfläche , um Ihre Ansicht in hinzufügen Interface Builder und Sie könnten die gleichen Werte an auch dort eingestellt. es ist ziemlich gleich, aber hier ist auch diese Version in einem einfachen Bild.
Sie können das Endergebnis auch im Interface Builder sehen, wie es auf dem Screenshot zu sehen ist.
EdgeInsets funktioniert nur, wenn Sie "Schaltflächenbild festlegen" haben und wenn Sie das Schaltflächenbild festlegen, wird der Titel nicht angezeigt. Wenn Sie ein Hintergrundbild festlegen, kann EdgeInsets nicht auf das Bild angewendet werden. und Sie können Titel sehen. Sie können edgeinsect also nicht gleichzeitig auf beide setzen.
Badal Shah
@BadalShah, ja, es gibt einige Szenarien (abhängig von der Größe der Schaltfläche, der Bildgröße, der Länge des Titels usw.), in denen das, was Sie gesagt haben, wahr ist und Sie den Titel und das Bild aufgrund des Bildes nicht gleichzeitig sehen können schiebt den Titel des sichtbaren Bereichs heraus; Dieses Szenario ist jedoch überhaupt nicht generisch. Die generische Situation besteht darin, dass sowohl Titel als auch Bild gleichzeitig angezeigt werden können und werden.
Holex
29
Xcode-9 und Xcode-10 Apple hat jetzt einige Änderungen an Edge Inset vorgenommen. Sie können diese unter Größeninspektor ändern.
Bitte folgen Sie den folgenden Schritten:
Schritt 1:
Geben Sie Text ein und wählen Sie das Bild aus, das Sie anzeigen möchten:
Schritt 2:
Wählen Sie die Tastensteuerung gemäß Ihren Anforderungen aus (siehe Abbildung unten):
Schritt 3:
Gehen Sie jetzt zum Größeninspektor und schaffen Sie einen Mehrwert gemäß Ihren Anforderungen:
Ich muss das Bild oben positionieren und der Text unter dem Bild sollte beide anklickbar sein.
Codesen
4
Verwenden Sie diesen Code:
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];
Ich bin auf dasselbe Problem gestoßen und habe es behoben, indem ich eine neue Unterklasse erstellt UIButtonund die layoutSubviews:Methode wie folgt überschrieben habe :
Ich denke, dass die Antwort von Angel García Olloqui eine weitere gute Lösung ist, wenn Sie alle manuell mit dem Interface Builder platzieren, aber ich werde meine Lösung beibehalten, da ich die Inhaltseinfügungen nicht für jede meiner Schaltflächen ändern muss.
Machen Sie UIImageViewund UILabelund setzen Sie Bild und Text auf beide .... dann platzieren Sie eine benutzerdefinierte Schaltfläche über imageView und Label ....
Einfach und nützlich. Wie stelle ich hervorgehobenes Bild und Titel ein?
DawnSong
für lable setHighlightedTextColor und Sie müssen mit forControlEvents spielen
Rajneesh071
3
Sie sollten eine benutzerdefinierte Bildansicht für das Bild und eine benutzerdefinierte Beschriftung für den Text erstellen und Ihrer Schaltfläche als Unteransichten hinzufügen. Das ist es.
Es ist wirklich einfach, fügen Sie einfach ein Bild zum Hintergrund Ihrer Schaltfläche hinzu und geben Sie dem Titeletikett der Schaltfläche Text für uicontrolstatenormal. Das ist es.
[btn setBackgroundImage:[UIImage imageNamed:@"img.png"] forState:UIControlStateNormal];[btn setContentVerticalAlignment:UIControlContentVerticalAlignmentBottom];[btn setTitle:@"Click Me" forState:UIControlStateNormal];
Antworten:
Ich sehe sehr komplizierte Antworten, alle mit Code. Allerdings , wenn Sie Interface Builder verwenden , gibt es eine sehr einfache Möglichkeit , dies zu tun:
Sie können sogar denselben Code-Ansatz verwenden, ohne darin UILabels und UIImages zu erstellen, wie dies bei anderen vorgeschlagenen Lösungen der Fall ist. Halte es immer einfach!
BEARBEITEN: Anbei ein kleines Beispiel mit den 3 eingestellten Dingen (Titel, Bild und Hintergrund) mit korrekten Einfügungen
quelle
Background
Bild anstelle von festlegenImage
, da sonst der Titel nicht angezeigt wird und nicht einmal die eingefügten Werte festgelegt werden, um den Titel neu zu positionieren.Ich denke, Sie suchen nach dieser Lösung für Ihr Problem:
... der Rest der Anpassung der Schaltfläche ist jetzt Ihre Pflicht, und vergessen Sie nicht, die Schaltfläche Ihrer Ansicht hinzuzufügen.
UPDATE # 1 und UPDATE # 2
oder, wenn Sie nicht über eine dynamische Schaltfläche benötigen könnten Sie Ihre Schaltfläche , um Ihre Ansicht in hinzufügen Interface Builder und Sie könnten die gleichen Werte an auch dort eingestellt. es ist ziemlich gleich, aber hier ist auch diese Version in einem einfachen Bild.
Sie können das Endergebnis auch im Interface Builder sehen, wie es auf dem Screenshot zu sehen ist.
quelle
Xcode-9 und Xcode-10 Apple hat jetzt einige Änderungen an Edge Inset vorgenommen. Sie können diese unter Größeninspektor ändern.
Bitte folgen Sie den folgenden Schritten:
Schritt 1: Geben Sie Text ein und wählen Sie das Bild aus, das Sie anzeigen möchten:
Schritt 2: Wählen Sie die Tastensteuerung gemäß Ihren Anforderungen aus (siehe Abbildung unten):
Schritt 3: Gehen Sie jetzt zum Größeninspektor und schaffen Sie einen Mehrwert gemäß Ihren Anforderungen:
quelle
Der folgende Code zeigt jedoch die Beschriftung oben und das Bild im Hintergrund
Label und Button müssen nicht im selben Steuerelement verwendet werden, da UIButton über die Eigenschaften UILabel und UIimageview verfügt.
quelle
Verwenden Sie diesen Code:
quelle
Verwenden Sie diesen Code:
quelle
Ich bin auf dasselbe Problem gestoßen und habe es behoben, indem ich eine neue Unterklasse erstellt
UIButton
und dielayoutSubviews:
Methode wie folgt überschrieben habe :Ich denke, dass die Antwort von Angel García Olloqui eine weitere gute Lösung ist, wenn Sie alle manuell mit dem Interface Builder platzieren, aber ich werde meine Lösung beibehalten, da ich die Inhaltseinfügungen nicht für jede meiner Schaltflächen ändern muss.
quelle
Machen Sie
UIImageView
undUILabel
und setzen Sie Bild und Text auf beide .... dann platzieren Sie eine benutzerdefinierte Schaltfläche über imageView und Label ....quelle
Sie sollten eine benutzerdefinierte Bildansicht für das Bild und eine benutzerdefinierte Beschriftung für den Text erstellen und Ihrer Schaltfläche als Unteransichten hinzufügen. Das ist es.
Verwenden Sie zu Testzwecken
yourButtonSelected:
MethodeIch denke, es wird Ihnen hilfreich sein.
quelle
Es ist wirklich einfach, fügen Sie einfach ein Bild zum Hintergrund Ihrer Schaltfläche hinzu und geben Sie dem Titeletikett der Schaltfläche Text für uicontrolstatenormal. Das ist es.
quelle
schnelle Version:
quelle