Mac初心者のiPhoneアプリ開発記7 設定画面を作る

1

今回はツール系アプリなら装備しておきたい、いわゆる設定画面を作ります。今後アプリ開発を続けるなら、ここを避けて通ることは出来ないでしょう。

私が最初に作るアプリはiPhone Screenshot MakerのiOS版にしようと考えていますが、基本機能であるカメラロールから画像を選びUIImageで合成後に保存。この流れでテストは成功しました。

さて次は設定画面。よく見る普通の設定画面って一体どうやって作ればよいの? ここから長い道のりとなりました。

スポンサーリンク

 

ストーリーボード

この連載では今まであまりストーリーボードには触れてこなかったが、設定画面の作り方をググると、その重要性がわかってくる。例えばドットインストールのiOSレッスンでは、ほぼストーリーボードのみを扱っている。ちなみにドットインストールは全部見ても1時間くらいなのでサクッと見ておく。選択式のアドベンチャーゲームならストーリーボードだけで開発できそう。

2

そんなわけで画面遷移はストリートボードのNavigation Contorollerでできそうと分かる。では肝心の設定画面はどう作る?自力でボタンやラベルを配置するのだろうか?

iOSプログラミング入門 (全24回) - プログラミングならドットインストール

 

設定画面はTable View Controllerで

3

結論的に多くのアプリで採用されている設定画面のUIはTable View Controllerだと分かる。Table View Controllerを使えば、項目を動的に増やすことができて、スクロール処理も自動でやってくれる。これがしたかった。早速ストーリーボードとテーブルビューに挑もう。

 

これから勉強する人へ

ストーリーボードで画面を追加するまではGUIで簡単だが、例えば、変数を画面間で受け渡ししたいなど、ちょっとした事でグンと難易度が上がるので挑戦しよう。ソースファイルには最初から、ある程度ひな形が記述された状態なので、必要に応じて削除したり追加する形のプログラミングスタイル。例えばセルの数は、最初から用意されたnumberOfRowsInSectionメソッド内に設定するなど。

 

今回大変お世話になったページ

Storyboardから始めるiPhoneアプリ開発 設定画面の作り方(1)〜概要〜

ProgrammingLife.jp: Storyboardでテーブルビューのセルをカスタマイズする (iOS)

この2つのページに沿って学習すれば理解できる。素晴らしい。

 

Static Cellsでテーブルビューを楽に設計できる

iOS5から導入されたUITableViewのStatic Cellsを使えば楽に設計できる事も分かった。それまでは動的にソースからセルを作る必要があったが、今はストーリーボードからGUIで楽に作れますよという機能。 最初はこれで設計しましたが、後々、自由にセルを作りたくなりそうだったので、Static Cellsを使うのは止めました。 Static Cellsについて参考になったページ。

Static Cells で楽々UITableViewプログラミング - 職業プログラマの休日出勤

 

今回ハマったポイント

UINavigationBarのtitleの変更方法
ngi_ConfigDetailTitle.title = str_ConfigDetailTitle;
↓
ngi_ConfigDetailTitle.topItem.title = str_ConfigDetailTitle;
XcodeやiOSのバージョンにより教材と異なった点

・View Controller の Identifier → Storyboard ID

[self presentModalViewController:VC animated:YES];
↓
[self presentViewController:VC animated:YES completion: nil];
[self dismissModalViewControllerAnimated:YES];
↓
[self dismissViewControllerAnimated:YES completion:NULL];

 

注目ポイント

NSUserDefaults

画面間でのデータの受け渡し方法全般。NSUserDefaultsの存在を知る。非常に大事

とても参考になったサイト!→画面間でのデータの受け渡しに付いて: 永遠ログ

項目選択画面へ遷移する時のエフェクトを変更
VC.modalTransitionStyle = UIModalTransitionStyleCrossDissolve;
UIModalTransitionStyleCoverVerticalデフォルト。下から上にスライド。
UIModalTransitionStyleCrossDissolveフェードアウト、フェードイン。
UIModalTransitionStyleFlipHorizontal水平方向に画面が回転。

 

まとめ

今回、なぜかストーリーボードで紐付けができなくなったり、didSelectRowAtIndexPathが効かなくなったりして数時間悩んだが、プロジェクトを作りなおすとあっさり直った。私のミスの可能性もありますが、どうも動作がおかしい時などは試す価値があります。

 

この連載の一覧

  1. Mac初心者のiPhoneアプリ開発記

    この記事は先日購入したMacBook Air(略してMBA)でiPhoneアプリ 続きを読む

  2. Mac初心者のiPhoneアプリ開発記2 Xcodeの闇の中で

    iPhoneアプリ開発するぞ!と意気込んでMBAを購入したのは1年前。でもAnd 続きを読む

  3. Mac初心者のiPhoneアプリ開発記3 Objective-Cの壁

    手探りで進めているiPhoneアプリ開発記。前回は@ITの記事を参考に、Xcod 続きを読む

  4. Mac初心者のiPhoneアプリ開発記4 Objective-Cの復讐

    前回から10日もたってしまい、ほとんど忘れてる状態からの再開です。今回も引き続き 続きを読む

  5. Mac初心者のiPhoneアプリ開発記5 因縁のTwitterビューア

    今回は難しくて挫折していた「iOS 4のSDKで、Twitterを使ったiPho 続きを読む

  6. Mac初心者のiPhoneアプリ開発記6 画像処理はじめました

    前回から随分時間が経ってしまいました。iPhoneアプリ市場は激戦なので、果たし 続きを読む

  7. Mac初心者のiPhoneアプリ開発記7 設定画面を作る

    今回はツール系アプリなら装備しておきたい、いわゆる設定画面を作ります。今後アプリ 続きを読む

  8. iOSの進化とフラットデザイン

    iKuracさんが作成したiOSの比較画像。先日発表されたiOS7のデザインの路 続きを読む

  9. Mac初心者のiPhoneアプリ開発記8 設定画面を動的に作る

    前回は設定画面を作るためにストーリーボードやTableViewの仕組みを勉強しま 続きを読む

  10. Mac初心者のiPhoneアプリ開発記9 アプリ申請までの道

    ようやく!初のiPhoneアプリ申請までたどり着きました。名前は『Screens 続きを読む

  11. Mac初心者のiPhoneアプリ開発記 リリース後の反応

    実は先日8/9に『Screenshot Maker Pro』がリリースしました。 続きを読む

  12. 大人センスなiPhone壁紙『A new world』

    NYで活躍中のドイツ人デザイナーTobias van Schneiderさんの作 続きを読む

  13. ReynoldsさんのiPhone壁紙

    渋い色調のポリゴン地形がお洒落。Timothy J. Reynoldsさんの作品 続きを読む

  14. シンプルの美学アンソニーさんのiPhone壁紙

    Anthony Zinonosさんの壁紙。青と黒、シンプルに色分けされた海上にオ 続きを読む

  15. iPhoneアプリ開発記 iOS7対応で必要だったこと

    公開中のiPhoneアプリ『Screenshot Maker Pro』をiOS7 続きを読む

  16. Cocos2d-xでiPhone&Androidアプリ開発記1

    そろそろ次のアプリ開発と日々考えていたんですが、私は個人開発なので今後は小粒なゲ 続きを読む

  17. Cocos2d-xでiPhone&Androidアプリ開発記2 バージョン3.x系挫折

    『ドラゴンクエストモンスターズ スーパーライト』がCocos2d-xで開発とのこ 続きを読む

  18. Cocos2d-xでiPhone&Androidアプリ開発記3 初心者TIPS

    今回で3回目のCocos2d-x連載。自作アプリを製作中ですが7割ほど完成してき 続きを読む

  19. Cocos2d-xでiPhone&Androidアプリ開発記4 AdMobメディエーションでAdMob+iAd iOS編

    Cocos2dxで広告を表示するにはiOSとAndroid別々に設定が必要です。 続きを読む

  20. Cocos2d-xでiPhone&Androidアプリ開発記5 AdMob Android編

    iOSに続きAndroidにAdmodを導入します。とりあえずAdModだけ表示 続きを読む

  21. Cocos2d-xでiPhone&Androidアプリ開発記6 Android対応

    Androidアプリ開発経験は全くない状態で始めたCocos2dx。ここまでの開 続きを読む

  22. Cocos2d-xでiPhone&Androidアプリ開発記7 ローカライズとアイコン組み込み

    ようやく初めてのcocos2dxアプリが完成しました! アルファベットを組み合わ 続きを読む

  23. Cocos2d-xでiPhone&Androidアプリ開発記8 開発の流れとアプリ申請

    Cocos2d-xで初めてのアプリを公開しました。AndroidとiPhone両 続きを読む

  24. Cocos2d-xでiPhone&Androidアプリ開発記9 SQLiteの注意点

    Cocos2d-xからSQLiteを使うには、iOSとAndroidそれぞれにラ 続きを読む

  25. Cocos2d-xでiPhone&Androidアプリ開発記10 アプリ高速化

    Cocos2d-xで2本目をリリースしました。前回の英語パズルの続編『英単語ギズ 続きを読む

  26. Cocos2d-xでiPhone&Androidアプリ開発記11 Androidのデバッグ

    Cocos2d-xによるアプリの新作をほぼ作り終えました。開発はXCode主体で 続きを読む

  27. iOS/Androidアプリ『英単語RPG ワード・オブ・ザ・リング』

    iPhone/Androidアプリ『英単語RPG ワード・オブ・ザ・リング』を公 続きを読む

  28. 人にも読めるQRコード

    人にも読めるQRコード『Human Readable Quick Respons 続きを読む

  29. Xcode7にiOS 8 Simulatorがインストールできない

    Xcode 7.0.1に、iOS 8.1 Simulatorをインストールしよう 続きを読む

 

 

 

スポンサーリンク