2011年2月22日火曜日

Cocoa ObjC NSGradient

NSBezierPathの中身をグラディーションで描画してみる。

まずはxcatsan師匠教えの通りにやってみる。

実験用プロジェクトをつくり、Viewに単純な四角を黒でぬりつぶす。

NSRect rect=NSMakeRect(100, 100, 100, 200);
NSBezierPath* path = [NSBezierPath bezierPathWithRoundedRect:rect xRadius:2 yRadius:2];
[[NSColor colorWithDeviceRed:0.0 green:0.0 blue:0.0 alpha:1.0] set];
[path fill];
これで次のようになる。

この四角をグラデーションで塗りつぶす。

NSArray* colorArray = [NSArray arrayWithObjects:
         [NSColor colorWithDeviceWhite:1.0 alpha:1.0],
         [NSColor colorWithDeviceWhite:0.8 alpha:1.0],
         [NSColor colorWithDeviceWhite:0.4 alpha:1.0],
         [NSColor colorWithDeviceWhite:0.1 alpha:1.0],
         [NSColor colorWithDeviceWhite:0.0 alpha:1.0],
         nil];
NSGradient* gradient = [[NSGradient alloc] initWithColors:colorArray];
[gradient drawInBezierPath:path angle:270];



これは5階調もつけてしまった例。こんなにたくさん階調をつけなくてもそれらしくなる、ということが実験でわかったので、あとあと3階調に減らしている。しかし、簡単だなあ。NSColorの配列を渡してinitするだけでいいのか。drawInBezierPathしているけど、drawInRectの方が単純でいいのかな。

5階調のまま半透明なウィンドウ&Viewの上に描画してみる。


これを3階調に減らしてみる。


なるほど、これならすぐにSpinに組み込んでも大丈夫だろうということで、SpinのSpacesViewの描画部分に入れてみる。


現在activeなWorkspaceだけalphaが1.0でくどいので、alphaを落としてみる。


さらにグレイから黒へのグラデーションでに変更。


Spinへの組み込みはこんな感じのソースにしてある。
-(NSArray *)setColorArray:(BOOL)state{
 float alha;
 
 if (state==YES) alha=0.8;
 else alha=0.5;
  
  NSArray* colorArray = [NSArray arrayWithObjects:
          [NSColor colorWithDeviceWhite:0.4 alpha:alha],
          [NSColor colorWithDeviceWhite:0.1 alpha:alha],
          [NSColor colorWithDeviceWhite:0.0 alpha:alha],
          nil];
 return colorArray;
 
}
- (void)drawRect:(NSRect)dirtyRect {
NSBezierPath* path = [NSBezierPath bezierPathWithRoundedRect:[self bounds] xRadius:5 yRadius:5];
 NSArray* colorArray;
 if ([self active]==YES) {
  colorArray = [self setColorArray:YES];  
 }
 else{
  colorArray = [self setColorArray:NO]; 
 }
 
 NSGradient* gradient = [[NSGradient alloc] initWithColors:colorArray];
 [gradient drawInBezierPath:path angle:270];
}
見て目についてはもう少し研究したい。

0 件のコメント:

コメントを投稿