作者.jpg
- 由于這些都是一些很基礎(chǔ)的東西,所以我們這邊很快的簡(jiǎn)述一下,最主要是后面的UI高級(jí),網(wǎng)絡(luò)多線程這反面的文章,所以快速的講解控件這方面的,通過一個(gè)小案例來講解UITxetField控件,直接上代碼:
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 搭建用戶登錄界面
// 1.創(chuàng)建用戶名輸入框
UITextField *userNameTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 120, 240, 40)];
// 2.創(chuàng)建密碼輸入框
UITextField *passWordTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 200, 240, 40)];
// 3.設(shè)置文本輸入框的風(fēng)格
userNameTextField.borderStyle = UITextBorderStyleRoundedRect;
passWordTextField.borderStyle = UITextBorderStyleRoundedRect;
// 4設(shè)置輸入框默認(rèn)提示文字
userNameTextField.placeholder = @"請(qǐng)輸入用戶名";
passWordTextField.placeholder = @"請(qǐng)輸入密碼";
// 4.1設(shè)置passWordTextField為密碼模式
passWordTextField.secureTextEntry = YES;
[self.view addSubview:userNameTextField];
[self.view addSubview:passWordTextField];
// 5.創(chuàng)建登錄按鈕
UIButton *loginBtn = [UIButton buttonWithType:UIButtonTypeSystem];
loginBtn.frame = CGRectMake(110, 260, 100, 30);
[loginBtn setTitle:@"登錄" forState:UIControlStateNormal];
[self.view addSubview:loginBtn];
// 6.設(shè)置掛件
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設(shè)置輸入框的視圖
userNameTextField.leftViewMode = UITextFieldViewModeAlways;
passWordTextField.leftViewMode = UITextFieldViewModeAlways;
// 掛件枚舉值解釋
// UITextFieldViewModeNever, 在任何狀態(tài)下都不顯示
// UITextFieldViewModeWhileEditing,正處于編輯是顯示
// UITextFieldViewModeUnlessEditing,非編輯狀態(tài)下顯示
// UITextFieldViewModeAlways 始終顯示
}
-
運(yùn)行代碼如圖
Snip20161209_10.png 如何去監(jiān)聽用戶的輸入操作,可以通過UITxetFieldDelegate協(xié)議來管理,代理模式在之前的搜索框控件已經(jīng)有講述過了.代理方法主要用作當(dāng)用戶與系統(tǒng)控件進(jìn)行交互式產(chǎn)生的回調(diào)處理.直接上代碼演示:
- (void)viewDidLoad {
[super viewDidLoad];
// 設(shè)置界面
[self setupUI];
}
// 設(shè)置UI界面
- (void)setupUI {
// 搭建用戶登錄界面
// 1.創(chuàng)建用戶名輸入框
UITextField *userNameTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 120, 240, 40)];
// 2.創(chuàng)建密碼輸入框
UITextField *passWordTextField = [[UITextField alloc] initWithFrame:CGRectMake(40, 200, 240, 40)];
// 3.設(shè)置文本輸入框的風(fēng)格
userNameTextField.borderStyle = UITextBorderStyleRoundedRect;
passWordTextField.borderStyle = UITextBorderStyleRoundedRect;
// 4設(shè)置輸入框默認(rèn)提示文字
userNameTextField.placeholder = @"請(qǐng)輸入用戶名";
passWordTextField.placeholder = @"請(qǐng)輸入密碼";
// 4.1設(shè)置passWordTextField為密碼模式
passWordTextField.secureTextEntry = YES;
[self.view addSubview:userNameTextField];
[self.view addSubview:passWordTextField];
// 5.創(chuàng)建登錄按鈕
UIButton *loginBtn = [UIButton buttonWithType:UIButtonTypeSystem];
loginBtn.frame = CGRectMake(110, 260, 100, 30);
[loginBtn setTitle:@"登錄" forState:UIControlStateNormal];
[self.view addSubview:loginBtn];
// 6.設(shè)置掛件
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設(shè)置輸入框的視圖
userNameTextField.leftViewMode = UITextFieldViewModeAlways;
passWordTextField.leftViewMode = UITextFieldViewModeAlways;
_userNameTextField = userNameTextField;
_passWordTextField = passWordTextField;
// 設(shè)置代理
userNameTextField.delegate = self;
}
// 實(shí)現(xiàn)代理方法
// 設(shè)置輸入框是否可被修改，return no將無法修改，不出現(xiàn)鍵盤。默認(rèn)yes可以修改
- (BOOL)textFieldShouldBeginEditing:(UITextField*)textField {
return YES;
}
// 點(diǎn)擊輸入框時(shí)執(zhí)行此方法
- (void)textFieldDidBeginEditing:(UITextField*)textField {
}
// 是否允許結(jié)束編輯，允許的話，將會(huì)失去first responder 第一響應(yīng)者（比如鍵盤）
- (BOOL)textFieldShouldEndEditing:(UITextField*)textField {
return YES;
}
// 結(jié)束編輯(失去第一響應(yīng)者時(shí)執(zhí)行)
- (void)textFieldDidEndEditing:(UITextField*)textField {
}
// 得到用戶輸入字符
- (BOOL)textField:(UITextField*)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString*)string {
return YES;
}
// 當(dāng)用戶全部清空的時(shí)候的時(shí)候會(huì)調(diào)用
- (BOOL)textFieldShouldClear:(UITextField*)textField {
return YES;
}
// 點(diǎn)擊Return鍵（標(biāo)志著編輯已經(jīng)結(jié)束了），隱藏鍵盤
- (BOOL)textFieldShouldReturn:(UITextField*)textField {
[textField resignFirstResponder];
return YES;
}
- 最近我發(fā)現(xiàn)很多app存在一個(gè)問題,就是輸入完之后,先要退出鍵盤,卻無法退出,其中微信發(fā)紅包界面就存在這個(gè)bug,令人真的很不爽,所以我這邊也特意的講一下,然后通過點(diǎn)擊屏幕收起鍵盤.
- 想要實(shí)現(xiàn)這個(gè)功能,那么這需要重寫UIViewController中的一個(gè)手勢(shì)方法,在這個(gè)方法中,進(jìn)行UITextField 控件注銷第一響應(yīng)者的操作,直接上代碼:
// 重寫touchBegin方法
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
[self.userNameTextField resignFirstResponder];
[self.passWordTextField resignFirstResponder];
}
- 上面的代碼就可以實(shí)現(xiàn)點(diǎn)擊屏幕進(jìn)行收鍵盤的操作了
- 具體如圖
收鍵盤操作.gif
- UITxetField控件就見到這吧,有需要更多的了解,或者后面更高級(jí)文章的改進(jìn),歡迎留言評(píng)論,謝謝!
