[XCODE] iPhoneで図形を描く前準備(GraphicsContext)

今日はiPhoneのQuartz2Dで図形を描く前準備となる、GraphicsContextの作り方を学んだので、ブログに残しておきたいと思います。

いつもに増してニッチな内容ですね。Quartz2Dについては、”iPhoneで図形を描く。Quartz 2Dの初歩(@YoheiM.NET)”もご参照ください。

GraphicsContextとは

GraphicsContextはQuartz2Dで図形を描く為に利用するものです。CGContextRefという型で参照します。線を引いたり、四角を書いたりする時の関数の引数に毎回指定する必要がある、重要なオブジェクトです。

CGContextRefの作り方

作り方サンプルソースコードです。

- (CGContextRef)MyCreateBitmapContext:(int)pixelsWidth height:(int)pixelsHeight {
  CGContextRefmyContext = NULL;
  CGColorSpaceRefcolorSpace; // 色の指定方法を決めるもの。RGBやCMYKなどあり。
  void *bitmapData; // データを保持するメモリエリア。
  intbitmapByteCount;
  intbitmapBytesPerRow;

  bitmapBytesPerRow= pixelsWidth * 4;
  bitmapByteCount= bitmapBytesPerRow * pixelsHeight;
  colorSpace= CGColorSpaceCreateDeviceRGB();
  bitmapData= malloc(bitmapByteCount);
  if (bitmapData == NULL) {
    NSLog(@"必要なメモリ領域を確保出来ませんでした。残念無念。");
    return NULL;
  }

  // ここがContextを生成している部分。いろんな引数があります。
  myContext = CGBitmapContextCreate(
    bitmapData,  // 利用するメモリ領域
    pixelsWidth,   // 作成するContextの横幅
    pixelsHeight,  // 作成するContextの縦幅
    8, // bits per component
    bitmapBytesPerRow, // 1行あたりのバイト数
    colorSpace,  // 色の指定方法
    kCGImageAlphaPremultipliedLast // 透明度の指定方法
  );

  if (myContext == NULL) {
    free(bitmapData);
    NSLog(@"Context作成に失敗しました。あーあ。");
    return NULL;
  }

  CGColorSpaceRelease(colorSpace);

  return myContext;
}

CGBitmapContextCreateという関数でContextを作成します。引数がたくさんあり色々な情報を設定出来ます。

GraphicsContextを利用する例

上で作成したContextを利用した例も記載しておきたいと思います。こんな感じで、使います。例では四角形を2つ作成します。

- (void)drawShapes {
  self.context = [self 
    MyCreateBitmapContext:self.bounds.size.width 
                   height:self.bounds.size.height];

  CGRect myRect1 = CGRectMake(0, 0, 200, 100);
  CGRect myRect2 = CGRectMake(0, 0, 100, 200);

  // draw
  CGContextSetRGBFillColor(context, 1, 0, 0, 0.7);
  CGContextFillRect(context, myRect1);
  CGContextSetRGBFillColor(context, 0, 1, 0, 0.7);
  CGContextFillRect(context, myRect2);
  [self setNeedsDisplay];
}

- (void)drawRect:(CGRect)rect {
  CGImageRef image = CGBitmapContextCreateImage(context);
  CGContextRef currentContext = UIGraphicsGetCurrentContext();
  CGContextDrawImage(currentContext, CGRectMake(0, 0, 200, 200), image);
}

CGContextSetRGBFillColorで赤、緑、青、透明度を0.0～1.0の値で指定します。

CGContextFillRectは指定された範囲(CGRect)に四角形を描画します。

他にもCGContextから始まる関数がいっぱいあり、用途に合わせた描画が出来るようです。

[self setNeedsDisplay]を実行し、図形をUIView上に描画するように指示を出します。

drawRect:メソッドでは、四角形2つが描画されたイメージ(CGImageRef)を取得して、描画します。ここではUIGraphicsのContextを利用するんだよなぁ～。他にもやり方ありそうですが、今はこれしか分からないzzz。残念。

最後に

Quartz2DのGraphicsContextが作成出来ればあとは、いろんな図形を描画してみるのみ(*´∇｀*)色々な図形を使えるようになれれば良いなぁ。