iOS開発における画面作成方法
初級者向けに浅く広く話をするために書いたものです。
画面作成においては手段が選べる分エンジニアとしてのこだわりが出るところでもあると思います。ですが、宗教戦争をする気はありませんのでそこは流してもらえると助かります😆笑
画面作成の種類は3つ
Storyboard（すとーりーぼーど）
xib（にぶ、しぶ、えっくすあいびー）
Code（こーど）
Storyboardの特徴
XMLをGUI化したもの
GOOD
- 直感的に作れる
- アプリの構造を把握しやすい
- プロトタイプレベルであれば早く作れる
- コンポーネントの細かい設定とかもできる
BAD
- ファイルを開く時すごく重たい
- コンフリクトが起きやすい
- コンポーネントに設定されている制約がわかりづらい
- ファイル操作が多く時間がかかる
- 標準以外のアニメーション設定ができない
- ガチガチの制約がついている画面つらい
xibの特徴
XMLをGUI化したもの（nibはバイナリをGUI化したもの）
GOOD
- 直感的に作れる
- アプリの共通部品を作る時に便利
BAD
- コンポーネントに設定されている制約がわかりづらい
- 呼び方で悩む
- 標準以外のアニメーション設定ができない
nib ⇨ NeXTStep Interface Builder
xib ⇨ Xcode Interface Builder
NSxxxx ⇨ NeXTStep
1996年12月にNeXTStepをAppleが買収
Jobsが2000年にCEO就任
Codeの特徴
コードそのもの
GOOD
- コンポーネントへの設定が可視化されていてわかりやすい
- Viewの一生を知ることができる
- コンフリクトが起きにくい（起きたとしても解消しやすい）
- 仕様変更に対応しやすい
- アニメーション設定ができる
BAD
- アプリの構造を把握しにくい
- スピード感以て画面全部をCodeで書ける人が少ない
- 書く量が以外と多い
ざっくりと役割分担させるとこんな感じ
Storyboard - 大枠を担う
- アプリ全体の構造がわかる程度に使う
- 画面単位、機能単位でファイルを分ける
- コンポーネントの細かい設定はしない
- 静的なものは書いてOK
- SegueはDe**h（画面遷移はCodeで書こう）
xib - 中間パーツを担う
- 共通で使うパーツがある時に使う
- コンポーネントの細かい設定はしない
- 静的なものは書いてOK
Code - 細かいところ、遷移、アニメーションを担う
- なかなか無いけど標準UIで済む画面やパーツは適してる
- 画面全体ではなく部分的に使う
- GUIでコンポーネントの設定を書かない代わりに実行ファイルで書く
- 画面遷移を書く
中には、Storyboardに慣れずStoryboardが嫌いな人もいます
私はswiftが参上してからiOS開発を始めた人間なので、Storyboardが一枚もないプロジェクトに出くわす頻度の方が格段に低いんです
ですが過去に2度、すべてCodeで書かれているアプリがありました
その時はすごく大変でしたが、画面生成の仕組みが理解できたのでやって良かったなと今は思います
やってみるとすごく難しいけれど、慣れて来ると楽しいしわかりやすいし仕様変更にも対応しやすいしわかりやすいしわかりやすいしわかりやすいし...ですw
チームでの画面実装あるある
事象
Storyboardにあるコンポーネントの色を変えたがシミュレーターで見ても色が変わってくれない、なぜだ
回答
色を定義する場所をチームで話し合っていなかったのでCodeで上書きされており色が変わらなかった
解説
GUIで設定されている値がViewの初期値(loadView)になります
その後、実行ファイルへ処理が流れます
つまり、GUIで設定されている色指定の後に実行ファイルの色指定がされているため上書きされていたのです(´∀｀=)ｱﾙｱﾙ
クソダサ画面、xibでやるか？Codeでやるか？
繰り返す仕様変更、何度でもxibにcommitする
......笑
言いたかっただけです
noteでの役割はここまで
下記にXcodeの歴史を軽くまとめました
iOSのバージョンとXcodeのバージョンに関連性があるように、macOSのバージョンとXcodeのバージョンにも関連性があります
「関連性がある」と知っておくことが大事です
Xcodeをアップデートしようと思ったら、macOSを先にアップデートしなきゃいけなかった(´∀｀=)なんて人もいます👈昔の私w
[付録] Xcodeの歴史（Store公開から）
リリース自体は2003年から
Storyboardが使えるようになったのはXcode4.2から
Apple公式のIDEツール
アプリアイコンはずっと同じっぽい
最後に
こんにちは
今回はiOS開発における画面作成方法について書いてみました。
毎週土曜日オンラインにてアプリ開発の勉強会を実施しているので、興味のある方は是非参加してみてください！
※この記事は2019/05/11に投稿されたものを修正して投稿しています
この記事が気に入ったらサポートをしてみませんか？