Webview 中的 JQuery 移动 UI 缩放答案

【问题标题】：JQuery mobile UI-scaling in webviewWebview 中的 JQuery 移动 UI 缩放
【发布时间】：2014-01-28 18:24:33
【问题描述】：

目前我正在 android 应用程序中开发基于 Web 的模块。我使用 Jquery 移动设计并使用 webview 将其导入到 android 活动中。当我运行活动时，设计显示但未缩放到 webview，它包含水平和垂直滚动。我在这篇文章中附上了代码。我需要帮助来扩展 jquery 移动设计的活动。提前致谢！

package com.example.updatesuite;

import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.view.Menu;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

@SuppressLint("SetJavaScriptEnabled")
public class Gateway extends Activity {
    WebView wv1;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_gateway);
        wv1=(WebView)findViewById(R.id.webView1);
        WebSettings webSettings = wv1.getSettings();
        webSettings.setDefaultFontSize(14);
        wv1.getSettings().setLoadWithOverviewMode(true);
        wv1.getSettings().setUseWideViewPort(true);
        wv1.getSettings().setJavaScriptEnabled(true);
        wv1.getSettings().setSupportZoom(false);
        wv1.getSettings().setBuiltInZoomControls(false);
        wv1.setWebChromeClient(new WebChromeClient());
        wv1.setWebViewClient(new WebViewClient());
        wv1.loadUrl("http://applicationdownloader.pixub.com/walcliff/index.php");

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.gateway, menu);
        return true;
    }

}

【问题讨论】：

标签： android jquery jquery-mobile

【解决方案1】：

如果我没记错的话，那么以下一种或两者的组合会导致您在 Android 中出现问题

wv1.getSettings().setLoadWithOverviewMode(true);
wv1.getSettings().setUseWideViewPort(true);

我相信UseWideViewPort 告诉 WebView 在桌面模式下加载。

另外，你的 html 页面应该有

<meta name="viewport" content="width=device-width, user-scalable=no">

在head 标签之间。（有了这个标签你可能不需要修改 WebViewSettings）

【讨论】：