Draw a line inside a UITextView - NSAttributedString - ios

Question

I wish to draw a customizable line inside a UITextView consisting of some text (using NSAttributedString)
Here's what I tried
NSString *unicodeStr = [NSString stringWithFormat:#"%C%C%C", 0x00A0, 0x0009, 0x00A0]; //nbsp, tab, nbsp
NSMutableAttributedString *str = [[NSMutableAttributedString alloc] initWithString:unicodeStr];
NSRange strRange = NSMakeRange(0, str.length);
NSMutableParagraphStyle *const tabStyle = [[NSMutableParagraphStyle alloc] init];
tabStyle.headIndent = 16; //padding on left and right edges
tabStyle.firstLineHeadIndent = 16;
tabStyle.tailIndent = -16;
NSTextTab *listTab = [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentCenter location:40 options:#{}]; //this is how long I want the line to be
tabStyle.tabStops = #[listTab];
[str addAttribute:NSParagraphStyleAttributeName value:tabStyle range:strRange];
[str addAttribute:NSStrikethroughStyleAttributeName value:[NSNumber numberWithInt:2] range:strRange];
But no matter what value I provide for the tab stop location (40 in this case) and tailIndent (-16 here), the line only respects the headIndent and spans the entire UITextView width (minus the headIndent of course).
EDIT - I am pretty sure the issue is because I am not using the correct unicode chars (although they seem to be the logical choice). In case this gives someone a hint, if I add a space after the 2nd nbsp i.e. towards the end, the tab is limited to a single tab length

Answer 1

Is it your expected result?
Can you try this:
NSTextTab *listTab = [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentCenter location:self.textView.frame.size.width - tabStyle.firstLineHeadIndent + tabStyle.tailIndent options:#{}];
And this is the full code:
- (void) viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
NSString *unicodeStr = #"\n\u00a0\t\t\n";
NSMutableAttributedString *str = [[NSMutableAttributedString alloc] initWithString:unicodeStr];
NSRange strRange = NSMakeRange(0, str.length);
NSMutableParagraphStyle *const tabStyle = [[NSMutableParagraphStyle alloc] init];
tabStyle.headIndent = 16; //padding on left and right edges
tabStyle.firstLineHeadIndent = 16;
tabStyle.tailIndent = -70;
NSTextTab *listTab = [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentCenter location:self.textView.frame.size.width - tabStyle.headIndent + tabStyle.tailIndent options:#{}]; //this is how long I want the line to be
tabStyle.tabStops = #[listTab];
[str addAttribute:NSParagraphStyleAttributeName value:tabStyle range:strRange];
[str addAttribute:NSStrikethroughStyleAttributeName value:[NSNumber numberWithInt:2] range:strRange];
NSAttributedString *htmlStr = [[NSAttributedString alloc] initWithData:[#"<h1>Lorem ipsum dolor sit er elit lamet</h1>" dataUsingEncoding:NSUnicodeStringEncoding] options:#{ NSDocumentTypeDocumentAttribute: NSHTMLTextDocumentType } documentAttributes:nil error:nil];
[str insertAttributedString:htmlStr atIndex:0];
[str appendAttributedString:htmlStr];
self.textView.attributedText = str;
}

Answer 2

Here's what I did to solve the same issue. It uses a subclass of NSTextTab:
import UIKit
class RightAnchoredTextTab : NSTextTab {
weak var textContainer : NSTextContainer!
required init(textAlignment alignment: NSTextAlignment, location loc: CGFloat, options: [String : AnyObject], textContainer aTextContainer : NSTextContainer) {
super.init(textAlignment: alignment, location: loc, options: options)
textContainer = aTextContainer
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
override var location: CGFloat {
get {
return textContainer.size.width-textContainer.lineFragmentPadding*2-super.location
}
}
}
And similar bits similar to other solutions:
func horizontalLine(indent : CGFloat = 30, width : CGFloat = 1) -> NSAttributedString
{
let paragraphStyle = NSMutableParagraphStyle()
paragraphStyle.tabStops = []
paragraphStyle.addTabStop(NSTextTab(textAlignment: .Left, location: indent, options: [:]))
paragraphStyle.addTabStop(RightAnchoredTextTab(textAlignment: .Right, location: indent, options: [:], textContainer : textView.textContainer))
paragraphStyle.alignment = .Left
let attributes = [NSParagraphStyleAttributeName : paragraphStyle, NSStrikethroughStyleAttributeName : width]
textView.backgroundColor = UIColor.yellowColor()
let ZeroWidthNonBreakingSpace = "\u{FEFF}"
return NSAttributedString(string: "\t\(ZeroWidthNonBreakingSpace)\t\(ZeroWidthNonBreakingSpace)\n", attributes: attributes)
}
A few notes:
It will probably only work with a single square text container.
NSTextContainer has a lineFragmentPadding. If you've every wondered why you have to indent a right alignment tab by 10 this is it: the default value is 5.
prefixing the text with \n meant there was no strikethrough. No idea why.
This solution works with rotations etc as UITextView calls NSTextTab.location again when the bounds are changed.

Answer 3

for swift 5,
let unicodeStr = "\n\u{00a0}\t\t\n"
let str = NSMutableAttributedString(string: unicodeStr)
let strRange = NSRange(location: 0, length: str.length)
let tabStyle = NSMutableParagraphStyle()
tabStyle.headIndent = 0 //padding on left and right edges
tabStyle.firstLineHeadIndent = 0
//tabStyle.tailIndent = -16
let listTab = NSTextTab(textAlignment: .center, location: textView.frame.size.width-10, options: [:]) //this is how long I want the line to be
tabStyle.tabStops = [listTab]
str.addAttribute(.paragraphStyle, value: tabStyle, range: strRange)
str.addAttribute(.strikethroughStyle, value: NSNumber(value: 2), range: strRange)
str.addAttribute(.strikethroughColor, value: UIColor.label, range: strRange)
str.addAttribute(NSAttributedString.Key.font, value: self.currentFont, range: strRange)
str.addAttribute(NSAttributedString.Key.foregroundColor, value: UIColor.label, range: strRange)
textView.textStorage.append(str)
//To set cursor end of document
let endPosition = self.textView.endOfDocument
self.textView.selectedTextRange = self.textView.textRange(from: endPosition, to: endPosition)