Pulsante UIB con due righe di testo nel titolo (numberOfLines = 2)


87

Sto cercando di creare un UIButtoncon due righe di testo nel suo titleLabel. Questo è il codice che sto usando:

    UIButton *titleButton = [[UIButton alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
    titleButton.titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
    [titleButton setTitle:@"This text is very long and should get truncated at the end of the second line" forState:UIControlStateNormal];
    titleButton.titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
    titleButton.titleLabel.numberOfLines = 2;
    [self addSubview:titleButton];

Quando provo questo, il testo appare solo su una riga. Sembra che l'unico modo per ottenere più di una riga di testo UIButton.titleLabelsia impostare numberOfLines=0e utilizzare UILineBreakModeWordWrap. Ma questo non garantisce che il testo sia esattamente di due righe.

L'uso di una pianura UILabel, tuttavia, funziona:

    UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
    titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
    titleLabel.text = @"This text is very long and should get truncated at the end of the second line";
    titleLabel.numberOfLines = 2;
    titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
    [self addSubview:titleLabel];

Qualcuno sa come fare il UIButtonlavoro con due linee? L'unica soluzione è creare un separato UILabelper contenere il testo e aggiungerlo come sottoview del pulsante?



Viraj, sì, se imposti numberOfLines=0e utilizzi UILineBreakModeWordWrap, puoi ottenere più righe. Il problema è che potrebbe fornire più di due righe se il testo è troppo lungo. Voglio esattamente due solitari con un ellissi alla fine della seconda riga (se il testo è troppo lungo).
marketer

Oh, allora immagino che l'aggiunta di una sottoview potrebbe essere l'unico modo per andare.
Viraj

Risposte:


87

Risposta aggiornata per le versioni iOS più recenti

Poiché questa è la risposta accettata, ho aggiunto la risposta di @ Sean qui:

Imposta queste proprietà sulla titleLabel del tuo pulsante.

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.numberOfLines = 2; // if you want unlimited number of lines put 0

Swift 3 e 4:

button.titleLabel?.lineBreakMode = .byWordWrapping
button.titleLabel?.numberOfLines = 2 // if you want unlimited number of lines put 0

Risposta originale per una versione precedente di iOS

Se vuoi 2 righe di testo sopra il UIButtontuo dovresti aggiungere un fileUIlabel sopra che fa esattamente questo.

UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 10, frame.size.width-100, 100)];
titleLabel.font = [UIFont boldSystemFontOfSize:24.0];
titleLabel.text = @"This text is very long and should get truncated at the end of the second line";
titleLabel.numberOfLines = 2;
titleLabel.lineBreakMode = UILineBreakModeTailTruncation;
[myButton addSubview:titleLabel]; //add label to button instead.

Aggiornato per la soluzione di creazione di interfacce

Aggiunta la risposta di @Borut Tomazin per una risposta più completa. Aggiornata di nuovo questa parte poiché la risposta di @Borut Tomazin è stata migliorata.

Puoi farlo molto più facilmente, senza bisogno di codice. In Interface Builder impostare Line Breaksu UIButton su Word Wrap. Quindi puoi inserire più righe di titolo. Basta Option + Returnpremere i tasti per creare una nuova riga. Dovrai anche aggiungerlo all'attributo di runtime definito dall'utente in Interface Builder:

titleLabel.textAlignment Number [1]

5
UILineBreakModesono deprecati, utilizzare al NSLineBreakModeposto di esso
guillaume

2
Questo non è necessario a partire dalle recenti versioni di iOS. Vedi la risposta di @ sean.
Cbown

146

Non è necessario aggiungere un'etichetta UIL al pulsante UIB. Sono solo oggetti e lavoro extra.

Imposta queste proprietà sulla titleLabel del tuo pulsante.

button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;
button.titleLabel.numberOfLines = 2;//if you want unlimited number of lines put 0

Swift:

button.titleLabel!.lineBreakMode = NSLineBreakMode.ByWordWrapping
button.titleLabel!.numberOfLines = 2//if you want unlimited number of lines put 0

6
Questo è il 2013 e ad oggi questa è lo stato dell'arte della soluzione.
Klaas

@Blip non puoi sfortunatamente e devi farlo in codice. Potrebbe valere la pena inviare una segnalazione di bug ad Apple che richiede questa funzionalità.
bpapa

@bpapa Sì, sono d'accordo, gli storyboard dovrebbero essere più flessibili.
Blip

6
Questo funziona per me, tuttavia interrompe il comportamento predefinito del pulsante intrinsicContentSize, che restituisce comunque un'altezza che corrisponde a una sola riga di testo. L'ho risolto sovrascrivendo il pulsante intrinsicContentSizedove ho impostato l'altezza [self.titleLabel sizeThatFits(CGSizeMake(self.titleLabel.frame.size.width, CGFLOAT_MAX)].height.
Elise

@WillVonUllrich perché puoi cambiare la risposta accettata solo quando viene modificata. Ho aggiunto queste risposte a quella accettata in modo che possa aiutare le persone che non guardano oltre la risposta accettata.
Totumus Maximus

88

Puoi farlo molto più facilmente, senza bisogno di codice. In Interface Builder impostare Line Breaksu UIButton su Word Wrap. Quindi puoi inserire più righe di titolo. Basta Option + Returnpremere i tasti per creare una nuova riga. Dovrai anche aggiungerlo all'attributo di runtime definito dall'utente in Interface Builder:

titleLabel.textAlignment Number [1]

È così semplice. Spero che sia d'aiuto...


1
Questa soluzione è migliore (meno oggetti, codice) di quella attualmente accettata, per casi semplici.
Jonathan Zhan

1
Si impostano le stesse identiche proprietà come si impostano a livello di programmazione, quindi l'argomento "meno oggetti" non è valido. Il codice è forse meno. Ma è più leggibile. Fai la tua scelta;)
Totumus Maximus

Oh, non ero chiaro credo. Grazie per aver cercato di chiarire. Non era tanto preoccupato del fatto che fosse fatto in IB vs Code. Più a che fare con il fatto che non è necessario aggiungere un'etichetta aggiuntiva con la soluzione di Borut, e che anche questo fa la stessa cosa. Ma sì, entrambi funzionano alla grande. :)
Jonathan Zhan

è davvero opprimente dover passare al codice dietro per un'attività così semplice.
Can Poyrazoğlu

3
Puoi raggiungere lo stesso obiettivo senza codice al 100% aggiungendo l' titleLabel.textAlignment attributo di runtime definito dall'utente in Interface Builder e impostandolo su Numero = 1 (valore di NSTextAlignmentCenter).
0xced

21
 button.titleLabel.lineBreakMode = NSLineBreakByWordWrapping;

button.titleLabel.textAlignment = NSTextAlignmentCenter;

[button setTitle: @"Line1\nLine2" forState: UIControlStateNormal];

Perfetto! Non devi dividere l' NSStringinterno setTitle. WordWrapping lo fa per te!
Alex Cio

Per me ho dovuto dividere la stringa all'interno del titolo del set. Senza quello non ha funzionato
user1960169

9

Per evitare completamente la necessità di modificare il codice, e quindi la necessità di sottoclassare la tua vista, in Xcode5 e versioni successive puoi seguire il suggerimento di Borut Tomazin:

In Interface Builder (o storyboard) impostare Interruzione di riga su A capo automatico. Quindi puoi inserire più righe di titolo. Basta premere i tasti Option+ Returnper creare una nuova riga.

e poi, negli attributi di runtime definiti dall'utente è possibile aggiungere

Percorso chiave: titleLabel.textAlignment
Tipo: Number
Valore:1

Nota: questo potrebbe non essere completamente "a prova di futuro" poiché stiamo traducendo la UITextAlignmentCentercostante nel suo valore numerico (e tale costante potrebbe cambiare man mano che vengono rilasciate nuove versioni di iOS), ma sembra sicuro nel prossimo futuro.


1

È possibile modificare il valore necessario direttamente da Storyboard. Seleziona il pulsante, vai alla finestra di ispezione dell'identità e aggiungi la seguente coppia chiave-valore nella sezione "Attributi di runtime definiti dall'utente":

inserisci qui la descrizione dell'immagine

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.