絶対に挫折しないiPhoneアプリ開発入門Part.9 ~Table View Controller その4、numberOfSectionsInTableView、numberOfRowsInSection、Xcodeの背景を黒に~

前回:絶対に挫折しないiPhoneアプリ開発入門Part.8 ~Table View Controller その3、ナビゲーションバーにタイトルと色をつける~



さて、コードを書く前に、Xcodeの背景や文字色の変え方をお教えします。

背景が黒のほうが目にやさしいというか、長時間白いの見とくのがつらい人にはオススメです。

いろいろかわいい色もあるので、試してみてください。

  1. Xcode」から「Preferences」を開きます。
  1. 「Fonts & Colors」を開きます。

ぼくは「Dusk」がお気に入りです^^



お気に入りのコーディング環境ができたところで、やっちゃいますか!

完成イメージ図はこんな感じ。

タブの画像については最後の方でやります^^


たったこれだけのことなんですが、意外にポイントが詰まってます。




まず、リストでtextを表示するのには

配列

を使います。


リストに画像を挿入するコードに関しては、原始的にif文をひとつひとつやることにします。
(今回はわかりやすさ重視のため、コードのコンパクト化よりも、コードが理解しやすいものでやります。)


わかりやすくするため、色分けをして解説しますね^^

  • 赤色:dataMain1
  • 青色:dataDetail1
  • 緑色:imageView
  • 茶色:DisclosureIndicator

では、使用する変数配列のdataMain1dataDetail1をヘッダーファイル(.h)に宣言しておきましょう。

(変数の名前は正直なんでもいいです。わかりやすいようにしてください。konobuloguyondekuretearigatouでもいいです笑)

SpotViewController.h

#import <UIKit/UIKit.h>

@interface SpotViewController : UITableViewController{
    NSArray *dataMain1;
    NSArray *dataDetail1;
}

@end

てな感じです。

これで「使う箱を用意した」というイメージです。

「NS」は「NextStep」のなごりで、「Array」は「列」ですね。


配列ではよく箱にデータを入れていくイメージが出されます。


ちなみにコーディング状況はこんな感じ。


mファイルを実装していきます。

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.navigationController.navigationBar.tintColor = [UIColor brownColor];
    self.tableView.rowHeight = 90.0;
    //self.navigationItem.prompt = @"ようこそ";
    self.navigationItem.title = @"ひよしまる";
    dataMain1 = [[NSArray alloc] initWithObjects:@"日吉商店街",@"日吉キャンパス",@"日吉駅時刻表",@"ひよしまるについて",nil];
    dataDetail1 = [[NSArray alloc] initWithObjects:@"普通部通り,日吉中央通り,浜銀通り,サンロード",@"学生食堂,メディアセンター,ITC,生協,男子トイレ情報",@"東急電鉄ホームページへ",@"管理人、副管理人あいさつ、株式会社RobinShip", nil];
}


「配列って何よ〜?」とかいろいろ疑問な方もいるかもしれませんが、
よくわからないまま進んでみることをオススメします笑

なぜなら、すべてを厳密に理解しようとするとつまづく可能性が高いからです。


「こうやって書けば、こうなるんだ〜」っていうのからまずは入り、
後で理論などを詰めていけばいいと思います。


ノリとしましては、

「NSArrayの居場所を確保して(alloc)、日吉商店街とか日吉キャンパスみたいなもんを(Objects)をinit(初期化)しよう!!!」

って感じです笑

「init」って深く考えると多分難しいので、なんとなくこんなノリで行きましょう笑

つぎつぎ!!!笑





下の方にスクロールしていきますと、

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

こんなのを発見します。


名前から分かるように

「ここでセクションの数を決めてくださいね〜」

ということです。

セクションというのはこんなやつです。


SpotViewControllerでは、セクションの数は一個です。

0個はアリエンティなので(ありえない)ので注意してください。一個以上です。

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{

    // Return the number of sections.(=セクションの数を決めてくださいねということ)
    return 1;
}

ところで、

#warning Potentially incomplete method implementation.

こんな警告があると思うんですが、これは、

ファイルを新規作成すると、ここはもともと不完全な実装になってるから、コードを書くときにはきちんとここを編集するよう注意してね!!!

という意味です。

はっきり言って毎回出てくるので邪魔くさいです笑

容赦なく消してください。




さて、この下にはこんなのがありますね。

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section


これも名前から推測できますように、

セクションの中(InSection)で、何列(numberOfRows)用意しますか?

という意味です。


ここで数字を書いても良いのですが、配列のなかの要素数を数えてもらうようにします。

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{

    // Return the number of rows in the section.
    return  dataMain1.count;
}

今回の場合、dataMain1の中身は、

  • 「日吉商店街」
  • 「日吉キャンパス」
  • 日吉駅時刻表」
  • 「ひよしまるについて」

です。

ということは、4つの要素がありますよね。

ですから、

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{

    // Return the number of rows in the section.
    return  4;
}


と書いてもかまいません。


…しかーーーーーーーし!!!!!!!


実際の数字を書く(return 4;)と書くのではなく、

return dataMain1.count;

と書くことを強くおすすめします




それはたとえば、このdataMain1に「日吉探検隊」の項目も入れたいとしましょう。

すなわち、後々にこのように追加する場合です。

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.navigationController.navigationBar.tintColor = [UIColor brownColor];
    self.tableView.rowHeight = 90.0;
    //self.navigationItem.prompt = @"ようこそ";
    self.navigationItem.title = @"ひよしまる";
    dataMain1 = [[NSArray alloc] initWithObjects:@"日吉商店街",@"日吉キャンパス",@"日吉探検隊",@"日吉駅時刻表",@"ひよしまるについて",nil];
    dataDetail1 = [[NSArray alloc] initWithObjects:@"普通部通り,日吉中央通り,浜銀通り,サンロード",@"学生食堂,メディアセンター,ITC,生協,男子トイレ情報",@"東急電鉄ホームページへ",@"管理人、副管理人あいさつ、株式会社RobinShip", nil];
}

return dataMain1.count; だと、

dataMain1の中身がそのままセクションの中身の列の数になるので、編集する必要がありません。(自動的に列の中身が5だと判断してくれるということです


しかし、

return 4; にしてしまうと、

return 5; という風に書き直さなくてはならなくなるのです。




プログラミングで大事な要素のうちのひとつに、

変化に対応しやすいプログラム

が挙げられると思います。



return 数字; にしてしまうと、修正するとき2重の手間がかかってしまうので、ビミョーな感じです。

もちろんコードとしては間違ってないんですが、

return dataMain1.count;

のほうが変更に強いので、より良いと言えます。


次回:絶対に挫折しないiPhoneアプリ開発入門Part.10 ~Table View Controller その5、cellForRowAtIndexPath~



======================
当ブログ管理人のツイッターこちら
◎フォローしてくださると泣いて喜びます!ツイッター上で当ブログの質問などにもできるだけお答えしますし、役に立つiPhoneアプリ開発情報もつぶやきます。個人的なご依頼(たとえば、プログラミングの家庭教師、Skypeレッスンをしてくれないか、iPhoneアプリ開発の勉強会ってやってるの、とかですね)でもかまいません。
スカイプレッスンについて
開発をしているとその都度ぶつかる問題があると思いますが、検索で調べてもなかなかわからない、あるいは調べても非常に時間がかかる場合があると思います。開発者のみなさんもお忙しいと思いますので、私のレッスンを受けながら開発を進めていただけると、大幅にお時間を短縮できます。加えて、iPhoneアプリ開発の基礎、応用が身につき、今後の開発もスムーズに進められます

お問い合わせはツイッター、またはhiyoshimarukoアットマークgmail.comまでお願いします。(アットマークを@にしてください)お待ちしております!



【絶対に挫折しないiPhoneアプリ開発入門】
番外編 絶対に挫折しないiPhoneアプリ開発入門 番外編1 プログラミング初心者が初めてアプリ開発に挑戦する時
1.絶対に挫折しないiPhoneアプリ開発入門Part.1 ~Xcode4.2でひよしまるを作ろう~
2.絶対に挫折しないiPhoneアプリ開発入門Part.2 ~iOS Developer Programに参加しよう~
3.絶対に挫折しないiPhoneアプリ開発入門Part.3 ~Xcode4.2の起動、InterfaceBuilderの利点欠点、神本紹介~
4.絶対に挫折しないiPhoneアプリ開発入門Part.4 ~Single ViewControllerからスタート~
5.絶対に挫折しないiPhoneアプリ開発入門Part.5 ~画面遷移、Tab Bar Controller,Navigation Controller,Table View Controller~
6.絶対に挫折しないiPhoneアプリ開発入門Part.6 ~UITableViewController その1、Tabの名前変更~
7.絶対に挫折しないiPhoneアプリ開発入門Part.7~Table View Controller その2(ファイルの接続)、Objective C、コメントについて~
8.絶対に挫折しないiPhoneアプリ開発入門Part.8 ~Table View Controller その3、ナビゲーションバーにタイトルと色をつける~
9.絶対に挫折しないiPhoneアプリ開発入門Part.9 ~Table View Controller その4、numberOfSectionsInTableView、numberOfRowsInSection、Xcodeの背景を黒に~
10.絶対に挫折しないiPhoneアプリ開発入門Part.10 ~Table View Controller その5、cellForRowAtIndexPath~
11.絶対に挫折しないiPhoneアプリ開発入門Part.11 ~Table View Controller その6、画面遷移、didSelectRowAtIndexPath、タブバーを消す、アニメーション~
12.絶対に挫折しないiPhoneアプリ開発入門Part.12 ~Table View Controller その7、セクションを使いこなすその1、セルの矢印を表示~
13.絶対に挫折しないiPhoneアプリ開発入門Part.13 ~Table View Controller その8、セクションを使いこなすその2、画面遷移~
14.絶対に挫折しないiPhoneアプリ開発入門Part.14 ~UIWebView、webページを表示する~
15.絶対に挫折しないiPhoneアプリ開発入門Part.15 ~UITextView、電話とリンクをText Viewで表示~
16.絶対に挫折しないiPhoneアプリ開発入門Part.16 ~Table View Controller その9、テーブルを画面遷移させない、App Store申請Reject~