Pregunta La fuente instalada personalizada no se muestra correctamente en UILabel


Estoy tratando de usar un Helvetica Neue Condensed fuente que obtuve del paquete Adobe Font Collection Pro. Lamentablemente, parece dibujar incorrectamente cuando lo uso dentro de un UILabel.

La altura de la línea parece calcularse correctamente (creo), pero cuando se muestra la fuente, se alinea con la parte superior del cuadro delimitador. llame [myLabel sizeToFit] y solo ajustó el ancho para producir esta captura de pantalla:

Screen capture of incorrect font rendering

Tuve el mismo problema con la versión en negrita y regular de la fuente. Pude sacar una versión de Helvetica Neue Bold de OSX y lo puso en mi dispositivo y se muestra bien (fondo verde en la imagen de arriba).

¿Qué podría estar mal con el archivo de fuente o mi código que lo haría dibujar de esta manera?


73
2018-03-24 04:22


origen


Respuestas:


Publiqué una solución que implica parchar el archivo de fuente ttf aquí:

Aquí está la solución que funcionaba para mi fuente personalizada que tenía el mismo problema en UILabel, UIButton y tal. El problema con la fuente resultó ser el hecho de que su propiedad ascendente era demasiado pequeña en comparación con el valor de las fuentes del sistema. Ascender es un espacio en blanco vertical sobre los caracteres de la fuente. Para arreglar tu fuente tendrás que descargar Apple Font Tool Suite utilidades de línea de comando. Luego toma tu fuente y haz lo siguiente:

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

Esto creará Bold.hhea.xml. Ábralo con un editor de texto y aumente el valor de ascender atributo. Tendrás que experimentar un poco para descubrir el valor exacto que funcione mejor para ti. En mi caso, lo cambié de 750 a 1200. Luego, ejecute la utilidad nuevamente con la siguiente línea de comando para fusionar los cambios en el archivo ttf:

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

A continuación, utilice la fuente ttf resultante en su aplicación.


111
2017-11-29 16:33



Entonces esta es una versión modificada de kolyuchiy's responder.

Abrí mi fuente con Glifos, y luego lo exportó sin modificar nada. De alguna manera, mágicamente, ¡el problema de la alineación vertical había desaparecido!

Lo mejor es que la nueva fuente funciona bien con métodos como sizeWithFont:, por lo que no tiene los problemas mencionados por Joshua.

Eché un vistazo a la tabla HHEA con el comando kolyuchiy mencionado, y noté que los Glyphs modificaron no solo el ascender, pero también lineGap y numberOfHMetrics para mi.

Aquí están los datos sin procesar, antes:

versionMajor="1"
versionMinor="0"
ascender="780"
descender="-220"
lineGap="200"
advanceWidthMax="1371"
minLeftSideBearing="-73"
minRightSideBearing="-52"
xMaxExtent="1343"
caretSlopeRise="1"
caretSlopeRun="0"
caretOffset="0"
metricDataFormat="0"
numberOfHMetrics="751"

y después:

versionMajor="1"
versionMinor="0"
ascender="980"
descender="-220"
lineGap="0"
advanceWidthMax="1371"
minLeftSideBearing="-73"
minRightSideBearing="-52"
xMaxExtent="1343"
caretSlopeRise="1"
caretSlopeRun="0"
caretOffset="0"
metricDataFormat="0"
numberOfHMetrics="748"

Entonces, la moraleja de la historia no solo aumenta el ascendente, sino que también modifica otros valores relacionados.

No soy un experto en tipografía, así que no puedo explicar el por qué y cómo. ¡Si alguien puede dar una mejor explicación, sería muy apreciado! :)


63
2018-05-28 17:28



iOS 6 respeta la propiedad lineGap de la fuente, mientras que iOS 7 la ignora. Por lo tanto, solo las fuentes personalizadas con un espacio de línea de 0 funcionarán correctamente en ambos sistemas operativos.

La solución es hacer la línea Gap 0 y hacer que el ascendedor sea correspondientemente más grande. Por el responder arriba, una solución es importar y exportar desde Glyphs. Sin embargo, tenga en cuenta que una versión futura de la aplicación podría solucionar este "error".

Una solución más robusta es editar la fuente usted mismo, por este enviar. Específicamente,

  1. Instalar OS X Font Tools.
  2. Vuelque las métricas de fuente a un archivo: ftxdumperfuser -t hhea -A d YOUR_FONT.ttf
  3. Abra el archivo volcado en un editor.
  4. Edita el ascender propiedad al agregar el valor de lineGap propiedad a ella. Por ejemplo, si el lineGap es 200 y el ascender es 750, haz el ascender 950.
  5. Selecciona el lineGap a 0
  6. Combina los cambios en la fuente: ftxdumperfuser -t hhea -A f YOUR_FONT.ttf

Una vez que hagas esto, es posible que tengas que ajustar tu UI en consecuencia.


31
2017-10-23 22:55



  1. Descargue e instale las herramientas de fuentes de Apple aquí: https://developer.apple.com/downloads/index.action?q=font (el enlace de descarga está en la parte inferior)
  2. Abre la terminal y desciende hasta donde está tu fuente
  3. Ejecute este comando: ftxdumperfuser -t hhea -A d MY_FONT_NAME.ttf
  4. Ahora tiene un archivo xml con algunas de las propiedades de la fuente, edítelo en su editor de texto
  5. Busque la propiedad "lineGap" y agregue 200 a su valor
  6. Guarde el archivo xml
  7. Ejecute este comando: ftxdumperfuser -t hhea -A f MY_FONT_NAME.ttf
  8. Eliminar el archivo xml
  9. Pruebe la fuente configurada en iOS 6 y vea si se ve mejor.
  10. Si lo necesita, puede volver al paso 3 y agregar / restar a la propiedad "lineGap". (Terminé agregando 250 a mi configuración)

4
2017-10-29 21:20



Tuvimos el mismo problema con una de nuestras fuentes personalizadas. También "solucionamos" el problema editando la propiedad ascender de fuente. Sin embargo, descubrimos que esto creó otros problemas y problemas de diseño. Por ejemplo, establecer dinámicamente la altura de la celda en función de la altura de la etiqueta explotaría al usar nuestra fuente editada ascendente.

Lo que terminamos haciendo fue cambiar la propiedad UIButton contentEdgetInsets.

yourButton.contentEdgeInsets = UIEdgeInsetsMake(-10, 0, 0, 0);

No estoy seguro de qué método es mejor, pero solo quería compartir otra forma de solucionar el problema.


3
2018-04-22 18:07



Gracias a esto responder Solucioné mi problema con Glyphs, pero un poco diferente.

Abrí mi fuente con Glyphs (también funciona con Glyphs mini) y encontré esta sección allí (esta de Glyphs mini, para llegar allí, presione el botón i en la esquina superior derecha):

enter image description here

Simplemente elimine todas estas zonas de alineación (o algunas de ellas) y solucionará este problema. Funcionó perfectamente para mí


3
2018-06-21 21:43



Para aquellos que ejecutan OS X El Capitan y vienen a este hilo, es posible que hayan notado que Apple Font Tool Suite ya no es compatible (al menos por ahora).

Pero aún puede realizar los cambios descritos por kolyuchiy y Joseph Lin con software gratuito de edición de fuentes FontForge.

Abra la fuente con FontForge y seleccione Elemento en el menú superior, luego vaya a Información de fuente> OS / 2> Métricas. Allí desea editar los valores de HHEad Line Gap y HHead Ascent Offset.

Una vez que haya hecho las ediciones necesarias, puede exportar la fuente en Archivo> Generar fuentes y seleccionar el formato de fuente correcto


3
2017-11-11 15:59



Has probado Texto principal? Tuve cierto éxito al renderizar fuentes personalizadas a través de Core Text, pero no sé si se adaptaría a su situación.


1
2018-06-26 03:29