tipo - fuentes personalizadas android studio
Cómo usar una fuente personalizada con WebView (10)
Ahora quiero mostrar algunos caracteres Unicode y he usado la etiqueta: <font face=" Arial">something here</font> . Pero parece que WebView no puede encontrar la fuente Arial porque solo puedo ver los caracteres UFO. ¿Debo copiar arial.ttf a alguna parte o cómo puedo usar esta fuente TrueType con WebView ? Gracias.
Aparentemente, puede usar una fuente personalizada para WebView , como se sugirió en @raychung. Pero esto no funcionará para 2.1 (el error se informa here ). Esto debería funcionar para 1.5, 1.6 y 2.2.
Puede poner su archivo TTF de fuente personalizado en su carpeta /assets , luego, en su archivo CSS, puede colocarlo en:
@font-face {
font-family: "myIPA";
src: url(''IPA.TTF'');
}
.phon, .unicode
{
display: inline;
font-family: ''myIPA'', Verdana, sans-serif;
font-size: 14pt;
font-weight: 500;
font-style:normal;
color: black;
}
Ahora puede hacer referencia a este estilo de fuente en su archivo HTML.
Como dijo Felipe Martínez Carreño, puedes copiar de los activos y funcionará.
Puede referir this para más detalles
Esto funciona muy bien para mí en todos los dispositivos en los que lo he probado.
Coloque sus archivos de fuentes en / src / main / assets / fonts, luego use este método:
public class HTMLUtils {
public static String getLocalFontInHTML(String html, String fontFamily, String fontFileName) {
return "<!DOCTYPE html>/n" +
"<html>/n" +
"<head>/n" +
"<style>" +
"@font-face {" +
"font-family: " + fontFamily + ";" +
"src: url(''" + fontFileName + "'');" +
"}" +
"* {font-family: ''" + fontFamily + "'' !important;}" +
"* {font-size: 1rem !important;}" +
"</style>" +
"</head>/n" +
"<body>/n" +
html +
"/n" +
"</body>/n" +
"</html>";
}
}
como sigue
webView.loadDataWithBaseURL("file:///android_asset/", HTMLUtils.getLocalFontInHTML(item.text, Config.FONT_FAMILY, Config.REGULAR_FONT),"text/html", "UTF-8", null);
dónde
public static final String FONT_FAMILY = "Montserrat";
public static final String REGULAR_FONT = "fonts/Montserrat-Regular.otf";
Espero que ayude a alguien!
Si desea mantener el tamaño de fuente de su código html eliminar
"* {font-size: 1rem !important;}"
Ten en cuenta que 1rem es equivalente a alrededor de 14sp
La idea básica es que la página web debería tener acceso al archivo de fuente. Esta es la razón por la que la solución original sugerida funciona cuando el archivo HTML y el archivo de fuente están en la carpeta de activos, y el archivo HTML se carga desde allí.
No es una función de Android, es CSS, por lo que debería funcionar con cualquier SDK de Android.
Cargar la fuente desde la carpeta de archivos debería funcionar también, si el archivo de fuente está realmente allí y la ruta de acceso correcta está dada en el estilo. Pero aunque el enfoque es más complicado, uno necesita escribir código para copiar el archivo, luego codificar para descubrir la ubicación del archivo.
Estoy muy contento de tener simplemente el contenido HTML y el archivo de fuente en los activos, y cargarlos desde allí.
webView.loadUrl("file:///android_asset/content.html");
No funcionó para mí, tuve que vincular la fuente en mi servidor web en lugar de usar la referencia a un archivo local:
@font-face {
font-family: ''feast'';
src: url(''http://yoursite.com/tutorial/css/feasfbrg.ttf'');
}
body {font-family: ''feast'';}
Puede hacer que funcione en todas las versiones copiando el archivo de fuente de sus activos a su carpeta de archivos en el primer lanzamiento de la aplicación, y luego haga referencia a ella como:
"@font-face {
font-family: cool_font;
src: url(''file://"+ getFilesDir().getAbsolutePath()
+ "/cool_font.ttf'');
}"
Utilicé el código siguiente para la dirección rtl con fuente persa, espero que alguien use este código o alguien me sugiera la mejor manera. Gracias
String myCustomStyleString="<style type=/"text/css/">@font-face {font-family: MyFont;src: url(/"file:///android_asset/fonts/BYEKAN.ttf/")}body,* {font-family: MyFont; font-size: medium;text-align: justify;}</style>";
webView.loadDataWithBaseURL("", myCustomStyleString+"<div style=/"direction:rtl/">"+myHtm+"</div>", "text/html", "utf-8", null);
usar css
@font-face { font-family: cool_font; src: url(''cool_font.ttf''); }
loadData tampoco me funcionó, así que utilicé file:///android_asset en la ruta src.
¡Funcionó con loadDataWithBaseURL !
Para este ejemplo, cambié el CSS a:
@font-face {
font-family: ''feast'';
src: url(''fonts/feasfbrg.ttf'');
}
body {font-family: ''feast'';}
A continuación, use la ruta de los activos como URL base:
loadDataWithBaseURL("file:///android_asset/",myhtml,"text/html","utf-8",null);
@font-face {
font-family: ''MyCustomFont'';
src: url(''/assets/fonts/MaycustomFont.ttf'')
}
Esto funciona para mi.
->src
->assets
->fonts
->MaycustomFont.ttf
->..
->res