4

私は webapp を開発し、viewport 要素を使用してさまざまなデバイスにアプリを適合させることに成功しました。たとえばiPhoneでは、これを使用しました：

<meta name="viewport" content="width=685,user-scalable=0" />

私の Web アプリケーションは、iPhone Safari ブラウザーのこのビューポートで問題なく表示されます。したがって、PhoneGap を使用して Web アプリを AppStore アプリとしてラップするのは簡単だと思いました。しかし、これまでのところ、そうする運がありませんでした。viewport タグは完全に無視されているようです。

ここに私の質問があります: Viewport タグは、PhoneGap で特定の幅 (上記の例のように) でまったく機能しますか? それとも、すべてをレスポンシブ Web デザインに作り直す必要がありますか?

4

4 に答える 4

3

私は数時間同じものと戦ってきました。phonegapの最後のバージョンでは、次のように管理しました：

メインの Java で、super.loadUrl(blablabla) の前に次の行を追加します。

    super.init(); 
    super.appView.getSettings().setUseWideViewPort(true);
    super.appView.getSettings().setLoadWithOverviewMode(true);

これにより、ユーザーは「ダブルタップ」してズームイン/ズームアウトすることができます。したがって、これでメタを変更します：

<meta name="viewport" content="width=685; target-density-dpi=device-dpi ; initial-scale=0.1; maximum-scale=0.1; user-scalable=no;" />

Phonegap 3.0、および Android >= 4 で動作しました

于 2013-08-27T02:04:12.437 に答える
0

これを試して-

 < meta name="viewport" content="width=device-width; user-scalable=yes; initial-scale=0.1; maximum-scale=5; minimum-scale=0.5" />
于 2014-01-06T13:57:09.597 に答える
0

これをhtmlのヘッダーに追加してみてください

<META NAME="viewport" CONTENT="width=device-width, initial-scale=1, user-scalable=no"/>

そしてこれをconfig.xmlに：

<preference name="EnableViewportScale" value="true" />
于 2014-01-06T11:37:20.767 に答える
0

次のようなメタ タグを使用して、幅をデバイスの幅に自動的に設定します。

<META NAME="viewport" CONTENT="width=device-width, initial-scale=1, user-scalable=no"/>

それが役立つことを願っています。

于 2013-05-22T13:22:26.760 に答える