Hello Worldから世界は始まる

鳥よし

2010.04.22

Web制作

昨日は、プロジェクト作成の際のテンプレート選びに触れました。
本日は新しい言語を始める際に、僕が100%行う通過儀式　「Hello world」出力を行おうと思います。
(弊社HPのトップページも「Hello World」ですし・・・)

初めてのプロジェクトなので仕様は簡単に、ボタンを押下したら「Hello World」という文字が出力されるというものにします。

まずはUIを実装します。
UIの実装には2つの方法があります。　一つはInterface Builderというツールを使用してGUIで画面を組み立てていく方法。
そしてもう一つはソースコードに直接記述していく方法。

僕の場合、どちらがやりやすいのかがわからない状態だったので、最初の2作品はソースコードに直接記述、現在開発中の3作品目はInterface Builderを使用しています。　

今回は、Interface Builderを使用してみたいと思います。
まず、テンプレートはwindow-based Applicationを選択します。(プロジェクト名は「SuperToriyoshi」としました。ふざけ過ぎですね。)

Xcodeが立ち上がったら、まずは「MainWindow.xib」を開きます。(自動的にInterface Builderが起動します。)

上の画像のように、パーツをペタペタ配置していくイメージです。
(中央にラベルを配置し、hidden設定にしました。下部にボタンを配置しました。)

画像の配置が終わったら、次はソースコードを記述します。

C言語は拡張子が「h」と「m」のファイルがペアになって使われるそうです。
拡張子が「h」のファイルはヘッダファイル、「m」のファイルがメソッドファイルと呼ばれます。

ヘッダファイルは、その機能の画面とメソッドファイルとの出入り口(インターフェース)と、使用する材料を記述する・・・と、言うイメージでいいのか・・・な。
メソッドファイルは、その機能の振る舞いを記述する部分になります。

テンプレート選択でwindow-based Applicationにした場合、自動でプロジェクト名+「AppDelegate」と言う名称で「h」と「m」の二つのファイルが作成されます。

早速、ヘッダーファイルに記述を始めてみます。

#import 

@interface SuperToriyoshiAppDelegate : NSObject  {
    UIWindow *window;
	UILabel *label;
	UIButton *button;
}

@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) IBOutlet UILabel *label;
@property (nonatomic, retain) IBOutlet UIButton *button;

-(IBAction)buttonPush;

@end

何を記述したかをざっと説明すると、先ほどInterface Builderにより、一つのラベルとボタンを配置したので、それに対応する項目を記述と、ボタン押下をした時の実行メソッド名を記述しました。　ソースコードに「IBOutlet」と記述したのですが、これを宣言する事により、Interface Builderで作成したパーツと関連づける事ができます。

次にメソッドファイルの記述です。

#import "SuperToriyoshiAppDelegate.h"

@implementation SuperToriyoshiAppDelegate

@synthesize window;
@synthesize label;
@synthesize button;


- (void)applicationDidFinishLaunching:(UIApplication *)application {    

    // Override point for customization after application launch
    [window makeKeyAndVisible];
}

-(IBAction)buttonPush {
	
	// ラベルに「Hello World」文字列設定
	label.text = @"Hello World";
	
	// ラベルがhidden設定されている場合は解除
	if (label.hidden == YES) {
		[label setHidden:NO];
	}
	
}

- (void)dealloc {
    [window release];
	[button release];
	[label release];
    [super dealloc];
}

@end

何を記述したのかというと、ただ単にボタンが押されたときの動きとして、空のラベルに「Hello World」という文字列を設定して、
そのラベル部分がhidden状態（見えない状態）なら解除する。と、言うだけです。

最後に、Interface Builderに戻って、先ほど配置した部品とソースの関連づけを以下のイメージで行います。