开发者

Creating a gradient fill for text using [UIColor colorWithPatternImage:]

开发者 https://www.devze.com 2023-03-27 01:20 出处:网络
I want to create a gradient for the fill color of my text. Curren开发者_如何学编程tly I am doing it by setting the color of a UILabel\'s text as

I want to create a gradient for the fill color of my text. Curren开发者_如何学编程tly I am doing it by setting the color of a UILabel's text as

UIImage *image = [UIImage imageNamed:@"GradientFillImage.png"];
myLabel.textColor = [UIColor colorWithPatternImage:image];

Where GradientFillImage.png is a simple image file with a linear gradient painted on it.

This works fine until I want to resize the font. Since the image file is of constant dimensions and does not resize when I resize the font, the gradient fill for the font gets messed up. How do I create a custom size pattern image and apply it as a fill pattern for text?


I've just finished a UIColor class extension that makes this a 1 line + block thing.

https://github.com/bigkm/UIColor-BlockPattern

CGRect rect = CGRectMake(0.0,0.0,10.0,10.0);

[UIColor colorPatternWithSize:rect.size andDrawingBlock:[[^(CGContextRef c) {
    UIImage *image = [UIImage imageNamed:@"FontGradientPink.png"];
    CGContextDrawImage(context, rect, [image CGImage]);
} copy] autorelease]];


Ok, I figured it out. Basically, we can override drawRectInText and use our own pattern to color the fill. The advantage of doing this is that we can resize the image into our pattern frame.

First we create a CGPattern object and define a callback to draw the pattern. We also pass the size of the label as a parameter in the callback. We then use the pattern that is drawn in the callback and set it as the fill color of the text:

- (void)drawTextInRect:(CGRect)rect
{
    //set gradient as a pattern fill
    CGRect info[1] = {rect};
    static const CGPatternCallbacks callbacks = {0, &drawImagePattern, NULL};
    CGAffineTransform transform = CGAffineTransformMakeScale(1.0, -1.0);

    CGPatternRef pattern = CGPatternCreate((void *) info, rect, transform, 10.0, rect.size.height, kCGPatternTilingConstantSpacing, true, &callbacks);
    CGColorSpaceRef patternSpace = CGColorSpaceCreatePattern(NULL);
    CGFloat alpha = 1.0;
    CGColorRef patternColorRef = CGColorCreateWithPattern(patternSpace, pattern, &alpha);
    CGColorSpaceRelease(patternSpace);
    CGPatternRelease(pattern);
    self.textColor = [UIColor colorWithCGColor:patternColorRef];
    self.shadowOffset = CGSizeZero;
    [super drawTextInRect:rect];
}

The callback draws the image into the context. The image is resized as per the frame size that is passed into the callback.

void drawImagePattern(void *info, CGContextRef context)
{
    UIImage *image = [UIImage imageNamed:@"FontGradientPink.png"];
    CGImageRef imageRef = [image CGImage];
    CGRect *rect = info;
    CGContextDrawImage(context, rect[0], imageRef);
}
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号