作者.jpg
- 由于这些都是一些很基础的东西,所以我们这边很快的简述一下,最主要是后面的UI高级,网络多线程这反面的文章,所以快速的讲解控件这方面的,通过一个小案例来讲解UITxetField控件,直接上代码:
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 搭建用户登录界面
// 1.创建用户名输入框
UITextField *userNameTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 120, 240, 40)];
// 2.创建密码输入框
UITextField *passWordTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 200, 240, 40)];
// 3.设置文本输入框的风格
userNameTextField.borderStyle = UITextBorderStyleRoundedRect;
passWordTextField.borderStyle = UITextBorderStyleRoundedRect;
// 4设置输入框默认提示文字
userNameTextField.placeholder = @"请输入用户名";
passWordTextField.placeholder = @"请输入密码";
// 4.1设置passWordTextField为密码模式
passWordTextField.secureTextEntry = YES;
[self.view addSubview:userNameTextField];
[self.view addSubview:passWordTextField];
// 5.创建登录按钮
UIButton *loginBtn = [UIButton buttonWithType:UIButtonTypeSystem];
loginBtn.frame = CGRectMake(110, 260, 100, 30);
[loginBtn setTitle:@"登录" forState:UIControlStateNormal];
[self.view addSubview:loginBtn];
// 6.设置挂件
UIImageView *userImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
userImageView.image = [UIImage imageNamed:@"user"];
userNameTextField.leftView = userImageView;
UIImageView *passWordImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
passWordImageView.image = [UIImage imageNamed:@"password"];
passWordTextField.leftView = passWordImageView;
// 6.1设置输入框的视图
userNameTextField.leftViewMode = UITextFieldViewModeAlways;
passWordTextField.leftViewMode = UITextFieldViewModeAlways;
// 挂件枚举值解释
// UITextFieldViewModeNever, 在任何状态下都不显示
// UITextFieldViewModeWhileEditing,正处于编辑是显示
// UITextFieldViewModeUnlessEditing,非编辑状态下显示
// UITextFieldViewModeAlways 始终显示
}
-
运行代码如图
Snip20161209_10.png 如何去监听用户的输入操作,可以通过UITxetFieldDelegate协议来管理,代理模式在之前的搜索框控件已经有讲述过了.代理方法主要用作当用户与系统控件进行交互式产生的回调处理.直接上代码演示:
- (void)viewDidLoad {
[super viewDidLoad];
// 设置界面
[self setupUI];
}
// 设置UI界面
- (void)setupUI {
// 搭建用户登录界面
// 1.创建用户名输入框
UITextField *userNameTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 120, 240, 40)];
// 2.创建密码输入框
UITextField *passWordTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 200, 240, 40)];
// 3.设置文本输入框的风格
userNameTextField.borderStyle = UITextBorderStyleRoundedRect;
passWordTextField.borderStyle = UITextBorderStyleRoundedRect;
// 4设置输入框默认提示文字
userNameTextField.placeholder = @"请输入用户名";
passWordTextField.placeholder = @"请输入密码";
// 4.1设置passWordTextField为密码模式
passWordTextField.secureTextEntry = YES;
[self.view addSubview:userNameTextField];
[self.view addSubview:passWordTextField];
// 5.创建登录按钮
UIButton *loginBtn = [UIButton buttonWithType:UIButtonTypeSystem];
loginBtn.frame = CGRectMake(110, 260, 100, 30);
[loginBtn setTitle:@"登录" forState:UIControlStateNormal];
[self.view addSubview:loginBtn];
// 6.设置挂件
UIImageView *userImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
userImageView.image = [UIImage imageNamed:@"user"];
userNameTextField.leftView = userImageView;
UIImageView *passWordImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
passWordImageView.image = [UIImage imageNamed:@"password"];
passWordTextField.leftView = passWordImageView;
// 6.1设置输入框的视图
userNameTextField.leftViewMode = UITextFieldViewModeAlways;
passWordTextField.leftViewMode = UITextFieldViewModeAlways;
_userNameTextField = userNameTextField;
_passWordTextField = passWordTextField;
// 设置代理
userNameTextField.delegate = self;
}
// 实现代理方法
// 设置输入框是否可被修改，return no将无法修改，不出现键盘。默认yes可以修改
- (BOOL)textFieldShouldBeginEditing:(UITextField*)textField {
return YES;
}
// 点击输入框时执行此方法
- (void)textFieldDidBeginEditing:(UITextField*)textField {
}
// 是否允许结束编辑，允许的话，将会失去first responder 第一响应者（比如键盘）
- (BOOL)textFieldShouldEndEditing:(UITextField*)textField {
return YES;
}
// 结束编辑(失去第一响应者时执行)
- (void)textFieldDidEndEditing:(UITextField*)textField {
}
// 得到用户输入字符
- (BOOL)textField:(UITextField*)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString*)string {
return YES;
}
// 当用户全部清空的时候的时候会调用
- (BOOL)textFieldShouldClear:(UITextField*)textField {
return YES;
}
// 点击Return键（标志着编辑已经结束了），隐藏键盘
- (BOOL)textFieldShouldReturn:(UITextField*)textField {
[textField resignFirstResponder];
return YES;
}
- 最近我发现很多app存在一个问题,就是输入完之后,先要退出键盘,却无法退出,其中微信发红包界面就存在这个bug,令人真的很不爽,所以我这边也特意的讲一下,然后通过点击屏幕收起键盘.
- 想要实现这个功能,那么这需要重写UIViewController中的一个手势方法,在这个方法中,进行UITextField 控件注销第一响应者的操作,直接上代码:
// 重写touchBegin方法
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
[self.userNameTextField resignFirstResponder];
[self.passWordTextField resignFirstResponder];
}
- 上面的代码就可以实现点击屏幕进行收键盘的操作了
- 具体如图
收键盘操作.gif
- UITxetField控件就见到这吧,有需要更多的了解,或者后面更高级文章的改进,欢迎留言评论,谢谢!
