Sunday, October 11, 2009

iPhone dev Stupidity 75: melt at corner


Use CGGradient in linear mode, once for each side. But for this to work, I think I'd need to set up a trapezoidal clipping area for each side first, so that the gradients would be mitered at the corners.

Using NSBezierPath to create the trapezoidal regions would be fairly straightforward, and you would only have to perform four drawing operations.

Here's the basic code for creating the left side trapezoidal region:
NSRect outer = [self bounds];
NSPoint outerPoint[4];
outerPoint
[0] = NSMakePoint(0, 0);
outerPoint
[1] = NSMakePoint(0, outer.size.height);
outerPoint
[2] = NSMakePoint(outer.size.width, outer.size.height);
outerPoint
[3] = NSMakePoint(outer.size.width, 0);

NSRect inner = NSInsetRect([self bounds], borderSize, borderSize);
NSPoint innerPoint[4];
innerPoint
[0] = inner.origin;
innerPoint
[1] = NSMakePoint(inner.origin.x,
                            inner
.origin.y + inner.size.height);
innerPoint
[2] = NSMakePoint(inner.origin.x + inner.size.width,
                            inner
.origin.y + inner.size.height);
innerPoint
[3] = NSMakePoint(inner.origin.x + inner.size.width,
                            inner
.origin.y);

NSBezierPath leftSidePath = [[NSBezierPath bezierPath] retain];
[leftSidePath moveToPoint:outerPoint[0]];
[leftSidePath lineToPoint:outerPoint[1]];
[leftSidePath lineToPoint:innerPoint[1]];
[leftSidePath lineToPoint:innerPoint[0]];
[leftSidePath lineToPoint:outerPoint[0]];

// ... etc.

[leftSidePath release];

No comments: