登录界面都会有两个输入框,我要实现的如下图。
使用一个textField就可以实现,并不需要嵌套。
设置textField的背景图片,人和钥匙是否在背景图片里,并不重要。如果在背景图片里,我们只需要设置用户的输入区域。如果不在背景图片里面,将其设置成为textFieldleftView就可以了。
self.accountTextField.leftViewMode = UITextFieldViewModeAlways;
self.passwordTextField.leftViewMode = UITextFieldViewModeAlways;
self.accountTextField.leftView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"login_account"]];
self.passwordTextField.leftView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"login_passwprd"]];
圆角背景图片的大小如果比较小,可以尝试使用
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets,这个方法可以控制图片的拉伸范围,类似于android的.9图片。
接下来就是调整leftView、placeholder和textField接受输入的区域(这个是可以控制的,默认输入区域等同其bounds)。为了实现这一点,我们需要继承textField并重写以下方法
//leftView的区域
-(CGRect)leftViewRectForBounds:(CGRect)bounds
{
CGRect rect = [super leftViewRectForBounds:bounds];
rect.origin.x = rect.origin.x + 20;
return rect;
}
//文字显示区域
-(CGRect)textRectForBounds:(CGRect)bounds
{
CGRect rect = [super textRectForBounds:bounds];
rect.origin.x = rect.origin.x + 10;
return rect;
}
//编辑区域
-(CGRect)editingRectForBounds:(CGRect)bounds
{
CGRect rect = [super editingRectForBounds:bounds];
rect.origin.x = rect.origin.x + 10;
return rect;
}
然后,我们还需要调整textField的tintColor,调整光标颜色。直接在xib中设置,选了其他的颜色,最终显示的不是那个样子,使用代码设置没有问题。
textField相关的实现有一些地方值得注意,主要是要能使用户很方便的完成输入登录这个过程。