SwiftによるiOSアプリ開発基本講座

iOS 8の起動画面を設定する

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
自作のアプリに起動画面を用意して、アップルが推奨する形で起動の処理が行われるようにする方法を紹介します。
講師:
07:37

字幕

このレッスンでは、自作のアプリに起動画面を用意してApple の推奨する形で起動の処理が行われるようにする方法を説明します。まずはこのシミュレータの画面を使って説明したいと思います。このシミュレータにはですね、Debug から SlowAnimations というのが選択できるようになっていますので、こちらを選択して一度シミュレータを起動し直します。そしてもう一度シミュレータを起動します。シミュレータを起動しなおしました。そうするとこのシミュレータがSlow モードで起動されますので、アプリケーションのアイコンをクリックして、そして起動画面を表示したときにちょっと起動画面を表示する間隔が長くなります。ではカレンダーを起動してみましょう。これをタップして開きます。そうするとアプリケーションの起動画面になにもテキストなどが表示されない何もない状態が続いたあと、実際の最初の画面が読み込まれて表示されるようになっていることがわかります。それではこれでHome ボタンを押してホームに戻ってですね、例えばマップを表示してみましょう。マップもこのようになにもテキストが表示されない状態がしばらく続いた上でコンテンツがこのように表示されるようになっています。 そしてこうして一度起動してしまったアプリケーションは、例え Home ボタンをおしてバックグラウンドにこれが映ったとしても直前のスナップショットが撮られるようになっていますので、例えばですね、Cmd+Shift+H のキーをダブルプッシュしてやってこのように切り替え画面を出してですねやっても、ここにまずそのスナップショットが表示されるようになっています。それでは Xcode で自作のアプリに起動画面を設定していく方法を説明していきたいと思います。今回はこちらのフォトビューアのアプリに対して起動画面を設定してみたいと思います。では一度アプリケーションを 実行して、どのように 実行されるのかということをためしておきましょう。実行ボタンをおしてシミュレータ上で最初の画面が肝心なので、最初の画面がどうなっているかということを確認します。いま起動しました。ゆっくりのモードなのでこのようにじっくりと表示されましたけど、最初の画面では上に Photosというテキストが表示されて、そして下の方にBlue Sky とか Chess とかこういうのが表示されるようになっています。重要なのは最初の画面です。Apple が推奨する起動画面というのは、まずアプリケーションが一番最初に表示する画面をテキストを除いたものにするということになっています。 なぜテキストを除いた状態のものを用意するかと言いますと、これはもう一番わかりやすく言えばローカライズの手間を省くためです。ここに例えばですね いまPhotosと表示されていますけど、ここを日本語にしたりとか中国語にしたりとか他の言葉を用意したりというのは、かなりの手間がかかってしまいますし現実的な処理ではありません。なので起動画面を用意する時には、この一番最初の画面からテキストを除いたものを用意するというのが起動画面の用意の仕方になっています。それでは起動画面をどのように用意すればいいのかということですが、起動画面はXcode の中にあるLaunchScreen.xibというこちらのファイルを編集することでつくっていきます。以前は起動画面は画像を用意して作っていたんですが、現在は iPhone 4s5 6 6Plus といろんなサイズのデバイスがありますので、全部のデバイスの大きさに対応してその画像を作っていたんじゃたまったもんじゃないということで、もうこの LaunchScreen.xib を編集する形に現在は変わっています。この PhotoViewer とその下に自分の名前がはいったコピーライトが表示されるラベルがまず最初に用意されていますが、こちらをとってしまいましょう。 Delete キーを押して両方とも削除します。そしてまず ここに NavigationBar を配置しましょう。Navigation Bar が一番上に置いてありますね。そしてこちらのタイトルをダブルクリックして消しておきます。テキストはすべて消して下さい。それからその下にTable View を配置します。Table View もドラックアンドドロップでこの画面の真ん中のところに配置します。このように配置しました。このような簡単なアプリケーションのビュー構成であれば、Editor からResolve AutoLayout Issuesそしてこの下のところにAll Views in ViewこのカテゴリのReset to SuggestedConstraints を実行することによって、もう問題のない制約を配置することができますので、こちらを今回は利用しましょう。そしてこれで起動画面が用意できました。では実行してみましょう。アプリケーションを実行して確かめてみます。そうするとこれが起動画面ですね。ちょっと上のところが上寄りにNavigation Bar が上寄りになっていて、この Navigation Bar が現れた時にちょっと下にずれることがわかります。 もう一度やってみましょうか。実行してここにいまNavigation Bar のラインがありますけども、これが最初の画面に表示されたときにちょっと下にいきます。これを修正するために、じっくりとここをですねいじっていってもいいんですが、それよりもここのビューをですね一旦削除してしまって、ここの Navigation Barプラス Table View というのはここにですねその組み合わせに関してはもうあらかじめ作り込んだNavigation Controllerというこのビューのためのオブジェクトが用意されていますので、こちらをドラックアンドドロップして追加して、そしてこのうえのところを削除してやれば、テキストですねテキストを削除してやれば、これだけで動くようになります。ただしいまの状態ではエラーが表示されていますけども、これはここにセルが用意されているので起きているので、このセルを一回Delete キーを押して消してやります。そうするとエラーがなくなりますので、これで実行して結果を確かめてみましょう。そして実行するとこのように NavigationBar が上の方に表示されます。テキストは表示されていません。 Photos の最初の画面がこのようにじわーっとこの上にやってきました。これが基本の起動画面の用意の仕方になります。起動画面を用意する時に必ず読んでいただきたいのがApple が用意しているこちらのHuman InterfaceGuideline という文章です。こちらは Apple がオンラインで無料で公開していますので、apple higというふうに検索していただきますと、すぐに出てきますがその中の Icon andImage Design のLaunch Imagesを見ていただきますと、起動画面をこういうふうに作りなさいと全部書かれています。簡単にいうとテキストを表示せずにものすごいシンプルな起動画面を用意してくださいというのがApple の推奨するところです。このレッスンでは自作のアプリに起動画面を用意する方法を紹介しました。

SwiftによるiOSアプリ開発基本講座

このコースではiPhoneやiPadのアプリを作ってみたい方に向けて、簡単なiOSアプリを作りながらSwiftを使ったXcodeでの開発手順をひとつずつ丁寧に解説していきます。各レッスンではiOSのフレームワークの機能を確認しながら、アウトレットやアクション、MVCモデルやDelegateといったアプリ開発に必要な知識を説明します。

5時間10分 (53 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2015年10月15日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。