iPadに同等のApple-Touch-Startup-Imageはありますか?
-
26-09-2019 - |
質問
Webアプリの場合、Apple-Touch-StartUp-Imageで起動画面を設定できます
iPadはどうですか?
解決
私も同じ問題を抱えていました...特定のサイズの1004*768を使用する必要があります。このブログで説明しました: http://www.amirnaor.com/?p=71
他のヒント
これにより、Webアプリにスプラッシュ画面が追加されます。以下は、iPadとiPhone/iPod Touchの両方に必要なサイズとiPhone 5です。これらには、ステータスバーエリアも含まれます。
<!-- iPhone -->
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-320x460.png"
media="(device-width: 320px) and (device-height: 480px)
and (-webkit-device-pixel-ratio: 1)"
rel="apple-touch-startup-image">
<!-- iPhone (Retina) -->
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-640x920.png"
media="(device-width: 320px) and (device-height: 480px)
and (-webkit-device-pixel-ratio: 2)"
rel="apple-touch-startup-image">
<!-- iPhone 5 -->
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-640x1096.png"
media="(device-width: 320px) and (device-height: 568px)
and (-webkit-device-pixel-ratio: 2)"
rel="apple-touch-startup-image">
<!-- iPad -->
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-768x1004.png"
media="(device-width: 768px) and (device-height: 1024px)
and (orientation: portrait)
and (-webkit-device-pixel-ratio: 1)"
rel="apple-touch-startup-image">
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-748x1024.png"
media="(device-width: 768px) and (device-height: 1024px)
and (orientation: landscape)
and (-webkit-device-pixel-ratio: 1)"
rel="apple-touch-startup-image">
<!-- iPad (Retina) -->
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-1536x2008.png"
media="(device-width: 768px) and (device-height: 1024px)
and (orientation: portrait)
and (-webkit-device-pixel-ratio: 2)"
rel="apple-touch-startup-image">
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-1496x2048.png"
media="(device-width: 768px) and (device-height: 1024px)
and (orientation: landscape)
and (-webkit-device-pixel-ratio: 2)"
rel="apple-touch-startup-image">
iPad互換性のWebアプリを作成する場合は、ランドスケープとポートレートサイズの両方を使用することをお勧めします。
ポートレート画像は768x1004である必要があります(注:1004、1024ではなく、20pxはステータスバー用)、PNGは優先ファイル形式です。
ランドスケープ画像は1024x748である必要があります(注:748、再びステータスバーの場合は20px)。この画像はそうする必要があります 時計回りに90度回転しました, 、最終結果は748x1024です。
ヘッダーのリンクタグは次のようにする必要があります。
<link rel="apple-touch-startup-image" href="images/splash_screen_768x1004.png" media="(device-width: 768px) and (orientation: portrait)" />
<link rel="apple-touch-startup-image" href="images/splash_screen_1024x748.png" media="(device-width: 768px) and (orientation: landscape)" />
新しいRetina iPadの場合(これらを追加しない場合、上記をピクセルダブルで使用します):
<link rel="apple-touch-startup-image"
href="images/splash_screen_1536x2008.png"
media="(device-width: 1536px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" />
<link rel="apple-touch-startup-image"
href="images/splash_screen_2048x1496.png"
media="(device-width: 1536px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" />
これを投稿した時点での以前の回答(受け入れられた回答を含む)これは、私のテストでは機能しませんでした。
Madhupは、目的Cで書かれ、Xcodeでコンパイルされたネイティブアプリを指していると思います。 OPは、Safariを介してHomescreenに追加されるWebAppsで機能させようとしています。これまでのところ機能していません:(
748x1024の寸法でPNG画像を作成することで、スタートアップイメージのみが機能しました。これは、ファームウェア3.2.1のiPadでテストされました。
私が見つけることができるこの問題の最良の説明: https://gist.github.com/472519
iPhone用のスタートアップ画像とiPad用のランドスケープ/ポートレートの両方を提供したら、それは私のために機能したことに注意してください。
今日の私のテストから、iPadはApple-Touch-Startup-Imageをサポートしていないようです。 iPhoneがOS 3.1でこれをサポートしており、iPadがそうではないことは非常に残念です。また、Chromeless BrowserでWebAppを使用する場合、ビューポートは適切に設定されていません。 iPad OS 3.2のバグまたは脱落は両方だと思います。あまりにも悪い:(私はAppleフォーラムでそれを求めました: https://devforums.apple.com/thread/47178
iPhoneと同じです。名前のpngを入れます Default.png
リソースフォルダー。