ios 在uilabel周围只绘制上、右和下边框

zzwlnbp8  于 2023-03-09  发布在  iOS
关注(0)|答案(9)|浏览(229)

我尝试为uilabel添加边框,但我只希望有top, right, and bottom边框。
像这样

----------------
                          |
            I am a label  |
                          |
           ----------------

我尝试使用这些代码,但默认情况下会添加所有4个边

myLabel.layer.borderWidth = 1;
    myLabel.layer.borderColor = [UIColor blackColor];

是不是我只能加3条边,或者1条或2条边?
谢谢!

lzfw57am

lzfw57am1#

你可以用一个面具。这是我用来测试理论的代码,它运行得很好:

// Define the border width in a variable, we'll be using it elsewhere
CGFloat borderWidth = 1.0;

// This creates a testing view to test the theory, in your case this will be your UILabel
UIView* view = [[UIView alloc] initWithFrame:CGRectMake(20, 60, 250, 100)];
view.layer.borderColor = [UIColor blackColor].CGColor;
view.layer.borderWidth = borderWidth;
[self.view addSubview:view];

// Create the mask to cover the area of the view you want to **show**
// Here, we create a mask that covers most of the view, except the left edge
// The mask needs to be coloured in black, as black acts as transparent, whereas white is opaque in mask parlance
UIView* mask = [[UIView alloc] initWithFrame:CGRectMake(borderWidth, 0, view.frame.size.width - borderWidth, view.frame.size.height)];
mask.backgroundColor = [UIColor blackColor];
view.layer.mask = mask.layer;

您可以调整蒙版的大小和位置(给定borderWidth)以显示/隐藏您感兴趣的边框边缘。上面的示例隐藏了左边缘。

nr9pn0ug

nr9pn0ug2#

你必须调整大小,但这是它的要点。(可能是一些错别字)

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 35)];
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 15, 320, 20)];

CALayer *bottomBorder = [CALayer layer];
bottomBorder.frame = CGRectMake(0, 40, 320, .5);

CALayer *rightBorder = [CALayer layer];
rightBorder.frame = CGRectMake(320, 0, 40, .5);

CALayer *topBorder = [CALayer layer];
topBorder.frame = CGRectMake(0, 0, 320, .5);

[view.layer addSublayer:bottomBorder];
[view.layer addSublayer:topBorder];
[view.layer addSublayer:rightBorder];
[view.layer addSublayer:label];
qco9c6ql

qco9c6ql3#

通过创建一个使用UIBezierPath的CALayer,你可以用一条线画出三条边。在所有的例子中,包括QuartzCore框架作为你项目的一部分。
以原始代码为起点:

// at the top of the file with this code, include:
#import <QuartzCore/QuartzCore.h>

CGRect rect = myLabel.frame;

UIBezierPath * linePath = [UIBezierPath bezierPath];

// start at top left corner
[linePath moveToPoint:CGPointMake(0,0);
// draw top line across
[linePath addLineToPoint:CGPointMake(rect.size.width, 0);
// draw right vertical side
[linePath addLineToPoint:CGPointMake(rect.size.width, rect.size.height);
// draw left vertical side
[linePath addLineToPoint:CGPointMake(0, rect.size.height);

// draw from bottom right corner back to bottom left corner
[linePath addLineToPoint:CGPointMake(0, rect.size.height);

// create a layer that uses your defined path
CAShapeLayer * lineLayer = [CAShapeLayer layer];
lineLayer.lineWidth = 1.0;
lineLayer.strokeColor = [UIColor blackColor].CGColor;

lineLayer.fillColor = nil;
lineLayer.path = linePath.CGPath;

[myLabel.layer addSublayer:lineLayer];
kulphzqa

kulphzqa4#

我用的是雨燕3号。

// myLabel is a UILabel
let frame = myLabel.frame //Frame of label

// Bottom Layer
let bottomLayer = CALayer()
bottomLayer.frame = CGRect(x: 0, y: frame.height - 1, width: frame.width, height: 1)
bottomLayer.backgroundColor = UIColor.black.cgColor
myLabel.layer.addSublayer(bottomLayer)

// Top Layer
let topLayer = CALayer()
topLayer.frame = CGRect(x: 0, y: 0, width: frame.width, height: 1)
topLayer.backgroundColor = UIColor.black.cgColor
myLabel.layer.addSublayer(topLayer)

同样:

// Right Layer
let rightLayer = CALayer()
rightLayer.frame = CGRect(x: frame.width - 1, y: 0, width: 1, height: frame.height)
rightLayer.backgroundColor = UIColor.black.cgColor
myLabel.layer.addSublayer(rightLayer)

其中1是边框的宽度。

h22fl7wq

h22fl7wq5#

给你们!希望这对你们有帮助,把这个添加到UItextfield重写类里面

UIView *view = [[UIView alloc] init];
view.translatesAutoresizingMaskIntoConstraints = NO;
view.layer.borderWidth = 1;
view.backgroundColor = [UIColor blackColor];
[self addSubview:view];

[self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0]];
[self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0.0]];
[self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeHeight multiplier:1.0 constant:1.0]];
[self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:1.0]];
uqjltbpv

uqjltbpv6#

谢谢@jaiswal,我用你的代码创建了一个函数,因为我有10多个UILabel,我把它放在这里作为参考。

func buttomBoarder(label: UILabel) -> UILabel {
    let frame = label.frame

    let bottomLayer = CALayer()
    bottomLayer.frame = CGRect(x: 0, y: frame.height - 1, width: frame.width, height: 1)
    bottomLayer.backgroundColor = UIColor.black.cgColor
    label.layer.addSublayer(bottomLayer)

    return label

}

调用使用

labelName = buttomBoarder(label: labelName)
sq1bmfud

sq1bmfud7#

您可以子类化UILabel并覆盖drawRect:来做这件事
或者你可以只制作3个带有黑色背景的UIView作为这个标签的子视图。如果你在它们上面正确地设置autoresizingMask,它们将根据标签大小的变化进行调整。上边框应该有灵活的宽度和灵活的下边距,下边框应该有灵活的宽度和灵活的上边距,右边框应该有灵活的高度和灵活的左边距。

tyu7yeag

tyu7yeag8#

您可以通过多种方式来完成此操作:第一种方法是最简单的,只需找到一个看起来像你的边框的图像。然后将它添加到你的UILabel后面的UIImageView中。第二种方法是覆盖UILabel drawRect:然后根据你的需要画斯托克。

h7wcgrx3

h7wcgrx39#

对uilabel进行简单扩展可以解决导入UIKit的问题

extension UILabel {
    
    func bottomBorder(with borderColor: UIColor, and borderWidth: CGFloat = 1.0){
        let bottomBorder = CALayer()
        bottomBorder.frame = CGRect(x: 0, y: self.frame.size.height - borderWidth, width: self.frame.size.width, height:borderWidth)
        bottomBorder.backgroundColor = borderColor.cgColor
        self.layer.addSublayer(bottomBorder)
    }
}

相关问题