2016-07-19 186 views
7

Utilizzo React Native 0.29 con emulatore Android (livello API 23). Sto cercando di raggiungere letterSpacing sul componente Text. Ma sembra non funzionare su Android. La documentazione ufficiale dice che funziona solo su iOS. C'è qualche soluzione a questo problema?Spaziatura delle lettere su React Native - Android

risposta

2

Simile a React Native 0.30 letterSpacing è solo iOS. È sempre possibile aggiungere questo ed emettere una richiesta pull :)

Un'altra opzione potrebbe essere quella di hackerare insieme una funzione che prende una stringa e aggiunge spaziatura attorno a ogni lettera. (sarebbe comunque un trucco!)

20

La mancanza di spaziatura delle lettere su Android può essere "risolta" aggiungendo uno o più spazi tra ogni carattere. Ho trovato l'unicode HAIR_SPACE U+200A per dare i risultati migliori, ma potrebbe essere necessario sperimentare per trovare ciò che si adatta meglio per il tuo font. Ad esempio 2 spazi per i capelli o uno U+2009 THIN SPACE.

function applyLetterSpacing(string, count = 1) { return string.split('').join('\u200A'.repeat(count)); }

Probabilmente funziona meglio per le intestazioni e le etichette di menu.

spazi Unicode: https://www.cs.tut.fi/~jkorpela/chars/spaces.html

+1

Questo metodo funziona bene per il tipo più piccolo, ma per i titoli è ancora troppo ampia. C'è qualcosa di più sottile dello spazio per i capelli? Mi guardavo intorno, ma non riuscivo a trovare nulla. Uno spazio pixel? – Teodors

+1

Un problema riguarda i testi più lunghi (che si spezzano) il testo può rompersi dopo ogni carattere (perché c'è uno spazio). Qualcuno ha trovato una soluzione per questo? – erikvdplas