Hoe ga je met meerdere lijnen tekst toe te voegen aan een UIButton?

stemmen
313

Ik heb de volgende code ...

UILabel *buttonLabel = [[UILabel alloc] initWithFrame:targetButton.bounds];
buttonLabel.text = @Long text string;
[targetButton addSubview:buttonLabel];
[targetButton bringSubviewToFront:buttonLabel];

... het idee is dat ik meerdere regels tekst voor de knop kan hebben, maar de tekst wordt altijd overschaduwd door de backgroundImage van de UIButton. Een logging oproep aan de subzichten van de toets tonen laat zien dat de UILabel is toegevoegd, maar de tekst zelf kan niet worden gezien. Is dit een bug in UIButton of doe ik iets verkeerd?

De vraag is gesteld op 03/03/2009 om 01:22
bron van user
In andere talen...                            


26 antwoorden

stemmen
618

Voor iOS 6 en hoger moet de volgende meerdere lijnen gespecificeerde:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
// you probably want to center it
button.titleLabel.textAlignment = NSTextAlignmentCenter; // if you want to 
[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

Voor IOS 5 en onder toepassing van de volgende meerdere regels toe:

button.titleLabel.lineBreakMode = UILineBreakModeWordWrap;
// you probably want to center it
button.titleLabel.textAlignment = UITextAlignmentCenter;
[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

2017 voor iOS9 vooruit ,

in het algemeen, gewoon doen deze twee dingen:

  1. kies "Toegeschreven Text"
  2. op de "Line Break" popup selecteer "Word Wrap"
antwoordde op 01/12/2009 om 23:34
bron van user

stemmen
114

De geselecteerde antwoord is juist, maar als je liever dit soort dingen te doen in Interface Builder kunt u dit doen:

pic

antwoordde op 14/05/2014 om 16:36
bron van user

stemmen
53

Voor IOS 6:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.textAlignment = NSTextAlignmentCenter;

Zoals

UILineBreakModeWordWrap and UITextAlignmentCenter

zijn gedeprecieerd in IOS 6 verder ..

antwoordde op 08/10/2012 om 08:14
bron van user

stemmen
41

Als u wilt toevoegen van een knop met de titel gecentreerd met meerdere lijnen, stelt de instellingen van uw Interface Builder voor de knop:

[ hier]

antwoordde op 21/10/2015 om 09:03
bron van user

stemmen
28

Roger Nolan's suggestie herhalen, maar met expliciete code, dit is de algemene oplossing:

button.titleLabel?.numberOfLines = 0
antwoordde op 28/10/2010 om 16:45
bron van user

stemmen
17

SWIFT 3

button.titleLabel?.lineBreakMode = .byWordWrapping
button.titleLabel?.textAlignment = .center  
button.setTitle("Button\nTitle",for: .normal)
antwoordde op 08/05/2017 om 09:56
bron van user

stemmen
10

Er is een veel gemakkelijkere manier:

someButton.lineBreakMode = UILineBreakModeWordWrap;

(Edit voor iOS 3 en later :)

someButton.titleLabel.lineBreakMode = UILineBreakModeWordWrap;
antwoordde op 25/10/2009 om 20:48
bron van user

stemmen
9

Links uitlijnen op iOS7 met autolayout:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.textAlignment = NSTextAlignmentLeft;
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;
antwoordde op 28/06/2013 om 20:07
bron van user

stemmen
7

Allereerst moet u zich ervan bewust dat UIButton heeft al een UILabel erin. U kunt instellen met behulp van –setTitle:forState:.

Het probleem met uw voorbeeld is dat je nodig hebt om UILabel instellen numberOfLineswoning aan iets anders dan de standaard waarde van 1. U moet ook de herziening lineBreakModepand.

antwoordde op 03/03/2009 om 09:35
bron van user

stemmen
4

Antwoorden Hier wordt uitgelegd hoe u meerdere regels knoptitel programmatisch te bereiken.

Ik wilde alleen maar zeggen dat als u gebruik maakt van storyboards, typt u [Ctrl + Enter] om een ​​nieuwe regel op een knop titel veld forceren.

HTH

antwoordde op 01/05/2013 om 10:50
bron van user

stemmen
4

Voor degenen die met behulp van Xcode 4's storyboard, kunt u klikken op de knop, en aan de rechterkant Utilities deelvenster onder Attributen Inspector, ziet u een optie voor Line Break. Kies Word Wrap, en je moet goed om te gaan.

antwoordde op 09/05/2012 om 19:12
bron van user

stemmen
3

Met betrekking tot de Brent's idee om de titel UILabel als broer of zus te bekijken, lijkt het niet voor mij als een heel goed idee. Ik blijf denken in interactie problemen met de UILabel vanwege zijn aanraakgebeurtenissen niet krijgen door het standpunt van de UIButton's.

Aan de andere kant, met een UILabel als subweergave van de UIButton, ik ben er vrij comfortabel in de wetenschap dat de aanraking gebeurtenissen altijd zal worden doorgegeven aan superview de UILabel's.

Ik heb deze aanpak te nemen en merkte geen van de problemen gemeld met backgroundImage. Ik voegde deze code in het -titleRectForContentRect: van een UIButton subklasse maar de code kan ook bij het opstellen routine van de UIButton superview, die in dat geval zult u alle verwijzingen vervangen om zelf met variabele de UIButton worden geplaatst.

#define TITLE_LABEL_TAG 1234

- (CGRect)titleRectForContentRect:(CGRect)rect
{   
    // define the desired title inset margins based on the whole rect and its padding
    UIEdgeInsets padding = [self titleEdgeInsets];
    CGRect titleRect = CGRectMake(rect.origin.x    + padding.left, 
                                  rect.origin.x    + padding.top, 
                                  rect.size.width  - (padding.right + padding.left), 
                                  rect.size.height - (padding.bottom + padding].top));

    // save the current title view appearance
    NSString *title = [self currentTitle];
    UIColor  *titleColor = [self currentTitleColor];
    UIColor  *titleShadowColor = [self currentTitleShadowColor];

    // we only want to add our custom label once; only 1st pass shall return nil
    UILabel  *titleLabel = (UILabel*)[self viewWithTag:TITLE_LABEL_TAG];


    if (!titleLabel) 
    {
        // no custom label found (1st pass), we will be creating & adding it as subview
        titleLabel = [[UILabel alloc] initWithFrame:titleRect];
        [titleLabel setTag:TITLE_LABEL_TAG];

        // make it multi-line
        [titleLabel setNumberOfLines:0];
        [titleLabel setLineBreakMode:UILineBreakModeWordWrap];

        // title appearance setup; be at will to modify
        [titleLabel setBackgroundColor:[UIColor clearColor]];
        [titleLabel setFont:[self font]];
        [titleLabel setShadowOffset:CGSizeMake(0, 1)];
        [titleLabel setTextAlignment:UITextAlignmentCenter];

        [self addSubview:titleLabel];
        [titleLabel release];
    }

    // finally, put our label in original title view's state
    [titleLabel setText:title];
    [titleLabel setTextColor:titleColor];
    [titleLabel setShadowColor:titleShadowColor];

    // and return empty rect so that the original title view is hidden
    return CGRectZero;
}

Ik heb de tijd nemen en schreef een beetje meer over dit hier . Er wijs ik ook een kortere oplossing, hoewel het niet helemaal passen bij alle scenario's en het gaat om een aantal particuliere uitzicht hacking. Ook daar kunt u een UIButton subklasse klaar voor gebruik te downloaden.

antwoordde op 09/03/2009 om 15:25
bron van user

stemmen
2

Je moet deze code toe te voegen:

buttonLabel.titleLabel.numberOfLines = 0;
antwoordde op 21/02/2018 om 11:41
bron van user

stemmen
2

Als u gebruik maken van auto-lay-out.

button.titleLabel?.adjustsFontSizeToFitWidth = true
button.titleLabel?.numberOfLines = 2
antwoordde op 09/12/2016 om 10:55
bron van user

stemmen
2

Instellen lineBreakMode naar NSLineBreakByWordWrapping (hetzij in IB of code) maakt knoplabel meerdere lijnen, maar heeft geen invloed kader knop.

Als de knop heeft dynamische titel, is er een truc: zet verborgen UILabel met hetzelfde lettertype en bind haar hoogtepunt de hoogte knop met de lay-out; als tekst op de knop en het label en autolayout zal al het werk te maken.

Notitie

Intrinsieke grootte hoogte van één regel knop is groter dan label, om zo te voorkomen dat de hoogte label krimpt het verticale Content Knuffelen Prioriteit moet groter zijn dan de verticale Content knop drukweerstand zijn.

antwoordde op 31/08/2015 om 20:21
bron van user

stemmen
2

Als je auto-layout op iOS 6 te gebruiken is dit misschien ook nodig om de gestelde preferredMaxLayoutWidtheigenschap:

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.textAlignment = NSTextAlignmentCenter;
button.titleLabel.preferredMaxLayoutWidth = button.frame.size.width;
antwoordde op 01/05/2013 om 19:45
bron van user

stemmen
2

Het werkt perfect.

Voeg daarbij te gebruiken met configuratiebestand zoals PLIST, moet u CDATA gebruiken om de multilined titel te schrijven, zoals deze:

<string><![CDATA[Line1
Line2]]></string>
antwoordde op 11/05/2011 om 11:04
bron van user

stemmen
1
self.btnError.titleLabel?.lineBreakMode = NSLineBreakMode.byWordWrapping

self.btnError.titleLabel?.textAlignment = .center

self.btnError.setTitle("Title", for: .normal)
antwoordde op 03/08/2017 om 09:40
bron van user

stemmen
0

In Swift 5.0 en Xcode 10.2

SharedClass bijvoorbeeld eenmaal schrijven en gebruiken elke ware

Dit is uw gedeelde klasse (zoals deze die u gebruikt alle onderdelen eigenschappen)

import UIKit

class SharedClass: NSObject {

     static let sharedInstance = SharedClass()

     private override init() {

     }
  }

//UIButton extension
extension UIButton {
     //UIButton properties
     func btnMultipleLines() {
         titleLabel?.numberOfLines = 0
         titleLabel?.lineBreakMode = .byWordWrapping
         titleLabel?.textAlignment = .center        
     }
}

In je ViewController oproep als deze

button.btnMultipleLines()//This is your button
antwoordde op 29/04/2019 om 07:54
bron van user

stemmen
0

Ik had een probleem met auto-lay-out, na het inschakelen van multi-line het resultaat was als volgt: zodat de grootte niet van invloed op de knop grootte ik heb toegevoegd op basis van (in dit geval contentEdgeInsets was (10, 10, 10, 10 ) na het aanroepen : hoop dat je (swift 5,0 helpen):
voer image beschrijving hier
titleLabel
ConstraintscontentEdgeInsets
makeMultiLineSupport()
voer image beschrijving hier

extension UIButton {

    func makeMultiLineSupport() {
        guard let titleLabel = titleLabel else {
            return
        }
        titleLabel.numberOfLines = 0
        titleLabel.setContentHuggingPriority(.required, for: .vertical)
        titleLabel.setContentHuggingPriority(.required, for: .horizontal)
        addConstraints([
            .init(item: titleLabel,
                  attribute: .top,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .top,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.top),
            .init(item: titleLabel,
                  attribute: .bottom,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .bottom,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.bottom),
            .init(item: titleLabel,
                  attribute: .left,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .left,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.left),
            .init(item: titleLabel,
                  attribute: .right,
                  relatedBy: .greaterThanOrEqual,
                  toItem: self,
                  attribute: .right,
                  multiplier: 1.0,
                  constant: contentEdgeInsets.right)
            ])
    }

}
antwoordde op 11/04/2019 om 21:25
bron van user

stemmen
0

Deze dagen, als je echt dit soort dingen moeten toegankelijk in Interface Builder te worden op een case-by-case basis, je kunt het doen met een eenvoudige uitbreiding als volgt uit:

extension UIButton {
    @IBInspectable var numberOfLines: Int {
        get { return titleLabel?.numberOfLines ?? 1 }
        set { titleLabel?.numberOfLines = newValue }
    }
}

Dan kun je gewoon instellen numberOfLines als een attribuut op een UIButton of UIButton subklasse als ware het een label. Hetzelfde geldt voor een hele reeks andere meestal ontoegankelijk waarden, zoals de hoekstraal van de laag van een weergave of de kenmerken van de schaduw die het werpt.

antwoordde op 17/11/2018 om 07:12
bron van user

stemmen
0

In Xcode 9.3 kunt u doen door het gebruik van storyboard , zoals hieronder,

enter image description here

Je moet knoptitel textAlignment ingesteld naar het centrum

button.titleLabel?.textAlignment = .center

U hoeft niet om de titel tekst met nieuwe regel (\ n) in te stellen, zoals hieronder,

button.setTitle("Good\nAnswer",for: .normal)

U hoeft alleen maar de titel,

button.setTitle("Good Answer",for: .normal)

Hier is het resultaat,

enter image description here

antwoordde op 31/05/2018 om 06:14
bron van user

stemmen
0

Ik opgenomen antwoord jessecurry's binnen STAButton dat deel uitmaakt van mijn STAControls open source library. Ik gebruik het op dit moment in een van de apps Ik ontwikkel en het werkt voor mijn behoeften. Voel je vrij om problemen over hoe het te verbeteren of stuur me verzoeken open te trekken.

antwoordde op 05/05/2018 om 23:27
bron van user

stemmen
0

swift 4.0

btn.titleLabel?.lineBreakMode = .byWordWrapping
btn.titleLabel?.textAlignment = .center
btn.setTitle( "Line1\nLine2", for: .normal)
antwoordde op 25/03/2018 om 12:50
bron van user

stemmen
0

Rol uw eigen knoop klasse. Het is veruit de beste oplossing op de lange termijn. UIButton en andere UIKit klassen zijn zeer restrictief in hoe u ze kunt aanpassen.

antwoordde op 10/03/2009 om 14:16
bron van user

stemmen
-3

Hoewel het goed is om een ​​subweergave toe te voegen aan een controle, er is geen garantie dat het zal echt werken, omdat de controle zou niet verwacht dat het er zijn en kan dus slecht gedragen. Als je ermee weg kan krijgen, alleen het label toe te voegen als een broer of zus uitzicht op de knop en stel het frame, zodat het overlapt de knop; zo lang als het is ingesteld op de top van de knop om te verschijnen, zal er niets op de knop kan doen verdoezelen.

Met andere woorden:

[button.superview addSubview:myLabel];
myLabel.center = button.center;
antwoordde op 03/03/2009 om 13:04
bron van user

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more