如何垂直居中 UITextField 文本？

我只是实例化一个 UITextField，并注意到文本没有垂直居中。相反，它与我的按钮顶部齐平，我觉得有点奇怪，因为我希望默认的垂直居中。如何使其垂直居中，还是缺少某种默认设置？

69537 次浏览
小开
最佳答案 
textField.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;

快速使用:

textField.contentVerticalAlignment = UIControlContentVerticalAlignment.center
小开

这对 textField 的文本很有用。但是，如果您想使用占位符文本(文本将出现而 textfield 是空白的) ，在 iOS7上您将遇到问题。

我通过重写 TextField 类和

- (void) drawPlaceholderInRect:(CGRect)rect

方法。

像这样:

- (void) drawPlaceholderInRect:(CGRect)rect
{
[[UIColor blueColor] setFill];
CGRect placeholderRect = CGRectMake(rect.origin.x, (rect.size.height- self.font.pointSize)/2, rect.size.width, self.font.pointSize);
[[self placeholder] drawInRect:placeholderRect withFont:self.font lineBreakMode:NSLineBreakByWordWrapping alignment:self.textAlignment];
}

适用于 iOS7和早期版本。

小开

在故事板中: 在控制之下-> 根据你的需要改变纵向和横向的对齐方式。

enter image description here

小开

这可能带来了几个复杂的因素，其中一些在以前的答案中提到过:

  • 你要排列的东西(只是数字，只是字母，只是大写字母或混合)
  • 占位符
  • 清除按钮

你试图对齐的内容很重要，因为字体中的哪个点应该垂直居中，这是由于行高、上行线、下行线等原因。
vertical font characteristics
(资料来源: Ilovetypography.com)

(图片感谢 http://ilovetypography.com/2009/01/14/inconspicuous-vertical-metrics/)

例如，当您只处理数字时，标准的中心对齐方式看起来就不太正确。比较下面两个对齐方式的不同(在下面的代码中) ，一个看起来正确，另一个看起来有点不对:

混合使用字母不太合适:

letters not looking centered

但如果只是数字看起来还不错

numbers looking centered

所以，不幸的是，它可能需要一点试错和手动调整，使它看起来视觉正确。

我将下面的代码放在 UITextField 的一个子类中。它调用超类方法，因为它考虑到了正在出现的 clear 按钮。

override func awakeFromNib() {
contentVerticalAlignment = UIControlContentVerticalAlignment.Center
}


override func textRectForBounds(bounds: CGRect) -> CGRect {
let boundsWithClear = super.textRectForBounds(bounds)
let delta = CGFloat(1)
return CGRect(x: boundsWithClear.minX, y: delta, width: boundsWithClear.width, height: boundsWithClear.height - delta/2)
}


override func editingRectForBounds(bounds: CGRect) -> CGRect {
let boundsWithClear = super.editingRectForBounds(bounds)
let delta = CGFloat(1)
return CGRect(x: boundsWithClear.minX, y: delta, width: boundsWithClear.width, height: boundsWithClear.height - delta/2)
}


override func placeholderRectForBounds(bounds: CGRect) -> CGRect {
let delta = CGFloat(1)
return CGRect(x: bounds.minX, y: delta, width: bounds.width, height: bounds.height - delta/2)
}
小开

您还可以通过调整文本基线来解决这个问题。

// positive： up， negative：down
// NSAttributedStringKey.baselineOffset:0


let attDic: [NSAttributedString.Key: Any] = [
.font: UIFont.systemFont(ofSize: 16),
.baselineOffset: 0
];


textfield.placeholder = NSAttributedString(string: "....", attributes:  attDic);

提交答案