围绕UILabel的每一个字的边界

有没有一种方法可以在UILabel每个单词上绘制边界。 假设UILabel包含string“This is the Line 1”。

我想5个不同的边界5个字左右

  1. 这个
  2. 线
  3. 1

我不知道一个易于使用的UILabel代码,但对于UITextView:

斯威夫特操场

build立:

 import UIKit let string = "Lorem ipsum dolor sit amet" let textView = UITextView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) textView.text = string 

使用正则expression式为每个单词获得一个匹配:

 let pattern = "[a-zA-Z0-9]+" let regex = try! NSRegularExpression(pattern: pattern, options: []) let matches = regex.matchesInString(string, options: [], range: NSMakeRange(0, string.characters.count)) 

函数来获得每个匹配的rect(从这个答案中移植):

 func frameOfTextInRange(range:NSRange, inTextView textView:UITextView) -> CGRect { let beginning = textView.beginningOfDocument let start = textView.positionFromPosition(beginning, offset: range.location)! let end = textView.positionFromPosition(start, offset: range.length)! let textRange = textView.textRangeFromPosition(start, toPosition: end)! let rect = textView.firstRectForRange(textRange) return textView.convertRect(rect, fromView: textView) } 

迭代每个匹配,获取其框架,使用它来创build背景视图,将其添加到文本视图:

 for m in matches { let range = m.range let frame = frameOfTextInRange(range, inTextView: textView) let v = UIView(frame: frame) v.layer.borderWidth = 1 v.layer.borderColor = UIColor.blueColor().CGColor textView.addSubview(v) } 

结果


但是,这可能不会给你所期待的结果。 为了获得更好的控制,你可以使用属性string。

这里使用属性string的代码

 import UIKit let string = "Lorem ipsum dolor sit amet" let textView = UITextView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) let attributedString = NSMutableAttributedString(string: string) let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.lineHeightMultiple = 1.25 attributedString.addAttribute(NSParagraphStyleAttributeName, value: paragraphStyle, range: NSMakeRange(0, string.characters.count)) textView.attributedText = attributedString let pattern = "[a-zA-Z0-9]+" let regex = try! NSRegularExpression(pattern: pattern, options: []) let matches = regex.matchesInString(string, options: [], range: NSMakeRange(0, string.characters.count)) func frameOfTextInRange(range:NSRange, inTextView textView:UITextView) -> CGRect { let beginning = textView.beginningOfDocument let start = textView.positionFromPosition(beginning, offset: range.location)! let end = textView.positionFromPosition(start, offset: range.length)! let textRange = textView.textRangeFromPosition(start, toPosition: end)! let rect = textView.firstRectForRange(textRange) return textView.convertRect(rect, fromView: textView) } for m in matches { let range = m.range var frame = frameOfTextInRange(range, inTextView: textView) frame = CGRectInset(frame, CGFloat(-1.2), CGFloat(2)) frame = CGRectOffset(frame, CGFloat(0), CGFloat(2)) let v = UIView(frame: frame) v.layer.borderWidth = 1 v.layer.borderColor = UIColor.blueColor().CGColor textView.addSubview(v) } 

结果


创build漂亮的样式也有助于将视图添加到背景视图并将该视图添加到顶部

 import UIKit let string = "Lorem ipsum dolor sit amet" let textView = UITextView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) let textViewBG = UIView(frame: textView.bounds) textViewBG.backgroundColor = UIColor.whiteColor() let attributedString = NSMutableAttributedString(string: string) let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.lineHeightMultiple = 1.25 attributedString.addAttribute(NSParagraphStyleAttributeName, value: paragraphStyle, range: NSMakeRange(0, string.characters.count)) attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.whiteColor(), range: NSMakeRange(0, string.characters.count)) textView.attributedText = attributedString textView.backgroundColor = UIColor.clearColor() let pattern = "[a-zA-Z0-9]+" let regex = try! NSRegularExpression(pattern: pattern, options: []) let matches = regex.matchesInString(string, options: [], range: NSMakeRange(0, string.characters.count)) func frameOfTextInRange(range:NSRange, inTextView textView:UITextView) -> CGRect { let beginning = textView.beginningOfDocument let start = textView.positionFromPosition(beginning, offset: range.location)! let end = textView.positionFromPosition(start, offset: range.length)! let textRange = textView.textRangeFromPosition(start, toPosition: end)! let rect = textView.firstRectForRange(textRange) return textView.convertRect(rect, fromView: textView) } for m in matches { let range = m.range var frame = frameOfTextInRange(range, inTextView: textView) frame = CGRectInset(frame, CGFloat(-1.2), CGFloat(2)) frame = CGRectOffset(frame, CGFloat(0), CGFloat(2)) let v = UIView(frame: frame) v.layer.cornerRadius = 2 v.backgroundColor = UIColor(hue: 0.66, saturation: 0.6, brightness: 1, alpha: 1) textViewBG.addSubview(v) } textViewBG.addSubview(textView) 

在这里输入图像说明


增加词语之间的空白,我们可以改变空白的字距

 import UIKit func frameOfTextInRange(range:NSRange, inTextView textView:UITextView) -> CGRect { let beginning = textView.beginningOfDocument let start = textView.positionFromPosition(beginning, offset: range.location)! let end = textView.positionFromPosition(start, offset: range.length)! let textRange = textView.textRangeFromPosition(start, toPosition: end)! let rect = textView.firstRectForRange(textRange) return textView.convertRect(rect, fromView: textView) } let string = "Lorem ipsum dolor sit amet" let textView = UITextView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) textView.backgroundColor = UIColor.clearColor() textView.attributedText = { let attributedString = NSMutableAttributedString(string: string) let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.lineHeightMultiple = 1.25 attributedString.addAttribute(NSParagraphStyleAttributeName, value: paragraphStyle, range: NSMakeRange(0, string.characters.count)) attributedString.addAttribute(NSForegroundColorAttributeName, value: UIColor.whiteColor(), range: NSMakeRange(0, string.characters.count)) let regex = try! NSRegularExpression(pattern: "\\s", options: []) let matches = regex.matchesInString(string, options: [], range: NSMakeRange(0, string.characters.count)) for m in matches { attributedString.addAttribute(NSKernAttributeName, value: 6, range: m.range) } return NSAttributedString(attributedString: attributedString) }() let textViewBG = UIView(frame: textView.bounds) textViewBG.backgroundColor = UIColor.whiteColor() let pattern = "[^ ]+" let regex = try! NSRegularExpression(pattern: pattern, options: []) let matches = regex.matchesInString(string, options: [], range: NSMakeRange(0, string.characters.count)) for m in matches { textViewBG.addSubview({ let range = m.range var frame = frameOfTextInRange(range, inTextView: textView) frame = CGRectInset(frame, CGFloat(-3), CGFloat(2)) frame = CGRectOffset(frame, CGFloat(0), CGFloat(3)) let v = UIView(frame: frame) v.layer.cornerRadius = 2 v.backgroundColor = UIColor(hue: 211.0/360.0, saturation: 0.35, brightness: 0.78 , alpha: 1) return v }()) } textViewBG.addSubview(textView) 

结果

你将不得不为每个单词创build一个标签….以编程的方式做! 我现在做了,请testing! 希望你喜欢:-)

导入UIKit

 class ViewController: UIViewController { var arrayStrings = [String]() var x : CGFloat = 0 var labelReference = 0 override func viewDidLoad() { super.viewDidLoad() let space = " " let string = "This is the line 1" var word = string.componentsSeparatedByString(space) print (word[0]) // prints "This" print(word[1]) // print "is" for var i = 0; i < word.count ; i++ { arrayStrings.append(word[i]) let characteresCount = word[i].characters.count // change de "9" based on your font size let label = UILabel(frame: CGRectMake(CGFloat(32 + x), 30, CGFloat(characteresCount * 9), 25)) x += label.frame.size.width + 2 label.text = word[i] label.layer label.layer.borderWidth = 1.0 label.layer.cornerRadius = 10 view.addSubview(label) } } }