Question

我希望得到与此相同的结果：

我已经看到了这个：Draw line in UILabel before and after text，但我想知道是否只有一个UILabel可以做到这一点吗？

Answer 1

这是您要求的自定义视图

import UIKit

class CustomizedUILabel: UIView
{
    let label = UILabel()
    var lineInsideOffset: CGFloat = 20
    var lineOutsideOffset: CGFloat = 4
    var lineHeight: CGFloat = 1
    var lineColor = UIColor.grayColor()

//MARK: - init
    override init(frame: CGRect)
    {
        super.init(frame: frame)
        initLabel()
    }
    required init?(coder aDecoder: NSCoder)
    {
        super.init(coder: aDecoder)
        initLabel()
    }
    convenience init() {self.init(frame: CGRect.zero)}
    func initLabel()
    {
        label.textAlignment = .Center

        label.translatesAutoresizingMaskIntoConstraints = false
        let top = NSLayoutConstraint(item: self, attribute: .Top, relatedBy: .Equal, toItem: label, attribute: .Top, multiplier: 1, constant: 0)
        let bot = NSLayoutConstraint(item: self, attribute: .Bottom, relatedBy: .Equal, toItem: label, attribute: .Bottom, multiplier: 1, constant: 0)
        let lead = NSLayoutConstraint(item: self, attribute: .Leading, relatedBy: .LessThanOrEqual, toItem: label, attribute: .Leading, multiplier: 1, constant: 0)
        let trail = NSLayoutConstraint(item: self, attribute: .Trailing, relatedBy: .GreaterThanOrEqual, toItem: label, attribute: .Trailing, multiplier: 1, constant: 0)
        let centerX = NSLayoutConstraint(item: self, attribute: .CenterX, relatedBy: .Equal, toItem: label, attribute: .CenterX, multiplier: 1, constant: 0)

        addSubview(label)
        addConstraints([top, bot, lead, trail, centerX])

        //... if the opaque property of your view is set to YES, your drawRect: method must totally fill the specified rectangle with opaque content.
        //http://stackoverflow.com/questions/11318987/black-background-when-overriding-drawrect-in-uiscrollview
        opaque = false
    }

//MARK: - drawing
    override func drawRect(rect: CGRect)
    {
        let lineWidth = label.frame.minX - rect.minX - lineInsideOffset - lineOutsideOffset
        if lineWidth <= 0 {return}

        let lineLeft = UIBezierPath(rect: CGRectMake(rect.minX + lineOutsideOffset, rect.midY, lineWidth, 1))
        let lineRight = UIBezierPath(rect: CGRectMake(label.frame.maxX + lineInsideOffset, rect.midY, lineWidth, 1))

        lineLeft.lineWidth = lineHeight
        lineColor.set()
        lineLeft.stroke()

        lineRight.lineWidth = lineHeight
        lineColor.set()
        lineRight.stroke()
    }
}

代码中的用法：在通常情况下，您应该提供top，leading和trailing / width约束，并让CustomizedUILabel通过其内部UILabel来确定高度。让我们在一些视图控制器的viewDidLoad方法中以调试模式显示我们的标签：

override func viewDidLoad()
{
    super.viewDidLoad()

    let customizedLabel = CustomizedUILabel()
    customizedLabel.label.text = "RATE YOUR RIDE"
    customizedLabel.label.textColor = UIColor.grayColor()
    customizedLabel.label.font = customizedLabel.label.font.fontWithSize(25)
    customizedLabel.backgroundColor = UIColor.redColor()
    view.addSubview(customizedLabel)

    customizedLabel.translatesAutoresizingMaskIntoConstraints = false
    let top = NSLayoutConstraint(item: view, attribute: .Top, relatedBy: .Equal, toItem: customizedLabel, attribute: .Top, multiplier: 1, constant: -100)
    let trail = NSLayoutConstraint(item: view, attribute: .Trailing, relatedBy: .Equal, toItem: customizedLabel, attribute: .Trailing, multiplier: 1, constant: 0)
    let lead = NSLayoutConstraint(item: view, attribute: .Leading, relatedBy: .Equal, toItem: customizedLabel, attribute: .Leading, multiplier: 1, constant: 0)
    view.addConstraints([top, trail, lead])
}

xib / storyboard中的用法：只要使用编码器初始化程序实现init，就可以在xib / storyboard中使用此视图。您需要将UIView元素添加到您的超级视图，将此元素的Class分配给CustomizedUILabel，执行约束并设置出口。然后你可以用同样的方式使用它：

@IBOutlet weak var customizedLabel: CustomizedUILabel!

override func viewDidLoad()
{
    super.viewDidLoad()

    customizedLabel.label.text = "RATE YOUR RIDE"
    customizedLabel.label.textColor = UIColor.grayColor()
    customizedLabel.label.font = customizedLabel.label.font.fontWithSize(25)
    customizedLabel.backgroundColor = UIColor.redColor()
}

Answer 2

UILabel * label = [UILabel new];
label.frame = CGRectMake(0,0,0,20);
label.text = @"Rate Your Ride";
[self.view addSubview:label];
[label sizeToFit];

float w = self.view.frame.size.width;
float lw = label.frame.size.width;
float offset = (w-lw)/2;
float padding = 20.0f;

//center the label
[label setFrame:CGRectMake(offset, 0, lw, 20)];

//make the borders
UIImageView * left = [UIImageView new];
left.frame = CGRectMake(0, 9, offset-padding, 2);
left.backgroundColor = [UIColor blackColor];
[self.view addSubview:left];

UIImageView * right = [UIImageView new];
right.frame = CGRectMake(w-offset+padding, 9, offset-padding, 2);
right.backgroundColor = [UIColor blackColor];
[self.view right];

OR

使标签背景与其父级颜色相同，并在其后面添加一行。

UILabel中文本之前和之后的行

2 个答案: