22

Android ブラウザーで表示する HTML ページを設計しています。この簡単な例のページを考えてみましょう:

<html>
<head><title>Simple!</title>
</head>
<body>
<p><img src="http://sstatic.net/so/img/logo.png"></p>
</body>
</html>

標準の HVGA 携帯電話 (320x480) では問題なく表示されますが、HDPI WVGA サイズ (480x800 または 480x854) では、組み込みブラウザーが自動的に画像を拡大します。それは醜く見えます。

このタグを使用して、ブラウザーがページのスケーリングを強制的に停止できるようにする必要があることを読みました。

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" />

...しかし、ユーザースケーリングを無効にするだけです（ズームボタンが消えます）。実際には、ブラウザが私の画像をスケーリングするのを妨げません。倍率を調整 (すべて 2.0 または 0.5 に設定) しても、まったく効果がありません。

WVGA ブラウザに画像のスケーリングを強制的に停止させるにはどうすればよいですか?

4

2 に答える 2

32

ああ、Android のソース コードを検索して見つけました。「viewport」メタ タグで使用できる新しい Android 固有の「target-densityDpi 」設定があります。私が知る限り、チェックインのコメントを除いて、それは完全に文書化されていません!

WebView の dpi サポートを追加します。

「viewport」メタタグでは、「target-densityDpi」を指定できます。指定しない場合は、現在のデフォルトの 160dpi が使用されます。次に、viewport タグで指定された 1.0 の倍率は、G1 で 100%、Sholes で 150% を意味します。「target-densityDpi」を「device-dpi」に設定すると、1.0 の倍率は G1 と Sholes の両方で 100% を意味します。

Safari の window.devicePixelRatio と css メディア クエリ device-pixel-ratio を実装しました。

したがって、「device-dpi」を使用し、window.devicePixelRatio に応じて font-size と image src の css を変更すると、Sholes/Passion でより良いページを取得できます。

「target-densityDpi」のオプションの一覧を次に示します。

device-dpi: デバイスのネイティブ dpi をターゲット dpi として使用します。low-dpi: 120dpi medium-dpi: 160dpi、これは現在のデフォルトでもあります high-dpi: 240dpi : 有効なターゲット dpi として 70 から 400 の間の任意の数値を使用します。

于 2010-05-09T23:31:07.790 に答える
5

WebView の API ドキュメントの一部になりました: http://developer.android.com/reference/android/webkit/WebView.html

「さまざまな画面密度をサポートする Web ページの構築」というタイトルのセクションを参照してください。

于 2010-07-09T11:41:43.620 に答える