向UITextView添加轮廓/描边 [英] Adding outline/stroke to UITextView

问题描述

我想在用户键入时向可编辑的 UITextView 文本添加轮廓或笔触。就像模因一样：。在第29行，我使用的是char包装：

  CTLineBreakMode linebreakmode = kCTLineBreakByCharWrapping; 
  

我已经尝试过自动换行选项（也是默认选项）了。

我的问题是：
如何获取正确绘制的文本以使其自动换行，使其显示为键入文本的轮廓？

解决方案

  //使UITextView作为UITextView 
的子类//并覆盖-drawRect：方法您的UITextView子类
-（void）drawRect：（CGRect）rect 
 {
 self.textColor = [UIColor clearColor]; 
 
 [self setTypingAttributes：[NSDictionary dictionaryWithObjectsAndKeys：self.font，NSFontAttributeName，_textBaseColor，NSForegroundColorAttributeName，nil]]; // _textBaseColor是您选择的任何颜色
 CGRect newRect = CGRectMake（0，0，CGRectGetWidth（self.frame），CGRectGetHeight（self.frame））; 
 CGContextRef context = UIGraphicsGetCurrentContext（）; 
 
 CGContextSetTextDrawingMode（context，kCGTextStroke）; 
 //制作轮廓阴影的厚度。并将阴影矩形的y位置增加2。
 CGContextSetLineWidth（context，（TEXTOUTLINE_PERCENT / 100 * self.font.pointSize）+1）; // TEXTOUTLINE_PERCENT可以为25。
 CGContextSetLineJoin（context，kCGLineJoinRound）; 
 CGContextSetLineCap（context，kCGLineCapButt）; 
 CGContextSetStrokeColorWithColor（context，[UIColor clearColor] .CGColor）; 
 CGRect shadowrect = newRect; 
 if（UI_USER_INTERFACE_IDIOM（）== UIUserInterfaceIdiomPhone）
 {
 shadowrect.origin.y + = 0.5; 
} 
 else 
 {
 shadowrect.origin.y + = 2; 
} 
 
 [self.text drawInRect：shadowrect withAttributes：[NSDictionary dictionaryWithObjectsAndKeys：self.font，NSFontAttributeName，SHADOW_COLOR，NSForegroundColorAttributeName，nil]]; // SHADOW_COLOR可以为[UIColor colorWithRed：0.0 green：0.0 blue：0.0 alpha：0.3] 
 
 //设置文本轮廓边框的粗细。 
 CGContextSetLineWidth（context，TEXTOUTLINE_PERCENT / 100 * self.font.pointSize）; // TEXTOUTLINE_PERCENT可以为25。
 CGContextSetStrokeColorWithColor（context，[[UIColor clearColor] CGColor]）; 
 [self.text drawInRect：newRect withAttributes：[NSDictionary dictionaryWithObjectsAndKeys：self.font，NSFontAttributeName，self.textOutlineColor，NSForegroundColorAttributeName，nil]]]； 
 
 //绘制填充文本。这是实际的文本。 
 CGContextSetTextDrawingMode（context，kCGTextFill）; 
 CGContextSetFillColorWithColor（context，[[UIColor clearColor] CGColor]）; 
 [self.text drawInRect：newRect withAttributes：[NSDictionary dictionaryWithObjectsAndKeys：self.font，NSFontAttributeName，_textBaseColor，NSForegroundColorAttributeName，_textBaseColor，NSStrokeColorAttributeName，nil]]]； 
 [super drawRect：rect]; 
} 
  

I want to add an outline or stroke to an editable UITextView text as the user types. Exactly like memes : http://t.qkme.me/3oi5rs.jpg

I have to use a UITextView since I need multi line support. I have tried all the approaches and reached the conclusion that I must use CoreText. I got almost all of the solution working but got stuck at a point where the text in textview wraps. My drawRect routine in the subview of UITextView correctly draws the outline text until the text wraps. Even when the text user inputs is wrapped, the outline text that I draw does not. Here's my implementation of the drawRect method : https://gist.github.com/4498988. On line 29, I am using char wrapping :

CTLineBreakMode linebreakmode = kCTLineBreakByCharWrapping;

I have already tried the wordwrapping option (which is also the default) to no use.

My question is : How do I get the text that I draw to wrap correctly so it appears as an outline to the typed text?

解决方案

// make your UITextView as a subclass of UITextView
// and override -drawRect: method in your UITextView subclass 
- (void)drawRect:(CGRect)rect
{
    self.textColor = [UIColor clearColor];

    [self setTypingAttributes:[NSDictionary dictionaryWithObjectsAndKeys:self.font, NSFontAttributeName, _textBaseColor, NSForegroundColorAttributeName, nil ]]; // _textBaseColor is any color of your choice
    CGRect newRect = CGRectMake(0, 0, CGRectGetWidth(self.frame), CGRectGetHeight(self.frame));
    CGContextRef context = UIGraphicsGetCurrentContext();

    CGContextSetTextDrawingMode(context, kCGTextStroke);
    // Make the thickness of the outline shadow. and increase the y position of shadow rect by 2.
    CGContextSetLineWidth(context, (TEXTOUTLINE_PERCENT/100 * self.font.pointSize)+1); // TEXTOUTLINE_PERCENT can be 25.
    CGContextSetLineJoin(context, kCGLineJoinRound);
    CGContextSetLineCap(context, kCGLineCapButt);
    CGContextSetStrokeColorWithColor(context, [UIColor clearColor].CGColor);
    CGRect shadowrect = newRect;
    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
    {
        shadowrect.origin.y += 0.5;
    }
    else
    {
        shadowrect.origin.y += 2;
    }

    [self.text drawInRect:shadowrect withAttributes:[NSDictionary dictionaryWithObjectsAndKeys:self.font, NSFontAttributeName, SHADOW_COLOR , NSForegroundColorAttributeName, nil]]; // SHADOW_COLOR can be [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.3]

    // Make the thickness of the outline border of the text.
    CGContextSetLineWidth(context, TEXTOUTLINE_PERCENT/100 * self.font.pointSize); // TEXTOUTLINE_PERCENT can be 25.
    CGContextSetStrokeColorWithColor(context, [[UIColor clearColor] CGColor]);
    [self.text drawInRect:newRect withAttributes:[NSDictionary dictionaryWithObjectsAndKeys:self.font, NSFontAttributeName, self.textOutlineColor , NSForegroundColorAttributeName,  nil]];

    // Draw filled text. This is the actual text.
    CGContextSetTextDrawingMode(context, kCGTextFill);
    CGContextSetFillColorWithColor(context, [[UIColor clearColor] CGColor]);
    [self.text drawInRect:newRect withAttributes:[NSDictionary dictionaryWithObjectsAndKeys:self.font, NSFontAttributeName, _textBaseColor, NSForegroundColorAttributeName,_textBaseColor, NSStrokeColorAttributeName, nil]];
    [super drawRect:rect];
}

这篇关于向UITextView添加轮廓/描边的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！