Cocoaでいこう! Macらしく 第29回
Yoshiki(DreamField)
この記事は、MOSAが発行するデベロッパ向けのデジタルマガジンMOSADeN 第90号(2003年11月25日発行)に掲載された記事です。2〜3ヶ月遅れで、ここに掲載して行きます。

自分で画像を表示してみよう(後編)

前回の続きで、MyImageViewを実装して行きます。いつもの様に、TinyView.pbproj(もしくはTinyView.xcode)を開いて下さい。

イメージの表示を行うのですから、イメージを所有する必要があります。そこで、まずはそのためのインスタンス変数を宣言します。MyImageView.hを開いて下さい。そして次の様に、NSImageクラスのインスタンスのポインタを格納するインスタンス変数を宣言して下さい。

@interface MyImageView : NSView {
    NSImage *image;
}
@end

宣言したインスタンス変数に値をセットするメソッドが必要になります。そこで、次のメソッドを実装して下さい。

- (void)setImage:(NSImage *)newImage{
    image = newImage;
    [ image retain];
}

imageに引数の値をセットします。そして、これを所有するために、retainメッセージを送っています。

さて、所有したイメージは、最終的には自分で解放しなければなりません。そこで、次のメソッドを実装して下さい。

- (void)dealloc{
    [ image release];
    [ super dealloc];
}

deallocに関しては、第14回で説明しましたね。自分自身が解放される時に呼び出されるメソッドです。つまり、自分が解放されるタイミングでimageも解放するというわけです。

それではいよいよ「Drawing code here.」というコメントが書いてあったdrawRect:を実装します。NSImageのリファレンスを見てください。色々な描画方法がありますが、今回は最も単純なcomposite系で描画することにします。composite系は出来ることは限られていますが、それだけ他の影響を受けにくく、とても扱いやすいメソッドと言えます。それでは実装してみましょう。

- (void)drawRect:(NSRect)rect {
    [ image compositeToPoint:NSZeroPoint operation:NSCompositeSourceOver];
}

これだけです。NSZeroPointは、大域変数として用意されている原点を表す定数です。つまり、原点から描画するように指示しています。NSCompositeSourceOverは、イメージが不透明な部分はイメージを描画し、それ以外の部分は背景のままという指定です。

これでMyImageViewクラスの実装は終わりましたが、これをMyDocument.nibに反映させなければなりません。Resourcesの中のMyDocument.nibをダブルクリックして、InterfaceBuilderで開いて下さい。開いたらXcode(もしくはProject Builder)に一度戻って、MyImageView.hをInterfaceBuilderのnibファイルウィンドウにドラッグ&ドロップして下さい(fig.01)。

[fig.01] MyImageView.hをInterfaceBuilderにドラッグ&ドロップ

するとMyImageView.hがInterfaceBuilderに読み込まれ、InterfaceBuilderでMyImageViewクラスを使えるようになります(fig.02)。

[fig.02] MyImageViewクラスが読み込まれる

この操作は、「Classes」メニューの「Read Files...」からファイルを直接指定することでも行えます(fig.03)。

[fig.03] 同様の操作は、ClassesメニューのReadFiles...からでも行える

この場合は、あらかじめnibファイルウィンドウを、Classesタブを選んで、クラスの表示に切り替えておく必要があります。

MyImageViewクラスが使えるようになったら、これをCustomViewに反映させます。デザインウィンドウでCustomViewを選んで下さい。選んだら、「Tools」メニューから「Show Info」を選び、Infoウィンドウを表示させます(fig.04)。

[fig.04] CustomViewを選んでInfoウィンドウを表示

表示させたら、ポップアップボタンでCustom Classに表示を切り替えて下さい(fig.05)。

[fig.05] Custom Classの表示に切り替え

するとNSViewが選択されているはずです。これをMyImageViewに変更して下さい(fig.06)。

[fig.06] CustomViewのクラスをNSViewからMyImageViewに変更する

これでCustomViewはMyImageViewクラスになりました。それでは、これを保存し、Xcode(もしくはProjectBuilder)に戻ってビルドして実行し、適当な画像ファイルを開いてみて下さい。CustomViewの部分に画像が表示されたと思います。ただし、今までと違って枠に合わせて自動的に縮小表示したりしませんから、大きい画像を開くと左下しか表示されませんし、ウィンドウサイズを縮めれば右上が隠れます(fig.07)。

[fig.07] ウィンドウを縮小すると右上が隠れる
(サンプル画像は、ゆきみだいふくさんのご好意により、使用させていただいています。)

それでは、次回は、これをスクロールさせて見れるようにします。

前頁目次次頁