目的
カスタムUIViewの内容部を独自に描画する方法を理解する。

主要クラス
UIView

使用テンプレートプロジェクト
Window-based Application

プロジェクトの名称
Draw

事前に体験しておくべきドリル

サンプル実装説明


 このドリルではカスタムUIViewの内容部を独自に描画する。
 カスタムUIViewの作り方と、画面への組み込み方法はドリル画面へのタッチを検出する(1)を参照。
カスタムUIViewの名称
DrawView

 カスタムUIViewで内容部を独自に描画するには以下のメソッドを実装する。
- (void)drawRect:(CGRect)rect;

 このメソッドはUIViewテンプレートを指定して作った時点ですでに用意されているので、あとは実際に何かを描けばよい。
 まずは、ビューの横に10ピクセル、縦に50ピクセル内側に入った矩形を青色で塗りつぶす。
self.boundsと書く事は[self bounds]と書いたのと同じ扱いになる。これはObjective-Cのドット構文であり、C/C++の構造体要素へのアクセスではないことに注意。

- (void)drawRect:(CGRect)rect {
// 塗りつぶす色を青色に設定。
[[UIColor blueColor] setFill];
// ビューの横に10ピクセル、縦に50ピクセル内側に入った矩形で塗りつぶす。
UIRectFill(CGRectInset(self.bounds, 10, 50));
}

カスタムUIViewであるDrawViewを画面に出すため、DrawAppDelegateクラスのapplicationDidFinishLaunchingメソッドではドリル画面へのタッチを検出する(1)同様、適当な位置に背景色を緑色に設定している。
- (void)applicationDidFinishLaunching:(UIApplication *)application {
DrawView* view = [[DrawView alloc]
initWithFrame:CGRectMake(100, 100, 200, 200)];
view.backgroundColor = [UIColor greenColor];

[window addSubview:view];
[window makeKeyAndVisible];
}

 実行すると、以下のような表示となる。

$テン・シー・シー-2

プロジェクト

検討

UIRectFrame

 の他にも
UIRectFrame

 があり、こちらは矩形の枠を描く。
 色を設定するにはUIColorクラスのsetStrokeメッセージを使う。
 また、文字列にはNSStringのUIKit拡張メッセージであるdrawAtPoint:withFont:を使う。
 色を設定するにはUIColorクラスのsetメッセージ。
 このように、よく使う機能はUIKitによって簡単に使えるようになっているが、もう少し細かい作業(ベジェ曲線描画)をしようとすると、CGContextRefを利用する必要がある。
 これは別のドリルで。