iOS深挖placeholder设置

placeholder基本设置

  • 颜色

    1
    2
    UIColor * color = [UIColor greenColor];
    [textField setValue:color forKeyPath:@"_placeholderLabel.textColor"];
  • 字体

    1
    2
    UIFont * font = [UIFont boldSystemFontOfSize:16];
    [textField setValue:font forKeyPath:@"_placeholderLabel.font"];
  • 水平居中

    1
    2
    NSNumber * value = [NSNumber numberWithInteger:NSTextAlignmentCenter];
    [textField setValue:value forKeyPath:@"_placeholderLabel.textAlignment"];


但是居右是不可以的!不知原因…
还有一种比较灵活的方法下面介绍,后面介绍…

  • 垂直居中
    placeholderUITextField中的位置是以输入文字光标的上端点作为它的显示位置,所以当我们设置的placeholder字体大小与textField设置的输入文字大小有差异时,placeholder的显示位置就不会垂直居中而发生向下偏移。

关于placeholder位置调整的解决方法:

首先我们需要创建一个继承于UITextField的新的TextField,我这里命名为CustomTextField
为什么要定义一个新的类呢?因为我们要重写UITextField的一些函数来达到我们想要的效果。目前只有通过这种方式才能很准确的调整placeholder的位置。

下面介绍一下需要重写的两个函数:

1
2
3
4
5
6
7
8
9
10
11
12
@implementation CustomTextField

// 返回placeholderLabel的bounds,改变返回值,是调整placeholderLabel的位置
- (CGRect)placeholderRectForBounds:(CGRect)bounds {
    return CGRectMake(0, 0 , self.bounds.size.width, self.bounds.size.height);
}
// 这个函数是调整placeholder在placeholderLabel中绘制的位置以及范围
- (void)drawPlaceholderInRect:(CGRect)rect {
    [super drawPlaceholderInRect:CGRectMake(0, -6 , self.bounds.size.width, self.bounds.size.height)];
}

@end

注意:被重写函数中的CGRectMake()的值是需要根据你自己的需求进行调整的,并不是固定值。其实不难发现通过这种方式我们可以调整placeholder到任意位置,不单单是居中效果。
至于CustomTextField的使用和正常UITextField的使用是一样的,这里不贴它的使用代码了。

通过代码中的注释我们可以知道这两个被我们重写的函数的作用,其实正常使用时这两个函数并不需要同时调整,我们可以通过重写其中一个函数就可以调整placeholder的位置,当然你也可以同时重写这两个函数来调整你的placeholder到指定的位置。

下面再补充一个我们平时比较头疼问题的解决办法:
在我们使用原生UITextField的时候,不管是输入文字还是placeholder都是紧挨着UITextField的边缘的,就像上面效果中文字都是紧挨着输入框的左侧边缘的,看起来很丑。

那么我们通过重写方法,给UITextField添加一个左边距,如下

1
2
3
4
5
6
7
8
9
10
11
12
@implementation CustomTextField

// 控制还未输入时文本的位置,缩进40
- (CGRect)textRectForBounds:(CGRect)bounds {
    return CGRectInset( bounds, 40, 0);
}
// 控制输入后文本的位置,缩进20
- (CGRect)editingRectForBounds:(CGRect)bounds {
    return CGRectInset( bounds, 20, 0);
}

@end


从效果图中可以看出在鼠标还没点击输入框的时候文字缩进距离是40,当点击输入框出现光标后,文字的缩进距离是20

而且我们也看到了效果中placeholder没有垂直居中,那是因为为了看到输入前和输入后的缩进不同距离的效果我将之前重写的:
- (CGRect)placeholderRectForBounds:(CGRect)bounds
- (void)drawPlaceholderInRect:(CGRect)rect
函数注释掉了。因为这两个函数会令我们刚才设置的输入前的缩进距离失效。

关于placeholder如果你有好的方法可以在评论区留言,大家一起来探讨。

版权声明:出自Jerry LMJ的原创作品,未经作者允许不得转载。

当前网速较慢或者你使用的浏览器不支持博客特定功能,请尝试刷新或换用Chrome、Firefox等现代浏览器