CoreGraphics 図形を描画する
さてCoreGraphicsを使って, 図形をします。 CoreGraphicsの設定や前知識は, CoreGraphics 基礎 よりどうぞ。
drawRectを実装しましょう。
- (void)drawRect:(CGRect)rect { }
CGRectを引数にとります。これは描画する領域です。initWithFrame のところでサイズを決めたそのサイズが入っています。
そのサイズはこんな感じで取り出せます。こちらでも少し書いています。CGRect, CGPoint, CGSize
サイズ
rect.size.width // width rect.size.height // height
サイズは, 図形の座標なんかを決める上では重要ですね。
描画
描画の開始ですが, まずはContextが必要です
CGContextRef context = UIGraphicsGetCurrentContext();
このあたりのことは, Quartz 2D drawing destination
でAppleさんが解説してくれています。
ちなみにどうでもいいですが, Mac Cocoa だとこうなります。
CGContextRef context = [[NSGraphicsContext currentContext] graphicsPort];
色
CGContextSetRGBFillColor(CGContextRef context, float r, float g, float b, float a); rgbaは 0.0〜1.0です
CGContextSetRGBStrokeColor(CGContextRef context, float r, float g, float b, float a);
Fillは塗りつぶし色, Strokeは線の色です, RGBで指定します。
描画
塗りつぶしRect
CGRect r1 = CGRectMake(50.0 , 50.0, 100.0, 100.0); CGContextAddRect(context,r1); CGContextFillPath(context);
サイズをつくり, contextに追加してFillPathで塗りつぶしを作ります。
FillPathするとAddした情報はなくなります。
線Rect
CGRect r2 = CGRectMake(100.0 , 100.0, 100.0, 100.0); CGContextAddRect(context,r2); CGContextStrokePath(context);
StrokePathは線分描画です。こちらも呼び出すとAdd情報はクリアされます。
コード全体
- (void)drawRect:(CGRect)rect { // Drawing code CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSetRGBFillColor(context, 1.0, 0.5, 0.0, 1.0); // Fill color CGContextSetRGBStrokeColor(context, 1.0, 0.0, 0.5, 1.0); // Stroke color CGContextSetLineWidth(context, 10.0); // Line width CGRect r1 = CGRectMake(50.0 , 50.0, 100.0, 100.0); // Size CGContextAddRect(context,r1); CGContextFillPath(context); CGRect r2 = CGRectMake(100.0 , 100.0, 100.0, 100.0); CGContextAddRect(context,r2); CGContextStrokePath(context); CGContextSetRGBStrokeColor(context, 1.0, 1.0, 0.5, 1.0); CGContextAddEllipseInRect( context, CGRectMake(150.0 , 150.0, 100.0, 100.0)); CGContextStrokePath(context); CGContextSetRGBStrokeColor(context, 0.0, 0.0, 1.0, 1.0); CGContextMoveToPoint(context, 30, 30); CGContextAddLineToPoint(context, 150, 350); CGContextStrokePath(context); }
参考にさせていただきました。ちなみに、
(MAC Cocoa)
CGContextRef context = [[NSGraphicsContext currentContext] graphicsPort];
はOSX 10.10からは
CGContextRef context = [[NSGraphicsContext currentContext] CGContext];
になりました。