绘制粉笔风格的path

Posted by CoderLeonidas on August 19, 2019

绘制粉笔风格的path

很简单的,三步走,关键是用NSImage imageNamed:方法生成一个粉笔样的color。

  • S1: 准备一张粉笔纹理的图片,比如像这样的:

  • S2: 用这个图片生成一个颜色:
1
2
    NSImage *image = [NSImage imageNamed:@"chalk"];
    NSColor *color = [NSColor colorWithPatternImage:image];
  • S3: 用这个color去绘制path、string或者作为背景色等

demo代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
#import "ChalkView.h"

@implementation ChalkView

- (void)drawRect:(NSRect)dirtyRect {
    [super drawRect:dirtyRect];
    
    // Drawing code here.
    NSImage *image = [NSImage imageNamed:@"chalk"];
    NSColor *color = [NSColor colorWithPatternImage:image];

    [color set];
    [NSBezierPath setDefaultLineWidth:10];
    
    [NSBezierPath strokeLineFromPoint:NSZeroPoint toPoint:NSMakePoint(100, 100)];
    NSFont *font = [NSFont systemFontOfSize:50];
    NSDictionary *attr = @{NSForegroundColorAttributeName: color, NSFontAttributeName:font};
    
    [@"Hello Leonidas" drawInRect:dirtyRect withAttributes:attr];
}

@end

效果如下:


选择的粉笔风格纹理图片决定了最终粉笔风格的显示效果,所以找一张好一点的图片吧,或者用OpenGL制作一个

参考文章

Draw string with chalk effect (cocoa/cocoa touch)?