仅底部的UITextField边框 [英] UITextField border for bottom side only
问题描述
我想仅在 UITextField 中保留底部边框。
但是我不知道我们怎么能把它放在最底层。
I would like to keep the border at bottom part only in UITextField.
But I don't know how we can keep it on the bottom side.
你能告诉我吗？
推荐答案
新方法:(推荐）
最后，我找到了另一种方法，它是更简单方便。但唯一的条件是 UITextField 必须包含自动布局。
New Approach: (Recommended)
Eventually, I found one more way to do this, it is more simple and convenient. But the only condition is the UITextField must contain an auto layout.
我在这里使用视觉格式语言（VFL），这将允许在任何 UIControl 中添加一行。
I am using Visual Formatting Language (VFL) here, This will allow adding a line to any UIControl.
帮助方法：
您可以将此辅助方法添加到全局帮助程序类（我使用全局类方法）或在同一视图控制器中（使用实例方法）。
You can add this helper method to your global helper class(I used global class method) or in the same view controller(using an instance method).
typedef enum : NSUInteger {
LINE_POSITION_TOP,
LINE_POSITION_BOTTOM
} LINE_POSITION;
- (void) addLineToView:(UIView *)view atPosition:(LINE_POSITION)position withColor:(UIColor *)color lineWitdh:(CGFloat)width {
// Add line
UIView *lineView = [[UIView alloc] init];
[lineView setBackgroundColor:color];
[lineView setTranslatesAutoresizingMaskIntoConstraints:NO];
[view addSubview:lineView];
NSDictionary *metrics = @{@"width" : [NSNumber numberWithFloat:width]};
NSDictionary *views = @{@"lineView" : lineView};
[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[lineView]|" options: 0 metrics:metrics views:views]];
switch (position) {
case LINE_POSITION_TOP:
[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[lineView(width)]" options: 0 metrics:metrics views:views]];
break;
case LINE_POSITION_BOTTOM:
[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[lineView(width)]|" options: 0 metrics:metrics views:views]];
break;
default: break;
}
}
用法：
[self addLineToView:self.textField atPosition:LINE_POSITION_TOP withColor:[UIColor darkGrayColor] lineWitdh:0.5];
使用Swift：
助手方法：
enum LINE_POSITION {
case LINE_POSITION_TOP
case LINE_POSITION_BOTTOM
}
func addLineToView(view : UIView, position : LINE_POSITION, color: UIColor, width: Double) {
let lineView = UIView()
lineView.backgroundColor = color
lineView.translatesAutoresizingMaskIntoConstraints = false // This is important!
view.addSubview(lineView)
let metrics = ["width" : NSNumber(value: width)]
let views = ["lineView" : lineView]
view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[lineView]|", options:NSLayoutFormatOptions(rawValue: 0), metrics:metrics, views:views))
switch position {
case .LINE_POSITION_TOP:
view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[lineView(width)]", options:NSLayoutFormatOptions(rawValue: 0), metrics:metrics, views:views))
break
case .LINE_POSITION_BOTTOM:
view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:[lineView(width)]|", options:NSLayoutFormatOptions(rawValue: 0), metrics:metrics, views:views))
break
default:
break
}
}
用法：
self.addLineToView(view: textField, position:.LINE_POSITION_BOTTOM, color: UIColor.darkGray, width: 0.5)
旧方法：
如果您创建，此答案将完美运行UITextField 以编程方式对象。
注意：如果 UITextField 在Storyboard中创建对象，然后在Storyboard Attributes Inspector中将其边框样式属性设置为无。
Note: If UITextField object is created in Storyboard then set its Border Style property to None in Storyboard Attributes Inspector.
以下变量 textField 是 UITextField 控件的对象，其中底部边框将被设置。
The following variable textField is an object of UITextField control in which the bottom border will be set.
Swift代码：
let border = CALayer()
let width = CGFloat(2.0)
border.borderColor = UIColor.darkGray.cgColor
border.frame = CGRect(x: 0, y: textField.frame.size.height - width, width: textField.frame.size.width, height: textField.frame.size.height)
border.borderWidth = width
textField.layer.addSublayer(border)
textField.layer.masksToBounds = true
目标C代码：
CALayer *border = [CALayer layer];
CGFloat borderWidth = 2;
border.borderColor = [UIColor darkGrayColor].CGColor;
border.frame = CGRectMake(0, textField.frame.size.height - borderWidth, textField.frame.size.width, textField.frame.size.height);
border.borderWidth = borderWidth;
[textField.layer addSublayer:border];
textField.layer.masksToBounds = YES;
Xamarin代码：
var border = new CALayer();
nfloat width = 2;
border.BorderColor = UIColor.Black.CGColor;
border.Frame = new CoreGraphics.CGRect(0, textField.Frame.Size.Height - width, textField.Frame.Size.Width, textField.Frame.Size.Height);
border.BorderWidth = width;
textField.Layer.AddSublayer(border);
textField.Layer.MasksToBounds = true;
许多用户遇到自动布局和某些人的问题无法呈现UITextField的边框。以下是解决方案：
Many users had a problem with Auto Layout and some people were not able to render the UITextField's border. Here's the solution:
如果您在中编写以下代码，则viewDidLoad（）方法比你没有得到textField的框架，所以边框将无法正确渲染。
If you write below code in viewDidLoad() method than that time you will not get the frame for textField, So that border will not render properly.
获取正确的框架对于边框，覆盖 viewDidLayoutSubviews（）并在其中编写代码。
To get the correct frame for the border, Override viewDidLayoutSubviews() and write code in it.
viewDidLayoutSubviews（）在将所有子视图加载到视图中后调用的方法。
viewDidLayoutSubviews() method called after all subviews are loaded into view.
不要忘记多次调用此方法并且它不是ViewController的生命周期的一部分，所以在使用它时要小心。
Do not forget that this method is called multiple times and it's not a part of ViewController's life cycle, so be careful while using this.
这篇关于仅底部的UITextField边框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
