2010年11月19日 過去Blog
今回のチュートリアルでは、UITableViewを使って簡単なアプリケーションを構築します。 おなじみの”HelloWorld”を表示させるアプリです。 このチュートリアルでは、Objective-Cの基礎を習得済の方を想定しています。 今回学ぶこと:
  • Navigation-Based Applicationの新規作成
  • デフォルト状態で構成されてるファイル群について
  • “HelloWorld”を表示するため、UITableViewのセルの変更
このチュートリアルでは、既にiPhone SDKがインストールされ
Xcodeなどが利用出来る環境を想定しています。

Navigation-Based Applicationの新規作成

Xcodeを起動し、「新規プロジェクト」を選択します。 以下のようなウインドウが表示されたら、左ペイン内のiOS > Application が選択されているのを確認、「Navigation-Based Application」を選んで、「選択」ボタンを押す。(Use Core Data for storage  のチェックは不要。)

1-1 その後に表示されるプロジェクト名は「HelloWorld」として保存。

プロジェクト名は、自分で分かりやすい名前にすれば良いのですが、
「HelloWorld」以外で保存した場合は、デフォルト状態で作成される
ファイル群の名前も変わってきますので、適宜、読みかえてください。

デフォルト状態で構成されてるファイル群について

プロジェクト名を決定後、以下の画像のように、多くのファイルがプロジェクトに追加され、Xcode上に並んでいると思います。

1-2

これらのファイル群の中でも、今回、変更する必要があるファイルは、1つだけですので、心配する必要はありません。

以下、各ファイルについて簡単に説明します。

  1. CoreGraphics.framework, Foundation.framwork, UIKit.framework 名前をみれば、検討がつく方も多いかとは思いますが、他のプログラミング言語と同様、あらかじめ準備されているフレームワーク(関数ライブラリ)です。
  2. HelloWorld.app これが、iPhoneにインストールされるアプリです。
  3. HelloWorld_Prefix.pch コンパイル時にインクルードされるファイル?(詳細不明です。。。)
  4. HelloWorldAppDelegate.h 変数の定義が含まれているヘッダーファイルです。C、C++に類似。
  5. HelloWorldAppDelegate.m すべての魔法はこのファイルから始まります。実行のスタート地点。main.mファイルは、このオブジェクトを呼び出します。
  6. Info.plist このプログラムに関する様々なメタ情報を含んでいます。iPhoneなど実機でのテストをする時までは、特に編集する機会はないです。
  7. main.m 多くのプログラミング言語と同じように、このファイルからプログラムが実行されます。主な機能は、私たちのオブジェクトをインスタンス化し、プログラムを起動します。このファイルを編集する必要はありません。
  8. MainWindow.xib メインウインドウに表示される見た目を決める情報を含んでいます。このファイルをダブルクリックすると”Interface Builder”が起動します。このファイルは、コードを含みません。
  9. RootViewController.h, RootViewController.m メインウインドウに追加されているView Controller です。 Xcodeで「Navigation-Based Application」を選ぶとインターフェースの基本部分が追加されます。
  10. RootViewController.xib テーブルをエミュレートするために追加されたビューで、行や列をもっています。私たちは、これらの行のうちの1つに”HelloWorld”を表示させます。
まず、コードの編集をする前に、デフォルトの状態でビルド&実行してみましょう。 Xcode上の「ビルドと実行」ボタンを押すと、iPhoneシミュレータが起動し、以下の画像のような、空のテーブルが表示されると思います。

1-3

“HelloWorld”を表示するため、UITableViewのセルの変更

それではコードを変更していきましょう!
RootViewController.mを開き、編集していきましょう。これは、デフォルトでメインビューに追加されているビューコントローラです。Table View のスーパークラスからオーバーライドされています。 numberOfRowsInSection が定義されている箇所を探し、編集します。

// Customize the number of rows in the table view.

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

return 0;

}

numberOfRowsInSection この関数は、テーブルに「行」がいくつあるかをアプリケーションに通知します。デフォルトでは、これは「0」を返します。

以下のように編集します。

return 0;

return 1;

これで、このアプリケーションに、私たちのテーブルには、1行必要ということが通知され、以下の画像のように最初の1行目が選択できるようになります。

1-4

それでは、次に、cellForRowAtIndexPath が定義されている箇所を探し、編集します。先ほど編集した箇所のすぐ下側にあると思います。

// Customize the appearance of table view cells.

– (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @”Cell”;

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];

}

// Configure the cell.

return cell;

}

cellForRowAtIndexPath この関数は、テーブル内の各行ごとに1度呼ばれます。これは、特定の行に表示するコンテンツを定義する場所です。この関数は、指定されたセル(行)のオブジェクトを作成し、それを返します。

今回の場合は、”HelloWorld”という文字列を表示させたいので、以下のように編集します。斜体の箇所が追加したコードです。

// Customize the appearance of table view cells.

– (UITableViewCell *)tableView:(UITableView *)tableViewcellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @”Cell”;

UITableViewCell *cell = [tableViewdequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

cell = [[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefaultreuseIdentifier:CellIdentifier] autorelease];

}

// [cell setText:@”HelloWorld”];

//↑上記でも表示されますが、iPhone3.0以降、推奨されないようになっているので、以下に変更。

[cell.textLabel setText:@”HelloWorld”];

// Configure the cell.

return cell;

}

ifブロックのなかで、すでにセルが作成されていないかをチェックし、作成されていなければ、作成し、もしくは、既に作られているセルを利用します。

このおかげで、関数が呼ばれるたびに新しいセルが作成されるを防ぎます。

上記の通り、変更後、ビルドして実行すると以下の画像のように「HelloWorld」という1行が表示されると思います。

以上で、今回のテーブルの出来上がりです。

1-5

この投稿へのコメント

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます。
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

ピックアップ記事

サーバの負荷(メモリ使用量を調べる)sar -r

2010年03月31日 過去Blog
sarコマンドを利用するために必要なシステムをインストール # yum install -y sysstat phpでデータを抜き出す $pp = popen('/usr/bin/sar -r 1 1', 'r'); while(!feof($pp)): var_dump(fgets($pp)); endwhile; pclose($pp); $pp = popen('/usr/bin/…
「サーバの負荷(メモリ使用量を調べる)sar -r」をはてなブックマークに追加

テーブルの背景を設定する

2010年12月14日 過去Blog
iPhoneアプリに設置されているテーブルの背景色を変更する方法です。 //テーブルの背景色 self.view.backgroundColor = [UIColor groupTableViewBackgroundColor]; 文字列の設定と同様に、以下のような記述も可能です。 self.view.backgroundColor = [UIColor colorWithRed:0.0 gre…
「テーブルの背景を設定する」をはてなブックマークに追加

MODx vs Drupal ?

2009年11月18日 過去Blog
今まで何度もCMSのMODxを使う事があったので、使い慣れているのもあり、なかなかお気にいりのCMSなのですが、最近少し気になるのがdrupal・・・・ MODx同様、日本では、情報も少なく、あまり浸透もしてないようですが、一度インストールして使ってみようかなぁ。。。…
「MODx vs Drupal ?」をはてなブックマークに追加

html、CSS テキストの自動折り返しを禁止する

2010年04月16日 過去Blog
<strong>white-space</strong> normal 標準 (初期値) nowrap 自動的な折り返しを禁止する prozac and alcohol…
「html、CSS テキストの自動折り返しを禁止する」をはてなブックマークに追加

iPhone用のアイコンなどを配布しているサイト

2011年01月27日 過去Blog
以下のサイトによくまとめられているので、参考に。 http://phpjavascriptroom.com/?t=mobile&p=iphoneandroidmockup#a_iphone_icon 高画質のiconがダウンロード出来るサイト http://www.iconspedia.com/ iconのサイズや設置方法について https://developer.apple.…
「iPhone用のアイコンなどを配布しているサイト」をはてなブックマークに追加
© graffiti on the web . All rights reserved. WordPress Theme by comfy