Apache Cordova(phonegap)html viewport 不起作用问题

原创
2015/11/07 17:36
阅读数 869

iOS解决方法

 

在Cordova(phonegap)的config.xml中增加一行配置: 

<preference name="EnableViewportScale" value="true"/> 

实际上这行只是针对 iOS 项目的。

一般是好用的,但是某些版本的 Cordova(phonegap)会出现 bug,Android 设备出现问题。

 

建议在 Cordova 创建工程的目录下的 config.xml 文件也加上,方便以后用命令编译。

android 解决方法

MainActivity.java 类

package com.easycloud.waiter;

import android.os.Bundle;
import android.webkit.WebView;
import org.apache.cordova.*;

public class MainActivity extends CordovaActivity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        // Set by <content src="index.html" /> in config.xml
        loadUrl(launchUrl);

        //下面能让 Android 设备支持 viewport
        WebView webView = (WebView) this.appView.getView();
        webView.getSettings().setLoadWithOverviewMode(true);
        webView.getSettings().setUseWideViewPort(true);
    }
}

不要忘记引包。

 

注意:如果 使用了 cordova-plugin-crosswalk-webview 插件时, 如果出现这个问题,需要在插件内部修复。

/YourProject/platforms/android/src/org/crosswalk/engine/XWalkWebViewEngine.java

找到下面代码:


    private void initWebViewSettings() {
        webView.setVerticalScrollBarEnabled(false);

        //添加这样的代码
        webView.getSettings().setLoadWithOverviewMode(true);
        webView.getSettings().setUseWideViewPort(true);
        //修改结束

        boolean zOrderOnTop = preferences == null ? false : preferences.getBoolean(XWALK_Z_ORDER_ON_TOP, false);
        webView.setZOrderOnTop(zOrderOnTop);

        // Set xwalk webview settings by Cordova preferences.
        String xwalkUserAgent = preferences == null ? "" : preferences.getString(XWALK_USER_AGENT, "");
        if (!xwalkUserAgent.isEmpty()) {
            webView.setUserAgentString(xwalkUserAgent);
        }
        
        String appendUserAgent = preferences.getString("AppendUserAgent", "");
        if (!appendUserAgent.isEmpty()) {
            webView.setUserAgentString(webView.getUserAgentString() + " " + appendUserAgent);
        }
        
        if (preferences.contains("BackgroundColor")) {
            int backgroundColor = preferences.getInteger("BackgroundColor", Color.BLACK);
            webView.setBackgroundColor(backgroundColor);
        }
    }

 

 

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
打赏
0 评论
0 收藏
1
分享
返回顶部
顶部