Android WebView -Webページはデバイス画面に適合する必要があります
-
29-09-2019 - |
質問
デバイスの画面サイズに基づいて、Webページに適合するように以下を試しました。
mWebview.setInitialScale(30);
次に、メタデータビューポートを設定します
<meta name="viewport" content="width=320, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;"/>
<meta name="viewport" content="width=device-width, target-densityDpi=medium-dpi"/>
しかし、何も機能しません。ウェブページはデバイスの画面サイズに固定されていません。
誰かがこれを手に入れる方法を教えてもらえますか?
解決
30に設定するのではなく、手動で使用する必要があるスケールを計算する必要があります。
private int getScale(){
Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
int width = display.getWidth();
Double val = new Double(width)/new Double(PIC_WIDTH);
val = val * 100d;
return val.intValue();
}
次に、使用します
WebView web = new WebView(this);
web.setPadding(0, 0, 0, 0);
web.setInitialScale(getScale());
他のヒント
これを使用できます
WebView browser = (WebView) findViewById(R.id.webview);
browser.getSettings().setLoadWithOverviewMode(true);
browser.getSettings().setUseWideViewPort(true);
これにより、画面サイズに基づいてサイズが修正されます。
友達、
私はあなたから多くのインポートと素晴らしい情報を見つけました。しかし、私にとって唯一の方法はこの方法でした:
webView = (WebView) findViewById(R.id.noticiasWebView);
webView.setInitialScale(1);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
webView.setScrollbarFadingEnabled(false);
webView.loadUrl("http://www.resource.com.br/");
会社のデバイスの種類のため、私はAndroid 2.1に取り組んでいます。しかし、それぞれからの情報の部分を使用して問題を修正しました。
ありがとうございます!
これらの設定は私のために機能しました:
wv.setInitialScale(1);
wv.getSettings().setLoadWithOverviewMode(true);
wv.getSettings().setUseWideViewPort(true);
wv.getSettings().setJavaScriptEnabled(true);
SetInitialScale(1) 私の試みでは行方不明でした。
ドキュメントはそれを言っていますが 0 もしあればずっとズームします SetuseWideViewport に設定されています 本当です しかし 0 私のために働いていなかったし、私は設定しなければならなかった 1.
このHTML5のヒントを試してみてください
http://www.html5rocks.com/en/mobile/mobifiing.html
そして、あなたのAndroidバージョンが2.1以上の場合、これで
WebView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
あなたがする必要があるのは、単純にです
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
これらは私のために機能し、WebViewを画面幅に適合させます。
// get from xml, with all size set "fill_parent"
webView = (WebView) findViewById(R.id.webview_in_layout);
// fit the width of screen
webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
// remove a weird white line on the right size
webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
上記のアドバイスに感謝します Eclipse Webビューの白い線
このコードを使用すると同じ問題があります
webview.setWebViewClient(new WebViewClient() {
}
だからあなたはそうすべきかもしれません 削除する それはあなたのコードにあります
WebViewに以下に3つのモードを追加することを忘れないでください
webview.getSettings().setJavaScriptEnabled(true);
webview.getSettings().setLoadWithOverviewMode(true);
webview.getSettings().setUseWideViewPort(true);
これにより、画面サイズに基づいてサイズが修正されます
WebView browser = (WebView) findViewById(R.id.webview);
browser.getSettings().setLoadWithOverviewMode(true);
browser.getSettings().setUseWideViewPort(true);
browser.getSettings().setMinimumFontSize(40);
テキストサイズは.setLoadWithViewModeと.setUseWideViewportによって非常に小さく設定されているため、これは私にとって最適です。
この場合、WebViewでHTMLを使用する必要があります。次のコードを使用してこれを解決しました
webView.loadDataWithBaseURL(null,
"<!DOCTYPE html><html><body style = \"text-align:center\"><img src= "
+ \"http://www.koenvangorp.be/photos/2005_09_16-moon_2000.jpg\"
+ " alt=\"pageNo\" width=\"100%\"></body></html>",
"text/html", "UTF-8", null);
display.getWidth()以降、DANH32による回答を変更します。今では非推奨になっています。
private int getScale(){
Point p = new Point();
Display display = ((WindowManager) getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();
display.getSize(p);
int width = p.x;
Double val = new Double(width)/new Double(PIC_WIDTH);
val = val * 100d;
return val.intValue();
}
次に、使用します
WebView web = new WebView(this);
web.setPadding(0, 0, 0, 0);
web.setInitialScale(getScale());
これはXMLの問題のようです。 Web-Viewを含むXMLドキュメントを開きます。上部のパディングコードを削除します。
次に、レイアウトで追加します
android:layout_width="fill_parent"
android:layout_height="fill_parent"
Web-Viewで追加します
android:layout_width="fill_parent"
android:layout_height="fill_parent"
これにより、Web-Viewがデバイス画面にフィットするようになります。
HTML文字列にビデオがあり、Webビューの幅がその画面幅が大きく、これは私にとって機能しています。
これらの行をHTML文字列に追加します。
<head>
<meta name="viewport" content="width=device-width">
</head>
上記のコードをHTML文字列に追加した後の結果:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width">
</head>
</html>
int PIC_WIDTH= webView.getRight()-webView.getLeft();
ディスプレイオブジェクトのgetWidthメソッドは非推奨です。 WebViewが利用可能になったときにWebViewのサイズを取得するために、sizechangedをオーバーライドします。
WebView webView = new WebView(context) {
@Override
protected void onSizeChanged(int w, int h, int ow, int oh) {
// if width is zero, this method will be called again
if (w != 0) {
Double scale = Double.valueOf(w) / Double.valueOf(WEB_PAGE_WIDTH);
scale *= 100d;
setInitialScale(scale.intValue());
}
super.onSizeChanged(w, h, ow, oh);
}
};
webview.setInitialScale(1);
webview.getSettings().setLoadWithOverviewMode(true);
webview.getSettings().setUseWideViewPort(true);
webview.getSettings().setJavaScriptEnabled(true);
動作しますが、次のようなものを削除することを忘れないでください。
<meta name="viewport" content="user-scalable=no"/>
HTMLファイルに存在する場合、またはユーザースケーラブル=はいを変更した場合、そうでない場合はそうしません。
これは、ウェブページに従ってエミュレータを調整するのに役立ちます。
WebView wb;
//CALL THIS METHOD
wb.setInitialScale(50);
上記のように、Intialスケールをパーセンテージに設定できます。
理論的には:の組み合わせ:
settings.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS);
と
settings.setUseWideViewPort(false)
問題を修正し、コンテンツをラップし、画面にフィットします。しかし large_columns 非推奨されています。このスレッドを読んでください。問題を詳細に調査してください。 https://code.google.com/p/android/issues/detail?id=62378
@DANH32の回答に基づいて、非推奨の方法を使用していない更新されたバージョンは次のとおりです。
protected int getScale(Double contentWidth) {
if(this.getActivity() != null) {
DisplayMetrics displaymetrics = new DisplayMetrics();
this.getActivity().getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
Double val = displaymetrics.widthPixels / contentWidth * 100d;
return val.intValue();
} else {
return 100;
}
}
同様に使用する:
int initialScale = this.getScale(420d);
this.mWebView.setInitialScale(initialScale);
setLoadWithOverviewMode(true)
-WebViewを完全にズームアウトしますsetUseWideViewPort(true)
WebViewには通常のビューポート(通常のデスクトップブラウザーなど)がありますが、falseの場合、WebViewには独自のディメンションに拘束されるビューポートがあります(したがって、WebViewが50px*50pxの場合、ビューポートは同じサイズになります)
続きを読む ここ
WebViewの所有者ではなかったときに状況がありました。また、Pageが終了した後にWebViewを変更しました。その結果、ズームで副作用が発生しました。私の解決策は次のとおりです。
webView.post(new Runnable() {
@Override
public void run() {
webView.getSettings().setLoadWithOverviewMode(true);
}
});
WebView webView = (WebView)findViewById(R.id.web_view);
webView.setInitialScale((int) getResources().getDimension(R.dimen._50sdp)); // getActivity(). if you are at Fragment
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setJavaScriptEnabled(true);
webView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
webView.loadDataWithBaseURL(null,here comes html content,"text/html","UTF-8", null);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setDisplayZoomControls(true);
webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);