如何将字体类型设置为webview答案

【问题标题】：how to set font type to webview如何将字体类型设置为webview
【发布时间】：2014-07-16 08:39:17
【问题描述】：

我发现了很多将字体类型设置为 webview 的问题。我尝试过无法修复。

我的资产文件夹中有 10 个 html 文件。在 webview 中一一显示的滑动中，直到它工作正常，现在我需要单击按钮更改字体类型（对于我加载 10 个文件的所有 html 页面）。如何更改在 webview 中显示的 html 的字体类型。

第一种方式

  mainContent.getSettings().setJavaScriptEnabled(true);
            WebSettings webSettings = mainContent.getSettings();
            webSettings.setJavaScriptEnabled(true);
            webSettings.setBuiltInZoomControls(true);
            mainContent.requestFocusFromTouch();
            mainContent.setWebViewClient(new WebViewClient());
            mainContent.setWebChromeClient(new WebChromeClient());
            mainContent.loadUrl("file:///android_asset/"+filename.get(position));
       Typeface font = Typeface.createFromAsset(getAssets(), "myfont.ttf"); 
            webSettings.setFixedFontFamily(font);
            webSettings.setDefaultFontSize(20);

第二种方式

我已经得到了html的内容，并且我已经传入了一个字符串，我无法传入它，如果内容正确传递，这将起作用。

   mainContent.getSettings().setJavaScriptEnabled(true);
            WebSettings webSettings = mainContent.getSettings();
            webSettings.setJavaScriptEnabled(true);
            webSettings.setBuiltInZoomControls(true);
            mainContent.requestFocusFromTouch();
            mainContent.setWebChromeClient(new WebChromeClient());
            mainContent.loadUrl("file:///android_asset/"+filename.get(position));
            mainContent.setWebViewClient(new WebViewClient() {
                @Override
                public void onPageFinished(WebView view, String url) {
                    super.onPageFinished(view, url);
                    mainContent.setWebViewClient(null);    
           mainContent.loadUrl("javascript:window.HTMLOUT.processHTML('<div>'+document.getElementsByTagName('div')[0].innerHTML+'</div>');");
                     String pish = "<html><head><style type=\"text/css\">@font-face {font-family: MyFont;src: url(\"file:///android_asset/fonts/Kelvetica.ttf\")}body {font-family: MyFont;font-size: medium;text-align: justify;}</style></head><body>";
                     String pas = "</body></html>";     
                     String myHtmlString = pish + page + pas;   // here i can't able to get the `page`
                     mainContent.loadDataWithBaseURL(null,myHtmlString, "text/html", "UTF-8", null);

在我的活动中

  class MyJavaScriptInterface {
        @SuppressWarnings("unused")
        public void processHTML(final String html) {
            runOnUiThread(new Runnable() {
                public void run() {
                     Spanned page = Html.fromHtml(html);
                     System.out.println("content"+page);

                }
            });
        }
    }

我需要将这个page 传递到上面的代码中

第三种方式

  mainContent.getSettings().setJavaScriptEnabled(true);
            WebSettings webSettings = mainContent.getSettings();
            webSettings.setJavaScriptEnabled(true);
            webSettings.setBuiltInZoomControls(true);
            mainContent.requestFocusFromTouch();
            mainContent.addJavascriptInterface(new MyJavaScriptInterface(), "HTMLOUT"); 
           mainContent.loadUrl("file:///android_asset/"+filename.get(position));
            mainContent.setWebViewClient(new WebViewClient() {
                @Override
                public void onPageFinished(WebView view, String url) {
                    super.onPageFinished(view, url);
                    mainContent.setWebViewClient(null);
                    mainContent.loadUrl("javascript:(function() { var s=document.createElement('style');s.innerHTML ="
                                + " '@font-face{font-family:ZawGyi-One;src:url('file:///android_asset/fonts/zeroesthree.ttf');}"
                                + "body,div,h1,h2,h3,input,textarea{font-family:ZawGyi-One! important;}';"
                                + "document.getElementsByTagName('head')[0].appendChild(s);document.getElementsByTagName('body')[0].style.fontFamily = \"ZawGyi-One\"})()");
                }
            });

我试过这样。我无法更改字体类型。任何人有想法请分享。过去两天我一直在解决这个问题。提前致谢。

【问题讨论】：

标签： android html fonts webview

【解决方案1】：

你可以通过两种方式做到这一点

如果您的按钮是 html 的一部分，那么您可以在点击事件上调用 JavaScript 函数
使用 Android 按钮，您可以调用将更新字体系列的 JavaScript 函数

这里是例子： CSS font_first.css：

.box_heading{
        width:340px;
        text-align:center;
        font-family:Arial, Helvetica, sans-serif;
        color:#000;
        font-size:20px;
        font-weight:normal;
        margin-top:14px;
        float:left;
        text-transform:uppercase;}

HTML：index.html

如果您使用第二种方法执行此操作，您只需要从 android webview 调用 changeFont() 为此您必须调用 mainContent.loadUrl("javascript:changeFont()")

编辑
如果是这样，你可以试试这个：myWebView.loadUrl("javascript:document.getElementById('navigationText')style.fontFamily ='"+fontName+"');

【讨论】：

我有一个静态文件，我从 db 获取它并使用位置在 webview 中显示..
是的，它的工作..像这样的轻微变化..mainContent.loadUrl("javascript:document.getElementById('maindiv').style.fontFamily = 'courier';");你应该fontname在单引号@JaiSoni
@MakeitSimple 很棒 :)
酷......非常感谢兄弟......昨天晚上我已经完成了......非常感谢...... :)