画像のヒストグラムを表示させる(その1)

Cocoaプロジェクトの作成

グレースケールの画像は各画素ごとに0から255の数値で色の濃さを決めています。

0が黒で255が白です。

この分布がある画像でどうなっているかを知ることは、二値化処理の際などで役に立ちます。

そこで、選択した画像のヒストグラムを表示させるプログラムを作ります。

ちょっとたいへんですが勉強になること間違いないでしょう。

ここでは、XCodeとOpenCVを使います(Windowsのかたには申し訳ないです…ただOpenCVの部分はwindowsでも使えます)。

OpenCVやXCodeをインストールしていないかたはインストールしましょう。

>>OpenCVのインストールに記事

では始めます。

プロジェクトの作成と設定

Xcodeよりプロジェクトを作ります。

プロジェクト名をつけて、保存します。 ここではImageProという名前にしました。

次に、OpenCVを使えるようにリンクを追加します。

Build Phasesに libopencv_core.2.4.2.dylib libopencv_highgui.2.4.2.dylib libopencv_imgproc.2.4.2.dylib を追加します。

次に、includeの設定もしておきます。

最後に、ヘッダーにopencvをincludeします。

あとは実行してみましょう(Run)。設定がうまくいっていれば実行できるはずです。

画像を選択して表示する

では、二値化するために画像を読み込むところまで作りましょう。

画面設定

ヒストグラムの結果を表示する画面を作ります。

まず、インターフェースに画面を貼ります。画面にCustom Viewをはって整えてください。

次に、Custom View用のクラスをFile->New->File..からObjective-C.classとして作成します。

この際、Class名をView、Subclass ofをNSViewとします。

あとは、クラスとCustom Viewをつなげます。

画面設計場面で、設置したCustom Viewを選択して、Custom Class をViewにします。

コードを書く

では、Custom Viewをクリックした際のコードを書きます。 まず、AppDelegate.hとView.hに

#include "opencv/cv.h"
#include "opencv/highgui.h"

を追加して、OpenCVを使えるようにします。

次に、AppDelegate.mに

@implementation AppDelegate
- (void)applicationDidFinishLaunching:(NSNotification *)aNotification
{
// Insert code here to initialize your application
cvNamedWindow("window",1);  //ウインドウを表示

}
-(NSApplicationTerminateReply)applicationShouldTerminate:(NSApplication *)app{
cvDestroyWindow("window");  //画像を消す
return NSTerminateNow;
}
@end

とコードします。

これによって、 はじめにプログラムを起動したらウインドウを開き プログラムが終わったらウインドウを閉じます。

次に、View.mファイルを開き、以下のようにコードしてください。

- (void)drawRect:(NSRect)dirtyRect
{
    // Drawing code here.
    [[NSColor colorWithDeviceRed:1.0 green:1.0 blue:1.0 alpha:1.0] set];
    NSRect rect = NSMakeRect(0, 0, 440, 320);//設定
    [NSBezierPath fillRect:rect];
    [[NSColor colorWithDeviceRed:0.0 green:0.0 blue:0.0 alpha:1.0] set];
    NSFrameRect(rect);
}

-(void)mouseUp:(NSEvent *)theEvent
{
    NSOpenPanel *openPanel=[NSOpenPanel openPanel];//許容ファイルの種類を設定
    NSArray *allowedFileTypes=[NSArray arrayWithObjects:@"png",@"PNG",nil];
    [openPanel setAllowedFileTypes:allowedFileTypes];//ダイアローグを開く
    NSInteger pressButton=[openPanel runModal];
    if(pressButton ==NSOKButton)
    {
        //OKボタンが押された場合
        NSURL * filePath=[openPanel URL];  //パスを取得
        NSString* fileName=[filePath path];//形式を変換
        const char* path=[fileName UTF8String];//形式を変換
        //画像を読み込む
        IplImage* image;
        IplImage* gray;
        image=cvLoadImage(path,CV_LOAD_IMAGE_ANYCOLOR);
        if(image!=NULL){
            //読み込めたら
            //大きさや色の深さを設定
            gray=cvCreateImage(cvGetSize(image),IPL_DEPTH_8U,1);
            //グレーへ変換
            cvCvtColor(image,gray,CV_BGR2GRAY);
            cvShowImage("window",gray);//画像を表示
            cvReleaseImage(&image);     //メモリの開放
            cvReleaseImage(&gray);
        }
    }

}

drawRectで、外枠黒で中が白の四角形を描写しています。

そして、mouseUpで、CustomViewがクリックされた際に、画像が開くようにコードしてあります。

詳しい内容は以下の記事を参考にしてください。

実行したら以下のように選択した画像が表示されます。

ヒストグラムはまだですが、とりあえずこのへんにしておきましょう。 次回、お楽しみに!

著者:安井 真人(やすい まさと)