调整Android WebView字体大小

Question

如何调整Android WebView 的字体大小？以下方法似乎没有效果：

private void fontSizePlus() {
    fontSize = (fontSize < FONT_SIZE_MAX) ? fontSize + FONT_SIZE_INCREMENT : fontSize;
    this.changeFontSize(fontSize);
}

private void fontSizeMinus() {
    fontSize = (fontSize > FONT_SIZE_MIN) ? fontSize - FONT_SIZE_INCREMENT : fontSize;
    this.changeFontSize(fontSize);
}

private void changeFontSize(int value) {
    String js = "document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '" + value + "%';";
    mWebView.loadUrl("javascript:(function() { " + js +  " })()");  
}

假设WebView和常量已经如下所示被初始化：

private final static int FONT_SIZE_DEFAULT = 100;
private final static int FONT_SIZE_MIN = 50;
private final static int FONT_SIZE_MAX = 150;
private final static int FONT_SIZE_INCREMENT = 5;
private int fontSize = FONT_SIZE_DEFAULT;

private WebView mWebView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.index);
    mWebView = (WebView) findViewById(R.id.webview);
    mWebView.getSettings().setJavaScriptEnabled(true);
    mWebView.loadUrl("file:///android_asset/index.htm");
}

- hpique

Answer 1

@rob的答案和评论指引了我正确的方向。

首先确保所有字体大小都相对于默认字体大小。如果使用绝对值，则以下内容不适用于这些元素。

然后：

@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    mWebView = (WebView) findViewById(R.id.webview);
    fontSize = mWebView.getSettings().getDefaultFontSize();
    ...
}

private void fontSizePlus() {
    fontSize++;
    this.changeFontSize(fontSize);
}

private void fontSizeMinus() {
    fontSize--;
    this.changeFontSize(fontSize);
}

private void changeFontSize(int value) {
    mWebView.getSettings().setDefaultFontSize(value);
}

通过改变默认字体大小的值，所有相关的字体大小都会相应地调整。这比使用WebSettings.setTextSize(WebSettings.TextSize t)可以给您更多的控制。

- hpique

---

这里我的WebView是适配器类，如何使用“fontSizePlus”和“fontSizeMinus”，谢谢。 - NagarjunaReddy

非常感谢您的解决方案 :) 它真的很有用。 - Programmer

这对我没有用。但是Brian Cooley的建议很有效：settings.setTextZoom( (int)(settings.getTextZoom() * 0.85) ); - Luis A. Florit

Answer 2

我不知道除了Safari /移动版Safari之外，是否支持 webkitTextSizeAdjust 。

尝试使用 WebSettings.setTextSize（WebSettings.TextSize t）而不是尝试使用JavaScript来完成它。

- rob

---

这似乎是问题，是的。不幸的是，WebSettings.TextSize 只有5个可能的值，我觉得太过限制了。这是 WebView 为此问题提供的最佳解决方案吗？ - hpique

嗯，总有老式的 CSS。也就是在 body 元素或类似元素上调整 fontSize。 - rob

+1 你的评论指引了我正确的方向。很快会发布解决方案。 - hpique

Answer 3

Brian Cooley 帮助我完成了这个...试试看...

increaseFontButton.setOnClickListener( new OnClickListener() {
    public void onClick(View v) {
        WebSettings settings = myWebView.getSettings();
        settings.setTextZoom( (int)(settings.getTextZoom() * 1.1) );
    }
}

- Basim Sherif