I have the following function to make an attributed string.
- (NSMutableAttributedString *)makeText:(NSString *)txt : (NSString *)fontname : (CGFloat)tsize :(NSColor *)textColor :(NSColor *)shadowColor :(NSSize)offset {
NSShadow *shadow = [[NSShadow alloc] init];
shadow.shadowColor = shadowColor;
shadow.shadowOffset = offset;
NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];
paragraphStyle.lineSpacing = 10.0f;
paragraphStyle.alignment = NSCenterTextAlignment;
NSMutableAttributedString *atext = [[NSMutableAttributedString alloc] initWithString:txt];
NSRange range = NSMakeRange(0,txt.length);
// alignment
[atext addAttribute:NSParagraphStyleAttributeName value:paragraphStyle range:NSMakeRange(0,[atext length])];
...
...
return atext;
}
If I set this attributed string to NSTextField, the resulting attributed string will be aligned correctly. But if I send it to NSView's subclass, the string will be left-aligned. Is there any way by which I can display this attributed string with correct alignment?
// .h
#interface imageView1 : NSView {
NSAttributedString *aStr;
}
// .m
- (void)drawRect:(NSRect)dirtyRect {
[aStr drawAtPoint:NSMakePoint((self.frame.size.width-aStr.size.width)/2.0f,(self.frame.size.height-aStr.size.height)/2.0f)];
}
Thank you for your help. The OS version is 10.8.
If you draw at a point there are no bounds in relation to which to center. You need to specify a rect. See the docs on drawWithRect:options:. Note the admonition there pointing out that to be in that rect your options will need to be (or include) NSStringDrawingUsesLineFragmentOrigin.
Related
I have a NSTextField where I add NSMutableAttributedString. I want to set the size of that string to big number, however when I do that the text appears cut off. How can tell the NSTextField to get bigger?
This is what I have:
NSTextField* textField = [[NSTextField alloc] init];
NSMutableAttributedString* text = [[NSMutableAttributedString alloc]
initWithString:#"0"];
NSRange titleRange = NSMakeRange(0, [text length]);
[text addAttribute:NSFontAttributeName
value:[NSFont boldSystemFontOfSize:25]
range:titleRange];
[textField setAttributedStringValue:text];
Any advice?
Thanks in advance
Make a subclass of NSTextField
In implementation do override intrinsicContentSize
-(NSSize)intrinsicContentSize
{
if ( ![self.cell wraps] ) {
return [super intrinsicContentSize];
}
NSRect frame = [self frame];
CGFloat width = frame.size.width;
frame.size.height = CGFLOAT_MAX;
CGFloat height = [self.cell cellSizeForBounds: frame].height;
return NSMakeSize(width, height);
}
// Than invalidate the layout when text changes
- (void)textDidChange:(NSNotification *)notification
{
[super textDidChange:notification];
[self invalidateIntrinsicContentSize];
}
In attribute Inspector inside storyboard set NSTextField class to your customNSTextField class and change layout to wraps from scrolls.
You must add constraints to your textField to its superview, easier in storyboard.
After that you can also set font size directly :
[_textField setFont:[NSFont systemFontOfSize:25]];
[textField sizeToFit];
But using autolayout, is usually a better idea.
My application is setup as so.
Custom UIView inside a ScrollView.
The custom UIView is getting text generated on top of it with this code.
CoreDavening.m draw function
attStorage = [[NSTextStorage alloc]initWithAttributedString:string];
textContainer = [[NSTextContainer alloc]
initWithSize:CGSizeMake(self.frame.size.width, FLT_MAX)];
layoutManager = [[NSLayoutManager alloc]init];
[layoutManager addTextContainer:textContainer];
[attStorage addLayoutManager:layoutManager];
NSRange glyphRange = [layoutManager
glyphRangeForTextContainer:textContainer];
[layoutManager drawGlyphsForGlyphRange: glyphRange atPoint: rect.origin];
In my ViewController.m I'm creating the view like so.
CoreDavening *davenView = [[CoreDavening alloc]initWithFrame:CGRectMake(0, 0,self.view.frame.size.width, [coreDavening heightForStringDrawing])];
davenView.backgroundColor = [UIColor whiteColor];
davenView.layer.borderColor = [[UIColor whiteColor]CGColor];
scrollView.backgroundColor = [UIColor whiteColor];
[scrollView addSubview:davenView];
self.scrollView.contentSize = davenView.frame.size;
Im trying to find a way to 1) change the font size (just size) 2) have the scrollView and CustomView resize appropriately.
How can this be done?
EDIT 1:
Im creating the custom view in my viewController like this.
CoreDavening *coreDavening = [[CoreDavening alloc]init];
davenView = [[CoreDavening alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, [coreDavening heightForStringDrawing ])];
and updating/refreshing the custom view like this.
It get triggered when the slider I have set up changes value.
- (IBAction)sliderChanged:(id)sender {
NSUserDefaults *prefs= [NSUserDefaults standardUserDefaults];
[prefs setInteger:(long)self.Slider.value forKey:#"fontSize"];
[prefs synchronize];
[davenView setNeedsLayout];
}
My custom view controller has the font set up like.
THIS IS IN THE DRAW FUNCTION
attStorage = [[NSTextStorage alloc]initWithAttributedString:string];
[attStorage addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:(long)[prefs integerForKey:#"fontSize"]] range:NSMakeRange(0, attStorage.length)];
textContainer = [[NSTextContainer alloc]
initWithSize:CGSizeMake(self.frame.size.width, FLT_MAX)];
layoutManager = [[NSLayoutManager alloc]init];
[layoutManager addTextContainer:textContainer];
[attStorage addLayoutManager:layoutManager];
NSRange glyphRange = [layoutManager
glyphRangeForTextContainer:textContainer];
[layoutManager drawGlyphsForGlyphRange: glyphRange atPoint: rect.origin];
It seems like you have the textStorage associated with the layoutManager already. NSTextStorage is the subclass of NSMutableAttributedString. So, this is the class which is responsible to hold the layout and styling information. How have you created your textStorage ? Besides, the styling, NSTextStorage also has methods to allow editing the contents and have dynamic styling.
You can simply set the attribute to your textStorage if you want to change the font.
[_textStorage addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:20.0] range:NSMakeRange(0, _textStorage.length)];
NSTextManager class has quite useful methods to find the bounds and glyphs informations. So, you could use method like below to find the bounds for your text,
- (CGRect)boundingRectWithSize:(CGSize)size
{
self.textContainer.size = size;
NSRange glyphRange = [self.layoutManager glyphRangeForTextContainer:self.textContainer];
CGRect boundingRect = [self.layoutManager boundingRectForGlyphRange:glyphRange
inTextContainer:self.textContainer];
boundingRect.origin.x = 0;
boundingRect.origin.y = 0;
return boundingRect;
}
NSTextContainer on Mac OS X has a method replaceLayoutManager: to replace the NSLayoutManager of NSTextView with a subclass of NSLayoutManager.
Unfortunately iOS doesn't have such a function.
I tried a combination of these lines of code, but it keeps crashing.
THLayoutManager *layoutManager = [[THLayoutManager alloc] init];
[layoutManager addTextContainer:[self textContainer]];
// [[self textStorage] removeLayoutManager:[self layoutManager]];
//[[self textStorage] addLayoutManager:layoutManager];
[[self textContainer] setLayoutManager:layoutManager];
What is the correct procedure to replace the NSLayoutManager of an UITextview?
Since iOS9, NSTextContainer has the same method as macOS. So now you can replace the layout manager on your storyboard UITextView with your own subclass:
textView.textContainer.replaceLayoutManager(MyLayoutManager())
Have a look at the WWDC2013 Intro To Text Kit video and sample code where they show how to do it.
https://developer.apple.com/downloads/index.action?name=WWDC%202013
https://developer.apple.com/wwdc/videos/
Below is an extract from the code
-(void)viewDidLoad
{
[super viewDidLoad];
// our auto layout views use a design spec that calls for
// 8 pts on each side except the bottom
// since we scroll at the top here, only inset the sides
CGRect newTextViewRect = CGRectInset(self.view.bounds, 8., 0.);
self.textStorage = [[TKDInteractiveTextColoringTextStorage alloc] init];
NSLayoutManager *layoutManager = [[NSLayoutManager alloc] init];
NSTextContainer *container = [[NSTextContainer alloc] initWithSize:CGSizeMake(newTextViewRect.size.width, CGFLOAT_MAX)];
container.widthTracksTextView = YES;
[layoutManager addTextContainer:container];
[_textStorage addLayoutManager:layoutManager];
UITextView *newTextView = [[UITextView alloc] initWithFrame:newTextViewRect textContainer:container];
newTextView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
newTextView.scrollEnabled = YES;
newTextView.keyboardDismissMode = UIScrollViewKeyboardDismissModeOnDrag;
[self.view addSubview:newTextView];
self.textView = newTextView;
self.textStorage.tokens = #{ #"Alice" : #{ NSForegroundColorAttributeName : [UIColor redColor] },
#"Rabbit" : #{ NSForegroundColorAttributeName : [UIColor orangeColor] },
TKDDefaultTokenName : #{ NSForegroundColorAttributeName : [UIColor blackColor] } };
}
on OSX I have an NSButton with a pretty dark image and unfortunately it is not possible to change the color using the attributes inspector. See picture the big black button, the text is Go.
Any clues for a possibility to change the text color? I looked in to the NSButton class but there is no method to do that. I´m aware that I could make the image with white font but that is not what I want to do.
Greetings from Switzerland, Ronald Hofmann
---
Here is two other solutions:
http://denis-druz.okis.ru/news.534557.Text-Color-in-NSButton.html
solution 1:
-(void)awakeFromNib
{
NSColor *color = [NSColor greenColor];
NSMutableAttributedString *colorTitle = [[NSMutableAttributedString alloc] initWithAttributedString:[button attributedTitle]];
NSRange titleRange = NSMakeRange(0, [colorTitle length]);
[colorTitle addAttribute:NSForegroundColorAttributeName value:color range:titleRange];
[button setAttributedTitle:colorTitle];
}
solution 2:
in *.m file:
- (void)setButtonTitleFor:(NSButton*)button toString:(NSString*)title withColor:(NSColor*)color
{
NSMutableParagraphStyle *style = [[NSMutableParagraphStyle alloc] init];
[style setAlignment:NSCenterTextAlignment];
NSDictionary *attrsDictionary = [NSDictionary dictionaryWithObjectsAndKeys:color, NSForegroundColorAttributeName, style, NSParagraphStyleAttributeName, nil];
NSAttributedString *attrString = [[NSAttributedString alloc]initWithString:title attributes:attrsDictionary];
[button setAttributedTitle:attrString];
}
-(void)awakeFromNib
{
NSString *title = #"+Add page";
NSColor *color = [NSColor greenColor];
[self setButtonTitleFor:button toString:title withColor:color];
}
My solution:
.h
IB_DESIGNABLE
#interface DVButton : NSButton
#property (nonatomic, strong) IBInspectable NSColor *BGColor;
#property (nonatomic, strong) IBInspectable NSColor *TextColor;
#end
.m
#implementation DVButton
- (void)awakeFromNib
{
if (self.TextColor)
{
NSMutableParagraphStyle *style = [[NSMutableParagraphStyle alloc] init];
[style setAlignment:NSCenterTextAlignment];
NSDictionary *attrsDictionary = [NSDictionary dictionaryWithObjectsAndKeys:
self.TextColor, NSForegroundColorAttributeName,
self.font, NSFontAttributeName,
style, NSParagraphStyleAttributeName, nil];
NSAttributedString *attrString = [[NSAttributedString alloc]initWithString:self.title attributes:attrsDictionary];
[self setAttributedTitle:attrString];
}
}
- (void)drawRect:(NSRect)dirtyRect
{
if (self.BGColor)
{
// add a background colour
[self.BGColor setFill];
NSRectFill(dirtyRect);
}
[super drawRect:dirtyRect];
}
#end
And here’s a Swift 3 version:
import Cocoa
#IBDesignable
class DVButton: NSButton
{
#IBInspectable var bgColor: NSColor?
#IBInspectable var textColor: NSColor?
override func awakeFromNib()
{
if let textColor = textColor, let font = font
{
let style = NSMutableParagraphStyle()
style.alignment = .center
let attributes =
[
NSForegroundColorAttributeName: textColor,
NSFontAttributeName: font,
NSParagraphStyleAttributeName: style
] as [String : Any]
let attributedTitle = NSAttributedString(string: title, attributes: attributes)
self.attributedTitle = attributedTitle
}
}
override func draw(_ dirtyRect: NSRect)
{
if let bgColor = bgColor
{
bgColor.setFill()
NSRectFill(dirtyRect)
}
super.draw(dirtyRect)
}
}
and Swift 4.0 version:
import Cocoa
#IBDesignable
class Button: NSButton
{
#IBInspectable var bgColor: NSColor?
#IBInspectable var textColor: NSColor?
override func awakeFromNib()
{
if let textColor = textColor, let font = font
{
let style = NSMutableParagraphStyle()
style.alignment = .center
let attributes =
[
NSAttributedStringKey.foregroundColor: textColor,
NSAttributedStringKey.font: font,
NSAttributedStringKey.paragraphStyle: style
] as [NSAttributedStringKey : Any]
let attributedTitle = NSAttributedString(string: title, attributes: attributes)
self.attributedTitle = attributedTitle
}
}
override func draw(_ dirtyRect: NSRect)
{
if let bgColor = bgColor
{
bgColor.setFill()
__NSRectFill(dirtyRect)
}
super.draw(dirtyRect)
}
}
This is how I get it done in Swift 4
#IBOutlet weak var myButton: NSButton!
// create the attributed string
let myString = "My Button Title"
let myAttribute = [ NSAttributedStringKey.foregroundColor: NSColor.blue ]
let myAttrString = NSAttributedString(string: myString, attributes: myAttribute)
// assign it to the button
myButton.attributedTitle = myAttrString
Apple have code for setting the text colour of an NSButton as part of the Popover example.
Below is the crux of the example (modified slightly for this post, untested):
NSButton *button = ...;
NSMutableAttributedString *attrTitle =
[[NSMutableAttributedString alloc] initWithString:#"Make Me Red"];
NSUInteger len = [attrTitle length];
NSRange range = NSMakeRange(0, len);
[attrTitle addAttribute:NSForegroundColorAttributeName value:[NSColor redColor] range:range];
[attrTitle fixAttributesInRange:range];
[button setAttributedTitle:attrTitle];
Note that the call to fixAttributesInRange: seems to be important (an AppKit extension), but I can't find documentation as to why that is the case. The only concern I have with using attributed strings in an NSButton is if an image is also defined for the button (such as an icon), the attributed string will occupy a large rectangle and push the image to the edge of the button. Something to bear in mind.
Otherwise it seems the best way is to make your own drawRect: override instead, which has many other pitfalls that are outside the scope of this question.
I've created a NSButton subclass called FlatButton that makes it super-easy to change the text color in the Attributes Inspector of Interface Builder like you are asking for. It should provide a simple and extensive solution to your problem.
It also exposes other relevant styling attributes such as color and shape.
You'll find it here: https://github.com/OskarGroth/FlatButton
Add a category on the NSButton and simply set the color to what you want, and preseve the existing attributes, since the title can be centered, left aligned etc
#implementation NSButton (NSButton_IDDAppKit)
- (NSColor*)titleTextColor {
return [NSColor redColor];
}
- (void)setTitleTextColor:(NSColor*)aColor {
NSMutableAttributedString* attributedString = [[NSMutableAttributedString alloc] initWithAttributedString:self.attributedTitle];
NSString* title = self.title;
NSRange range = NSMakeRange(0.0, self.title.length);
[attributedString addAttribute:NSForegroundColorAttributeName value:aColor range:range];
[self setAttributedTitle:attributedString];
[attributedString release];
}
#end
A really simple, reusable solution without subclassing NSButton:
[self setButton:self.myButton fontColor:[NSColor whiteColor]] ;
-(void) setButton:(NSButton *)button fontColor:(NSColor *)color {
NSMutableAttributedString *colorTitle = [[NSMutableAttributedString alloc] initWithAttributedString:[button attributedTitle]];
[colorTitle addAttribute:NSForegroundColorAttributeName value:color range:NSMakeRange(0, button.attributedTitle.length)];
[button setAttributedTitle:colorTitle];
}
When your target is macOS 10.14 or newer, you can use the new contentTintColor property of the NSButton control to set the text color.
button.contentTintColor = NSColor.systemGreenColor;
If deployment Target > 10.14,you can use contentTintColor set color.
/** Applies a tint color to template image and text content, in combination with other theme-appropriate effects. Only applicable to borderless buttons. A nil value indicates the standard set of effects without color modification. The default value is nil. Non-template images and attributed string values are not affected by the contentTintColor. */
#available(macOS 10.14, *)
#NSCopying open var contentTintColor: NSColor?
sample code:
var confirmBtn = NSButton()
confirmBtn.title = "color"
confirmBtn.contentTintColor = NSColor.red
Swift 5
You can use this extension:
extension NSButton {
#IBInspectable var titleColor: NSColor? {
get {
return NSColor.white
}
set {
let pstyle = NSMutableParagraphStyle()
pstyle.alignment = .center
self.attributedTitle = NSAttributedString(
string: self.title,
attributes: [ NSAttributedString.Key.foregroundColor :newValue, NSAttributedString.Key.paragraphStyle: pstyle]
)
}
}
}
Now you can set title color in storyboard easily. Cheers!
NSColor color = NSColor.White;
NSMutableAttributedString colorTitle = new NSMutableAttributedString (cb.Cell.Title);
NSRange titleRange = new NSRange (0, (nint)cb.Cell.Title.Length);
colorTitle.AddAttribute (NSStringAttributeKey.ForegroundColor, color, titleRange);
cb.Cell.AttributedTitle = colorTitle;
Using the info above, I wrote a NSButton extension that sets the foreground color, along with the system font and text alignment.
This is for Cocoa on Swift 4.x, but could be easily adjusted for iOS.
import Cocoa
extension NSButton {
func setAttributes(foreground: NSColor? = nil, fontSize: CGFloat = -1.0, alignment: NSTextAlignment? = nil) {
var attributes: [NSAttributedStringKey: Any] = [:]
if let foreground = foreground {
attributes[NSAttributedStringKey.foregroundColor] = foreground
}
if fontSize != -1 {
attributes[NSAttributedStringKey.font] = NSFont.systemFont(ofSize: fontSize)
}
if let alignment = alignment {
let paragraph = NSMutableParagraphStyle()
paragraph.alignment = alignment
attributes[NSAttributedStringKey.paragraphStyle] = paragraph
}
let attributed = NSAttributedString(string: self.title, attributes: attributes)
self.attributedTitle = attributed
}
}
Swift 4.2 version of David Boyd's solution
extension NSButton {
func setAttributes(foreground: NSColor? = nil, fontSize: CGFloat = -1.0, alignment: NSTextAlignment? = nil) {
var attributes: [NSAttributedString.Key: Any] = [:]
if let foreground = foreground {
attributes[NSAttributedString.Key.foregroundColor] = foreground
}
if fontSize != -1 {
attributes[NSAttributedString.Key.font] = NSFont.systemFont(ofSize: fontSize)
}
if let alignment = alignment {
let paragraph = NSMutableParagraphStyle()
paragraph.alignment = alignment
attributes[NSAttributedString.Key.paragraphStyle] = paragraph
}
let attributed = NSAttributedString(string: self.title, attributes: attributes)
self.attributedTitle = attributed
}
}
I've been using NSStrokeWidthAttributeName on NSAttributedString objects to put an outline around text as it's drawn. The problem is that the stroke is inside the fill area of the text. When the text is small (e.g. 1 pixel thick), the stroking makes the text hard to read. What I really want is a stroke on the outside. Is there any way to do that?
I've tried an NSShadow with no offset and a blur, but it's too blurry and hard to see. If there was a way to increase the size of the shadow without any blur, that would work too.
While there may be other ways, one way to accomplish this is to first draw the string with only a stroke, then draw the string with only a fill, directly overtop of what was previously drawn. (Adobe InDesign actually has this built-in, where it will appear to only apply the stroke to the outside of letter, which helps with readability).
This is just an example view that shows how to accomplish this (inspired by http://developer.apple.com/library/mac/#qa/qa2008/qa1531.html):
First set up the attributes:
#implementation MDInDesignTextView
static NSMutableDictionary *regularAttributes = nil;
static NSMutableDictionary *indesignBackgroundAttributes = nil;
static NSMutableDictionary *indesignForegroundAttributes = nil;
- (void)drawRect:(NSRect)frame {
NSString *string = #"Got stroke?";
if (regularAttributes == nil) {
regularAttributes = [[NSMutableDictionary
dictionaryWithObjectsAndKeys:
[NSFont systemFontOfSize:64.0],NSFontAttributeName,
[NSColor whiteColor],NSForegroundColorAttributeName,
[NSNumber numberWithFloat:-5.0],NSStrokeWidthAttributeName,
[NSColor blackColor],NSStrokeColorAttributeName, nil] retain];
}
if (indesignBackgroundAttributes == nil) {
indesignBackgroundAttributes = [[NSMutableDictionary
dictionaryWithObjectsAndKeys:
[NSFont systemFontOfSize:64.0],NSFontAttributeName,
[NSNumber numberWithFloat:-5.0],NSStrokeWidthAttributeName,
[NSColor blackColor],NSStrokeColorAttributeName, nil] retain];
}
if (indesignForegroundAttributes == nil) {
indesignForegroundAttributes = [[NSMutableDictionary
dictionaryWithObjectsAndKeys:
[NSFont systemFontOfSize:64.0],NSFontAttributeName,
[NSColor whiteColor],NSForegroundColorAttributeName, nil] retain];
}
[[NSColor grayColor] set];
[NSBezierPath fillRect:frame];
// draw top string
[string drawAtPoint:
NSMakePoint(frame.origin.x + 200.0, frame.origin.y + 200.0)
withAttributes:regularAttributes];
// draw bottom string in two passes
[string drawAtPoint:
NSMakePoint(frame.origin.x + 200.0, frame.origin.y + 140.0)
withAttributes:indesignBackgroundAttributes];
[string drawAtPoint:
NSMakePoint(frame.origin.x + 200.0, frame.origin.y + 140.0)
withAttributes:indesignForegroundAttributes];
}
#end
This produces the following output:
Now, it's not perfect, since the glyphs will sometimes fall on fractional boundaries, but, it certainly looks better than the default.
If performance is an issue, you could always look into dropping down to a slightly lower level, such as CoreGraphics or CoreText.
Just leave here my solution based on answer of #NSGod, result is pretty the same just having proper positioning inside UILabel
It is also useful when having bugs on iOS 14 when stroking letters with default system font (refer also this question)
Bug:
#interface StrokedTextLabel : UILabel
#end
/**
* https://stackoverflow.com/a/4468880/3004003
*/
#implementation StrokedTextLabel
- (void)drawTextInRect:(CGRect)rect
{
if (!self.attributedText) {
[super drawTextInRect:rect];
return;
}
NSMutableAttributedString *attributedText = self.attributedText.mutableCopy;
[attributedText enumerateAttributesInRange:NSMakeRange(0, attributedText.length) options:0 usingBlock:^(NSDictionary<NSAttributedStringKey, id> *attrs, NSRange range, BOOL *stop) {
if (attrs[NSStrokeWidthAttributeName]) {
// 1. draw underlying stroked string
// use doubled stroke width to simulate outer border, because border is being stroked
// in both outer & inner directions with half width
CGFloat strokeWidth = [attrs[NSStrokeWidthAttributeName] floatValue] * 2;
[attributedText addAttributes:#{NSStrokeWidthAttributeName : #(strokeWidth)} range:range];
self.attributedText = attributedText;
// perform default drawing
[super drawTextInRect:rect];
// 2. draw unstroked string above
NSMutableParagraphStyle *style = [NSMutableParagraphStyle new];
style.alignment = self.textAlignment;
[attributedText addAttributes:#{
NSStrokeWidthAttributeName : #(0),
NSForegroundColorAttributeName : self.textColor,
NSFontAttributeName : self.font,
NSParagraphStyleAttributeName : style
} range:range];
// we use here custom bounding rect detection method instead of
// [attributedText boundingRectWithSize:...] because the latter gives incorrect result
// in this case
CGRect textRect = [self boundingRectWithAttributedString:attributedText forCharacterRange:NSMakeRange(0, attributedText.length)];
[attributedText boundingRectWithSize:rect.size options:NSStringDrawingUsesLineFragmentOrigin
context:nil];
// adjust vertical position because returned bounding rect has zero origin
textRect.origin.y = (rect.size.height - textRect.size.height) / 2;
[attributedText drawInRect:textRect];
}
}];
}
/**
* https://stackoverflow.com/a/20633388/3004003
*/
- (CGRect)boundingRectWithAttributedString:(NSAttributedString *)attributedString
forCharacterRange:(NSRange)range
{
NSTextStorage *textStorage = [[NSTextStorage alloc] initWithAttributedString:attributedString];
NSLayoutManager *layoutManager = [[NSLayoutManager alloc] init];
[textStorage addLayoutManager:layoutManager];
NSTextContainer *textContainer = [[NSTextContainer alloc] initWithSize:[self bounds].size];
textContainer.lineFragmentPadding = 0;
[layoutManager addTextContainer:textContainer];
NSRange glyphRange;
// Convert the range for glyphs.
[layoutManager characterRangeForGlyphRange:range actualGlyphRange:&glyphRange];
return [layoutManager boundingRectForGlyphRange:glyphRange inTextContainer:textContainer];
}
#end
Swift version
import Foundation
import UIKit
/// https://stackoverflow.com/a/4468880/3004003
#objc(MUIStrokedTextLabel)
public class StrokedTextLabel : UILabel {
override public func drawText(in rect: CGRect) {
guard let attributedText = attributedText?.mutableCopy() as? NSMutableAttributedString else {
super.drawText(in: rect)
return
}
attributedText.enumerateAttributes(in: NSRange(location: 0, length: attributedText.length), options: [], using: { attrs, range, stop in
guard let strokeWidth = attrs[NSAttributedString.Key.strokeWidth] as? CGFloat else {
return
}
// 1. draw underlying stroked string
// use doubled stroke width to simulate outer border, because border is being stroked
// in both outer & inner directions with half width
attributedText.addAttributes([
NSAttributedString.Key.strokeWidth: strokeWidth * 2
], range: range)
self.attributedText = attributedText
// perform default drawing
super.drawText(in: rect)
// 2. draw unstroked string above
let style = NSMutableParagraphStyle()
style.alignment = textAlignment
let attributes = [
NSAttributedString.Key.strokeWidth: NSNumber(value: 0),
NSAttributedString.Key.foregroundColor: textColor ?? UIColor.black,
NSAttributedString.Key.font: font ?? UIFont.systemFont(ofSize: 17),
NSAttributedString.Key.paragraphStyle: style
]
attributedText.addAttributes(attributes, range: range)
// we use here custom bounding rect detection method instead of
// [attributedText boundingRectWithSize:...] because the latter gives incorrect result
// in this case
var textRect = boundingRect(with: attributedText, forCharacterRange: NSRange(location: 0, length: attributedText.length))
attributedText.boundingRect(
with: rect.size,
options: .usesLineFragmentOrigin,
context: nil)
// adjust vertical position because returned bounding rect has zero origin
textRect.origin.y = (rect.size.height - textRect.size.height) / 2
attributedText.draw(in: textRect)
})
}
/// https://stackoverflow.com/a/20633388/3004003
private func boundingRect(
with attributedString: NSAttributedString?,
forCharacterRange range: NSRange
) -> CGRect {
guard let attributedString = attributedString else {
return .zero
}
let textStorage = NSTextStorage(attributedString: attributedString)
let layoutManager = NSLayoutManager()
textStorage.addLayoutManager(layoutManager)
let textContainer = NSTextContainer(size: bounds.size)
textContainer.lineFragmentPadding = 0
layoutManager.addTextContainer(textContainer)
var glyphRange = NSRange()
// Convert the range for glyphs.
layoutManager.characterRange(forGlyphRange: range, actualGlyphRange: &glyphRange)
return layoutManager.boundingRect(forGlyphRange: glyphRange, in: textContainer)
}
}