viewport - android webview 屏幕适应问题
阿神
阿神 2017-04-17 16:30:42
0
5
671

target-densitydpi = device-dpi 用了之后虽然 webview的分辨率==实际窗体的分辨率

但是整个html以及js交互超级卡??这是为什么?

target-density据说不推荐用,那android端的替代方案是什么?

阿神
阿神

闭关修行中......

全員に返信(5)
刘奇

こんにちは、ホスト:

最初の質問: 画面適応の問題

リーリー

通常、HTML ヘッダー情報にこのようなメタを追加すると、CSS がサポートしている場合に画面に適応させる効果が得られます。

2 番目の問題: HTML と JS の間の相互作用が Android でスタックします。

Android 4.4 の正式バージョン (多くの国内携帯電話メーカーは Google のバージョンに準拠していません) では、依然として Webview カーネルが使用されています WebKit このカーネルのパフォーマンスは新しいカーネルのパフォーマンスと同じです。 (Chromium) それに比べればまだ貧弱です。ただし、一般的に言えば、ハードウェア アクセラレーションをオンにするとわずかに改善されます。

リーリー

注: Android ハードウェア アクセラレーションを有効にする方法はいくつかあります。ここをクリックしてください

3 番目の問題: 解決策:

  • 作者が純粋な Web アプリを開発したい場合は、新しい携帯電話を使用してください。正式な Android 4.4 以降、カーネル Chromium のパフォーマンスが向上しました。

  • Android の下位バージョンをサポートしたい場合は、cordova + Crosswalk を試すことができます。詳細はこちら (追記: Crosswalk にも欠点があります)

いいねを押す +0
左手右手慢动作

この設定により、ロードされた HTML に画面を適応させることができます
settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);

いいねを押す +0
迷茫

スタイルを記述するには rem を使用します

いいねを押す +0
Peter_Zhu

<meta name="viewport" content="width=device-width、initial-scale=1" />

いいねを押す +0
刘奇

これを使用して何を制限しますか?

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート