当用户点击带有 UITextField 的单元格时,在 UITableView 上添加自动完成 list/table
Add auto complete list/table over a `UITableView` when user tap on a cell with `UITextField`
我已经实现了一个自动完成 table,当用户在我的 table 中选择模型字段时它会显示。
但是,我无法控制它的显示方式。我最终希望模型单元格向上滚动到顶部,自动完成 table 显示在它和键盘之间。我尝试的任何事情都不会导致此 table 以那种性质行事。
在此示例中,当用户开始键入 'F'
时,自动完成 table 显示在 header 标题下
自动完成 table 已初始化,然后隐藏。只有当模型文本字段开始编辑时它才会显示。
这是创建 table.
的代码
CGRect frameAuto = CGRectMake(0, self.txt_model.frame.origin.y + self.txt_model.frame.size.height, self.view.frame.size.width, self.txt_model.frame.size.height * 3);
self.autocompleteTableView = [[UITableView alloc] initWithFrame:frameAuto style:UITableViewStylePlain];
self.autocompleteTableView.delegate = self;
self.autocompleteTableView.dataSource = self;
self.autocompleteTableView.scrollEnabled = YES;
self.autocompleteTableView.hidden = YES;
[self.view addSubview:self.autocompleteTableView];
我想我需要帮助的是 如何让模型文本字段向上移动到导航栏,显示自动完成 table 然后离开键盘空间?
更新 --
将自动完成table视图添加为附件视图可以做到这一点:
正在创建自动完成 table
self.autocompleteTableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStylePlain];
self.autocompleteTableView.delegate = self;
self.autocompleteTableView.dataSource = self;
self.autocompleteTableView.scrollEnabled = YES;
self.autocompleteTableView.hidden = YES;
[self.view addSubview:self.autocompleteTableView];
设置文本字段
self.txt_model.delegate = self;
self.txt_model.inputView = self.autocompleteTableView;
self.txt_model.inputAccessoryView = self.autocompleteTableView;
文本域委托
-(void)textFieldDidBeginEditing:(UITextField *)sender {
if(sender == self.txt_model){
NSLog(@"Moving view up");
[self.tblDetailsView scrollToRowAtIndexPath:[NSIndexPath indexPathForRow:3 inSection:0] atScrollPosition:UITableViewScrollPositionTop animated:YES];
}
在输入表单上显示整个自动完成table。
键盘和文本字段都不存在。
我不认为创建 UITableView
并将其添加到现有 UITableView
之上是个好主意。对于您想要实现的目标,我建议使用以下两个选项。
选项1修改现有的UITableView
:
您可以为 table 视图定义两种模式。以及普通模式和编辑模式。
在正常模式下,您按原样显示 table 视图。当用户点击文本字段时,我们将进入编辑模式。
在编辑模式下,您执行以下操作,
- 将用户点击的行显示为第一行(第 0 行)。
- 在下方显示自动完成选项(第 1、2、3 行...)。
用户将通过点击自动完成选项行之一或按键盘上的回车键以指示完成键入并返回正常模式来进入退出编辑模式。
选项 2 导航到新视图:
您可以使用自动完成选项导航到新的 table 视图。当用户完成编辑(在其中一行完成输入或 select 时,返回上一个视图并更新 table 视图。我个人更喜欢第二种方法。但这两种方法都需要一定量的工作。
要获得您正在寻找的效果,您可以尝试将其设置为您正在编辑的 UITextField 上的 inputAccessoryView。这会将它直接粘在键盘的顶部。我不确定 UITableView 作为 inputAccessoryView 的效果如何,但它可能值得一试。
self.textView.inputAccessoryView = autocompleteTableView
我已经实现了一个自动完成 table,当用户在我的 table 中选择模型字段时它会显示。
但是,我无法控制它的显示方式。我最终希望模型单元格向上滚动到顶部,自动完成 table 显示在它和键盘之间。我尝试的任何事情都不会导致此 table 以那种性质行事。
在此示例中,当用户开始键入 'F'
时,自动完成 table 显示在 header 标题下自动完成 table 已初始化,然后隐藏。只有当模型文本字段开始编辑时它才会显示。
这是创建 table.
的代码 CGRect frameAuto = CGRectMake(0, self.txt_model.frame.origin.y + self.txt_model.frame.size.height, self.view.frame.size.width, self.txt_model.frame.size.height * 3);
self.autocompleteTableView = [[UITableView alloc] initWithFrame:frameAuto style:UITableViewStylePlain];
self.autocompleteTableView.delegate = self;
self.autocompleteTableView.dataSource = self;
self.autocompleteTableView.scrollEnabled = YES;
self.autocompleteTableView.hidden = YES;
[self.view addSubview:self.autocompleteTableView];
我想我需要帮助的是 如何让模型文本字段向上移动到导航栏,显示自动完成 table 然后离开键盘空间?
更新 -- 将自动完成table视图添加为附件视图可以做到这一点:
正在创建自动完成 table
self.autocompleteTableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStylePlain];
self.autocompleteTableView.delegate = self;
self.autocompleteTableView.dataSource = self;
self.autocompleteTableView.scrollEnabled = YES;
self.autocompleteTableView.hidden = YES;
[self.view addSubview:self.autocompleteTableView];
设置文本字段
self.txt_model.delegate = self;
self.txt_model.inputView = self.autocompleteTableView;
self.txt_model.inputAccessoryView = self.autocompleteTableView;
文本域委托
-(void)textFieldDidBeginEditing:(UITextField *)sender {
if(sender == self.txt_model){
NSLog(@"Moving view up");
[self.tblDetailsView scrollToRowAtIndexPath:[NSIndexPath indexPathForRow:3 inSection:0] atScrollPosition:UITableViewScrollPositionTop animated:YES];
}
在输入表单上显示整个自动完成table。
键盘和文本字段都不存在。
我不认为创建 UITableView
并将其添加到现有 UITableView
之上是个好主意。对于您想要实现的目标,我建议使用以下两个选项。
选项1修改现有的UITableView
:
您可以为 table 视图定义两种模式。以及普通模式和编辑模式。
在正常模式下,您按原样显示 table 视图。当用户点击文本字段时,我们将进入编辑模式。
在编辑模式下,您执行以下操作,
- 将用户点击的行显示为第一行(第 0 行)。
- 在下方显示自动完成选项(第 1、2、3 行...)。
用户将通过点击自动完成选项行之一或按键盘上的回车键以指示完成键入并返回正常模式来进入退出编辑模式。
选项 2 导航到新视图:
您可以使用自动完成选项导航到新的 table 视图。当用户完成编辑(在其中一行完成输入或 select 时,返回上一个视图并更新 table 视图。我个人更喜欢第二种方法。但这两种方法都需要一定量的工作。
要获得您正在寻找的效果,您可以尝试将其设置为您正在编辑的 UITextField 上的 inputAccessoryView。这会将它直接粘在键盘的顶部。我不确定 UITableView 作为 inputAccessoryView 的效果如何,但它可能值得一试。
self.textView.inputAccessoryView = autocompleteTableView