iPhone(iOS)アプリ画面と画面遷移の作成方法【第10回】

business, internet, mass media, people and technology concept - close up of male hands holding smartphone and pointing finger to web pages screen

iPhone(iOS)アプリ画面と画面遷移の作成方法
ビジネスパーソンのためのプログラミング講座【第10回】


簡単なアプリなら構造を理解していなくても開発は可能ですが
iOSアプリの構造を知っておくと、より一歩進んだアプリを開発することができます。
では、iOSアプリの画面や画面遷移はどのような構造になっているのでしょうか?
そこで今回はiPhone(iOS)アプリ画面と画面遷移の作成方法についてご説明いたします☆



■iPhone(iOS)の画面の構造とは
iPhone(iOS)アプリの画面は基本、「ビュー(ボタンなどユーザーが目にする部品)」の集まりと、
それらビューの動きを制御する「ビューコントローラー」で構成されています。
この「ビュー」と「ビューコントローラー」が合わさった1つの画面のことを、シーン(scene)と呼ぶので覚えておきましょう。



■iPhone(iOS)の画面遷移にはどのような種類があるのか
画面遷移とは、ある画面から別の画面に移る(=遷移する)ことを指します。
単に画面が移るだけでなく、別の画面の上に重ねて表示すること複数の画面を切り替えることも画面遷移としてカウントされます。
iPhone(iOS)の画面遷移には以下の種類があります。

・モーダル(Modal)
画面の上に新たに画面を重ねていく遷移方法です。
重ねられた画面は新たに開いた画面(一番上の画面)を閉じるまで操作することができません。
一番上の操作できる画面のことをモーダルビューと言います。

・ポップオーバー(Popover)
画面の上に小さな画面を重ねて表示する遷移方法です。
機能的にはモーダルと同じで、主にiPadで使用されます。

・ナビゲーション(Navigation)
階層構造(親子)のあるデータを詳細画面に掘り下げていく遷移方法で、ドリルダウンと呼ばれることもあります。
テーブルビューとセットで使用することが多いのが特徴です。

・スプリット(Split)
画面を二つの領域にわけて表示する遷移方法です。
左側の項目を選択すると右側のページが切り替わります。
iPadでナビゲーションの代わりに使用することが多く、横向き(Landscape)と縦向き(Portrait)で表示が変わります。
ちなみに縦向きの時は右側の画面のみ表示され左側の画面はポップオーバーで表示されます。

・タブ(Tab)
iPhone使用者には一番馴染み深い、画面下部に表示されているタブバーのアイコンをタップすることで画面を切り替える遷移方法で、
軽快に画面を切り替えられるという特徴があります。

・ページめくり
ページをめくって画面を移動する方法で、電子書籍などでよく使用されています。



■iPhone(iOS)の画面と画面遷移の作成方法
アプリができる背景にはユーザーの要望や開発者の意向が反映されます。
アプリの画面をどのように決めるかは、まず「どこで誰が使うのか」「どんな目的で使うのか」など、
アプリが使われる状況を洗い出します。

次にアプリに必要な機能をまとめ、それらの機能をユーザーの使い勝手と端末の特性に合わせて、
どのように見せるか決めてプログラムしていきます。

アプリは「機能を見せる」「機能をつなげる」「機能を実現する」の3要素に分けてプログラムしていきますが、
画面と画面遷移の実装(作成)には、「機能を見せる」「機能をつなげる」の2つが関わってきます。

機能を見せる」とはラベル、ボタン、テキスト入力など画面を構成するための部品を組み合わせて実装することで、
機能をつなげる」とはビュー同士の動きの連携や画面遷移など、アプリの流れに関わるまとまった機能部分を実装することです。

これらの機能はXcode内のUIView と UIViewController を使用し作成します。



■まとめ
いかがだったでしょうか。
まずは簡単でシンプルな画面から初めて、徐々にいろいろ実装していく方法をおすすめします。




次回ビジネスパーソンのためのプログラミング講座【第11回】ではプログラミングでは何ができるのか?についてご紹介していきたいとおもいます。
>プログラミング豆知識 記事一覧へ


投稿日: 2016年10月26日

前後の記事

気になることは何でもお気軽にお問合せください。

0120-188-024 受付時間 平日9:00~19:00