What I want is to take a filled rectangle and punch a hole in it using another shape. This is exactly the kind of thing that NSBezierPath
is designed for. You add a rectangular path, then add the subpath that will "punch" through it and finally fill it. In my case the subpath is actually text. No problem, works great:
Except when I use Helvetica Neue Bold for my font. When I use that, I just end up with a solid blue rectangle without any text at all. But the subpath is indeed drawing--in fact, if I shrink the filled rectangle a bit, you can actually see some of the text path:
I get the same behavior with Helvetica Neue Italic. Helvetica Neue Medium works fine, as does Helvetica Bold, Times New Roman Bold and Arial Bold.
I've tried using both NSEvenOddWindingRule
and NSNonZeroWindingRule
. (EDIT: Apparently I didn't really try NSEvenOddWinding
rule, because that does turn out to work after all)
This is the code that I'm using inside the drawRect
method of my NSView
subclass.
NSLayoutManager *layoutManger = [[[NSLayoutManager alloc] init] autorelease];
NSTextContainer *textContainer = [[[NSTextContainer alloc]
initWithContainerSize:NSMakeSize(300, 100)] autorelease];
NSFont *font = [NSFont fontWithName:@"Helvetica Neue Bold" size:100];
NSDictionary *textAttribs = [NSDictionary dictionaryWithObjectsAndKeys:
font, NSFontAttributeName, nil];
NSTextStorage *textStorage = [[[NSTextStorage alloc] initWithString:@"Hello"
attributes:textAttribs] autorelease];
[layoutManger addTextContainer:textContainer];
[layoutManger setTextStorage:textStorage];
NSRange glyphRange = [layoutManger glyphRangeForTextContainer:textContainer];
NSGlyph glyphArray[glyphRange.length];
NSUInteger glyphCount = [layoutManger getGlyphs:glyphArray range:glyphRange];
NSBezierPath *path = [NSBezierPath bezierPathWithRect:NSMakeRect(0, 0, 200, 100)];
[path appendBezierPathWithGlyphs:glyphArray count:glyphCount inFont:font];
[[NSColor blueColor] setFill];
[path fill];
So what's going on here? Why do some fonts behave differently than others when it comes to adding glyphs to a path?
EDIT: The solution is to use NSEvenOddWindingRule
. After the creation of path
add this line:
[path setWindingRule:NSEvenOddWindingRule];
Peter Hosey's answer provides the explanation of why this is.
It's probably to do with the directions of the paths in the fonts. One font may use clockwise paths; another may use counterclockwise paths.
A more reliable way to achieve the effect you're after would be to simply fill the rectangle, and then draw the text out of it with the graphics context's compositing mode set to NSCompositeSourceOut
. You can wrap the fill and text-draw in a transparency layer using Core Graphics if you want to cut the text only out of the fill.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With