コメント
コメントの投稿
※名前とタイトルが入力されていないコメントでは他のコメントとの区別ができません。
入力されていないコメントには返信しませんのであらかじめご了承くださいませ。
iOSのスプラッシュスクリーンを作成する方法 -LaunchScreen.storyboard- | Xamarin.iOS
- 2017/11/08
- 18:02
今回はiOSでスプラッシュスクリーンを手軽に実現できる LaunchScreen.storyboardファイルの作成方法をご紹介いたします。
Androidでの方法を知りたい方は以前の記事「Androidでスプラッシュスクリーンを表示する方法」をご参考ください。
前提条件
・Windows10 Pro 64Bit
・Visual Studio 2015 Community Update3
・Xamarin 4.7.9.45 (NuGet Xamarin.Forms 2.4.0.282)
・macOS Sierra 10.12.6 / Xcode 9 / Xamarin.iOS 11.0.0.0
１．ファイルを作成
（１）iOSプロジェクト内にファイルを新規追加します。Apple>iOS>空のStoryboard を選択します。
（２）ビルドアクションを InterfaceDefinition に設定します。
選択肢に InterfaceDefinition が存在しない場合は、VisualStudio を終了してiOSプロジェクトファイルをメモ帳などで編集してしまいましょう。
AppName.iOS.csproj
<ItemGroup>
<InterfaceDefinition Include="Resources\LaunchScreen.storyboard">
<SubType>Designer</SubType>
</InterfaceDefinition>
</ItemGroup>
ビルドアクションはビルド自体には関係ありませんが、AppStoreのアップロード時にエラーで進めなくなります。
ERROR ITMS-90705: "Launch storyboard not found. Make sure you specify the launch storyboard filename without a filename extension for the key UILauchStoryboardName in the Info.plist."
２．背景を設定
Windows.Formsのデザイナと同じ感覚で設定が可能です。（１）ViewControllerを画面に配置します。
（２）プロパティ画面を開き、Background に色を設定します。
※Tint には文字色を設定します。
３．画像を設定
画面の中央に画像を表示するように設定します。（１）ImageViewをViewControllerの中心に配置します。
（２）Image にリソースファイルの画像を選択します。
さらに Content Mode : Center に設定しましょう。
（３）ImageViewはクリックする度にモードが切り替わります。
以下の図のように２度クリックすると枠線上のマークが「○」から「T」に変わりますので、右クリックでAspect Ratioを設定します。
（４）同じモードで４辺の「T」記号をマウスでつまんでViewControllerの端までドラッグすると以下の図のように線が表示されます。（Constraintも同時に生成されます）
中央に設定するのは少しコツのいる作業ですので、最初は戸惑うかもしれません。
４．起動画面を設定
Info.plist を iOSマニフェストエディタで開き、起動画面に作成したファイルを設定します。※iOSマニフェストエディタで編集するとMinimumOSVersionやコメント等、自動で削除される項目がありますので、ご注意ください。
直接XMLエディタで編集する場合は以下のように記述します。
info.plist
<plist version="1.0">
<dict>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
</dict>
</plist>
尚、今回ご紹介しましたStoryboardの作成方法にて以下のデバイスで動作確認しました。
iOS11 : iPhoneX iPhone8
iOS10 : iPhone7 iPhone6
※動作しない（黒い画面が表示される）場合は一度キャッシュ(bin/obj/mtbs)をクリアしてみると良いでしょう。
最後までお読みいただきありがとうございます。
当ブログの内容をまとめた Xamarin逆引きメニュー は以下のURLからご覧になれます。
https://itblog.dynaspo.com/blog-entry-81.html
- 関連記事
-
- iPhone / iPad のディスプレイサイズを取得する方法 -iOS端末識別方法- | Xamarin.Forms
- サポートされるアーキテクチャについて | Xamarin.iOS
- iOSのスプラッシュスクリーンを作成する方法 -LaunchScreen.storyboard- | Xamarin.iOS
- Java.Lang.ClassNotFoundException: Didn't find class android.support.graphics.drawable.VectorDrawableCompat が発生しAndroidアプリがクラッシュする原因について | Xamarin.Forms
- アプリを iPhone X に対応させる方法 | Xamarin.Forms
サポートされるアーキテクチャについて | Xamarin.iOS ホーム
Java.Lang.ClassNotFoundException: Didn't find class android.support.graphics.drawable.VectorDrawableCompat が発生しAndroidアプリがクラッシュする原因について | Xamarin.Forms
