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. ¿Tengo que copiar arial.ttf a en algún lugar o cómo puedo usar esta fuente TrueType con WebView
? Gracias.Cómo utilizar una fuente personalizada con WebView
Respuesta
uso css
@font-face { font-family: cool_font; src: url('cool_font.ttf'); }
Al parecer, se puede utilizar una fuente personalizada para WebView
, como @raychung anteriormente sugeridos. Pero esto no funcionará para 2.1 (se informa el error here). Esto debería funcionar para 1.5, 1.6 y 2.2.
Se puede poner el archivo TTF fuente personalizada en la carpeta de /assets
, a continuación, en el archivo CSS que puede poner 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 el archivo HTML.
Puede conseguir que funcione en todas las versiones copiando el archivo de fuentes de sus bienes a sus archivos de carpeta en el primer lanzamiento de la aplicación, y luego hacer referencia a ella como:
"@font-face {
font-family: cool_font;
src: url('file://"+ getFilesDir().getAbsolutePath()
+ "/cool_font.ttf');
}"
Copiar a mi carpeta de archivos todavía no parece funcionar para mí. El WebView todavía no usa mi fuente. ¿Hay algo especial que hayas hecho? – Zarah
En realidad, en el primer lanzamiento compruebo si el archivo se ha copiado a la carpeta de archivos, si no, lo copio y luego lo menciono como se dijo anteriormente. 'Archivo f = new File (getFilesDir()," coolFont.ttf "); if (f.length() == 0) { InputStream myInput = this.getAssets(). Open ("fuentes/coolFont.ttf"); String outFileName = "coolFont.ttf "; OutputStream myOutput = new FileOutputStream (getFilesDir() +"/"+ outFileName); byte [] buffer = nuevo byte [1024]; int longitud; while ((length = myInput.read (buffer)) > 0) { myOutput.write (buffer, 0, longitud); } myOutput.flush(); myOutput.close(); myInput.close();} ' –
no he tenido éxito en esto también funciona. Sin duda, mi fuente aparece en el directorio '/ data/data/[package]/files' de mi aplicación, y mientras WebView está estilizado según el CSS, el texto simplemente no aparece en el fuente deseada. Estoy compilando contra Android 2.1 y probando en 2.3.5. ¿Alguna pista qué da? –
Como Felipe Martínez Carreño Dijo que puede copiar de los activos y que funcionará.
Se puede hacer referencia this para más detalles
No trabajó para mí, he tenido que unir el tipo de letra en mi servidor web en lugar de utilizar la referencia a un archivo local:
@font-face {
font-family: 'feast';
src: url('http://yoursite.com/tutorial/css/feasfbrg.ttf');
}
body {font-family: 'feast';}
Intenté esto pero n ot help me –
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 característica 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");
loadData
no funcionó para mí tampoco, por lo que utiliza file:///android_asset
en el camino src.
Funcionó con loadDataWithBaseURL
!
Para este ejemplo he cambiado el CSS para:
@font-face {
font-family: 'feast';
src: url('fonts/feasfbrg.ttf');
}
body {font-family: 'feast';}
A continuación, utilice la ruta de los activos que la URL base:
loadDataWithBaseURL("file:///android_asset/",myhtml,"text/html","utf-8",null);
Tuve problema para poner el CSS en 'strings.xml'. Así que creé una constante de cadena con el valor de css anterior y pude mostrar el efecto de fuente personalizado ... ¡Gracias! –
¡Acabas de hacer mi día! :) – gauravsapiens
no funciona para mí –
@font-face {
font-family: 'MyCustomFont';
src: url('/assets/fonts/MaycustomFont.ttf')
}
Funciona para mí.
->src
->assets
->fonts
->MaycustomFont.ttf
->..
->res
Solía continuación Código de dirección RTL con la fuente persa, espero que alguien utiliza este código o alguien me sugieren 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);
Esto funciona muy bien para mí en todos los dispositivos en los que lo he probado.
Coloque los ficheros en/src/main/activos/tipos de letra, a continuación, utilizar 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>";
}
}
de la siguiente manera
webView.loadDataWithBaseURL("file:///android_asset/", HTMLUtils.getLocalFontInHTML(item.text, Config.FONT_FAMILY, Config.REGULAR_FONT),"text/html", "UTF-8", null);
donde
public static final String FONT_FAMILY = "Montserrat";
public static final String REGULAR_FONT = "fonts/Montserrat-Regular.otf";
creo que sirve ¡alguien!
Si desea mantener el tamaño de la fuente de su código html eliminar
"* {font-size: 1rem !important;}"
Tenga en cuenta que 1rem es equivalente a alrededor de 14sp
- 1. Android NDK: compilación WebView personalizada desde la fuente
- 2. ¿Cómo utilizar una herramienta de comparación personalizada con Perforce?
- 3. ¿Cómo uso una fuente personalizada con la biblioteca Batik SVG?
- 4. ¿Cómo configurar una fuente personalizada en emacs?
- 5. UIFont con fuente personalizada falla con Nil
- 6. C# - Cómo utilizar una fuente personalizada sin instalarla en el sistema
- 7. Incrustar una vista personalizada dentro de una WebView
- 8. Agregue una fuente personalizada en Qt
- 9. Uso de fuente personalizada en UIWebView
- 10. UILabel con fuente personalizada erróneamente renderizada
- 11. Fuente personalizada en ckeditor
- 12. Fuente personalizada en Android
- 13. WPF - Agregar fuente personalizada
- 14. Obtención de HTML fuente desde una WebView en Cocoa
- 15. Fuente personalizada en una aplicación Cocoa
- 16. fuente personalizada en android ListView
- 17. ¿Cómo agregar una fuente personalizada a la aplicación Rails?
- 18. Cómo crear una UITableViewCell personalizada sin utilizar XIB
- 19. android establece una fuente personalizada para una pintura
- 20. Cómo instalo una fuente personalizada en un sitio HTML
- 21. Cómo instalar una fuente personalizada en el dispositivo Android
- 22. Android - Cómo establecer una fuente personalizada para la aplicación entera
- 23. ¿Cómo usar una fuente personalizada en Android xml?
- 24. ¿Cómo utilizar una tecla de acceso en un botón de WPF con una ContentTemplate personalizada?
- 25. Mi fuente personalizada no muestra
- 26. Usando un UIWebView, ¿puedo usar una fuente personalizada?
- 27. ¿Puedo incrustar una fuente personalizada en una aplicación de Android?
- 28. Cómo utilizar una fuente (aleatoria) * .otf o * .ttf en matplotlib?
- 29. Accediendo a la fuente personalizada desde Jar
- 30. ¿Cómo implemento una lista personalizada en Cocoa?
Si pongo el '' .ttf' y .html' archivo en el mismo directorio y cárguelo en el navegador de Android, funciona. Sin embargo, en el WebView de mi aplicación, mientras se muestra el CSS, el texto aparece en la fuente predeterminada de Android a pesar de agregar '.ttf' a la carpeta' assets' del proyecto. Estoy probando en 2.3.5, pero construyendo contra 2.1. ¿Podría ser ese el problema, o hay algo que me falta? –
Encontré una resolución: si crea un archivo HTML y lo coloca en los activos, lo carga mediante 'view.loadUrl()' funciona, mientras que 'view.loadData()' no lo hace. No tengo idea de por qué este último no. –
Hola @Paul! Eso es curioso No he intentado trabajar en este error desde hace un tiempo, pero cuando lo necesite probaré su solución. Lo que hice antes fue cambiar los caracteres especiales a imágenes en los archivos HTML. – Zarah