Allineamento verticale del carattere personalizzato UIButton


118

Ho un UIButtonche utilizza un carattere personalizzato, che viene impostato quando viene caricata la mia vista:

- (void)viewDidLoad
{
    [super viewDidLoad];    
    self.searchButton.titleLabel.font = [UIFont fontWithName: @"FONTNAME" size: 15.0 ];
}

Il problema che ho è che il carattere sembra fluttuare sulla linea centrale. Se commento questa riga, il carattere predefinito appare centrato verticalmente bene. Ma il passaggio al carattere personalizzato interrompe l'allineamento verticale.

Sto riscontrando lo stesso problema anche su una cella di tabella con un carattere personalizzato.

Devo dire alla vista da qualche parte che il carattere personalizzato non è alto quanto gli altri caratteri?

EDIT: mi sono appena reso conto che il carattere che sto usando è un carattere TrueType di Windows. Posso usarlo bene in TextEdit su Mac, solo un problema con l'allineamento nella mia app

Il testo del pulsante non è centrato verticalmente


Risposte:


312

Un problema simile è stato discusso in Carattere installato personalizzato non visualizzato correttamente in UILabel . Non è stata data alcuna soluzione.

Ecco la soluzione che ha funzionato per il mio carattere personalizzato che presentava lo stesso problema in UILabel, UIButton e simili. Il problema con il font si è rivelato essere il fatto che la sua proprietà ascender era troppo piccola rispetto al valore dei font di sistema. Ascender è uno spazio bianco verticale sopra i caratteri del font. Per correggere il tuo carattere dovrai scaricare le utilità della riga di comando di Apple Font Tool Suite . Quindi prendi il tuo carattere e fai quanto segue:

~$ ftxdumperfuser -t hhea -A d Bold.ttf

Questo creerà Bold.hhea.xml. Aprilo con un editor di testo e aumenta il valore ascenderdell'attributo. Dovrai sperimentare un po 'per scoprire il valore esatto che funziona meglio per te. Nel mio caso l'ho cambiato da 750 a 1200. Quindi esegui di nuovo l'utilità con la seguente riga di comando per unire le modifiche nel file ttf:

~$ ftxdumperfuser -t hhea -A f Bold.ttf

Quindi usa il carattere ttf risultante nella tua app.

OS X El Capitan

Il programma di installazione di Apple Font Tool Suite non funziona più su OSX El Capitan a causa di SIP perché tenta di installare i file binari in una directory protetta. Devi estrarre manualmente ftxdumperfuser. Prima copia il pkg da dmg in una directory locale, quindi decomprimi OS X Font Tools.pkgcon

~$ xar -xf OS\ X\ Font\ Tools.pkg

Ora vai nella cartella fontTools.pkgcon

~$ cd fontTools.pkg/

Estrai il carico utile con

~$ cat Payload | gunzip -dc | cpio -i

Ora il ftxdumperfuserbinario è nella tua cartella corrente. Puoi spostarlo in /usr/local/bin/modo da poterlo utilizzare in ogni cartella all'interno dell'applicazione terminale con quanto segue.

~$ mv ftxdumperfuser /usr/local/bin/

4
+1 Ottimo suggerimento! Ecco alcune informazioni su Ascenders e Descenders typophile.com/node/13081
tidwall

35
Ha funzionato altrettanto bene per i file OTF.
mharper

2
Se si utilizza un carattere personalizzato modificato con questa soluzione e si imposta il testo, ad esempio in un UITextView con più righe, la distanza tra le linee diventa troppo grande.
Il tizio

5
Ho scoperto che in iOS 7 beta 6 hanno risolto il problema di allineamento dei caratteri. Quindi, se esegui questa correzione, andrà bene in iOS 6, ma non funzionerà in iOS 7 .... 7 è ancora in beta, quindi chi lo sa
tybro0103

3
Gli strumenti per i font sono stati aggiornati per Xcode 9, si installano bene su High Sierra. Link diretto: developer.apple.com/download/more/?=font
Andrés Pizá Bückmann

49

Ho risolto il problema regolando il riquadro del contenuto superiore (non il titolo!).

Ad esempio: button.contentEdgeInsets = UIEdgeInsetsMake (10.0, 0.0, 0.0, 0.0);

In bocca al lupo!


15
Questa è stata una buona soluzione rapida per me che sembrava più semplice che provare a modificare il carattere. myButton.titleLabel.font = [UIFont fontWithName: @ "FontName" size: 20.0]; myButton.contentEdgeInsets = UIEdgeInsetsMake (3.0, 0.0, 0.0, 0.0);
Jamie Hamick

Brillante! Grazie! Il mio problema era leggermente diverso, avevo semplici pulsanti + e - che utilizzavano il carattere predefinito e apparivano più bassi che centrati, sono stato in grado di usare la soluzione qui per alzare leggermente il testo in modo che non sembrasse fuori.
Patrick T Nelson,

7

Non sono sicuro che questo possa aiutare in quanto potrebbe dipendere dal tuo carattere, ma potrebbe essere che la tua linea di base non sia allineata.

self.searchButton.titleLabel.baselineAdjustment = 
    UIBaselineAdjustmentAlignCenters;

3
Funziona alla grande su un'etichetta title per un pulsante UIB quando la dimensione del carattere viene regolata con minimumScaleFactor
smitt04


2

Puoi provarlo in Interface Builder. Ecco un'istantanea di come farlo -

inserisci qui la descrizione dell'immagine inserisci qui la descrizione dell'immagine

Come puoi vedere, provare a farlo in IB ha i suoi vantaggi.


1
Questa impostazione è già in atto e in IB il carattere viene visualizzato verticalmente, ma viene visualizzato come carattere predefinito. È solo quando eseguo la mia app che viene visualizzato il mio carattere personalizzato e non è centrato verticalmente
Pete

imposti il ​​tuo "carattere personalizzato" in IB? è supportato nei caratteri iOS?
Srikar Appalaraju

Il carattere è impostato in IB e anche dal codice specificato nel mio post originale. In realtà non appare nel mockup della schermata IB, sebbene lo sia nel menu a discesa di selezione del carattere in IB.
Pete

2

In ritardo alla festa, ma poiché questo problema mi ha colpito per l'ennesima volta, ho pensato di pubblicare la soluzione più semplice che ho trovato: usare Python FontTools .

  1. Installa Python 3 se non è disponibile sul tuo sistema.

  2. Installa FontTools

    pip3 install fonttools

    FontTools include uno strumento TTX che consente la conversione da e verso XML.

  3. Converti il ​​tuo carattere in .ttx nella stessa cartella

    ttx myFontFile.otf

  4. Apporta le modifiche necessarie a .ttx ed elimina il file .otf poiché verrà sostituito nel passaggio successivo.

  5. Converti nuovamente il file in .otf

    ttx myFontFile.ttx


Motivazione: la soluzione di kolyuchi è incompleta e, anche con questo flusso di installazione esteso , l'esecuzione ha ftxdumperfusergenerato un errore su 10.15.2 Catalina.

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.