首页 > 代码库 > IOS之表视图添加搜索栏

IOS之表视图添加搜索栏

2024-08-10 10:56:39   219人阅读

       下面是我们要实现的效果。本效果是在上一篇自定义表视图的基础上进行更改的。

技术分享   技术分享

1.将Search bar and search display拖动到ViewController中。不要添加Search Bar.

技术分享

 

2.修改ViewController的头文件

Cpp代码 技术分享 技术分享
  1. #import <UIKit/UIKit.h>  
  2.   
  3. @interface IkrboyViewController4 : UIViewController  
  4. {  
  5.     NSArray *dataArr;//用于显示表视图的数据  
  6.     NSArray *allDataArr;//存储所有数据，通过关键词搜索将搜索结果赋值给dataArr  
  7. }  
  8. @property (weak, nonatomic) IBOutlet UISearchBar *searchBar;  
  9.   
  10. @end  
#import <UIKit/UIKit.h>@interface IkrboyViewController4 : UIViewController{    NSArray *dataArr;//用于显示表视图的数据    NSArray *allDataArr;//存储所有数据，通过关键词搜索将搜索结果赋值给dataArr}@property (weak, nonatomic) IBOutlet UISearchBar *searchBar;@end

 

 3.修改自定义方法initTableViewData。将ScopeBar隐藏是考虑到iphone的显示高度问题。可自行决定。

Cpp代码 技术分享 技术分享
  1. -(void)initTableViewData{  
  2.     NSBundle *bundle = [NSBundle mainBundle];  
  3.     NSString *plistPath = [bundle pathForResource:@"user_head" ofType:@"plist"];  
  4.     allDataArr = [[NSArray alloc] initWithContentsOfFile:plistPath];  
  5.     dataArr = [NSArray arrayWithArray:allDataArr];  
  6.     NSLog(@"table data count = %d",[allDataArr count]);  
  7.       
  8.     //设定搜索栏ScopeBar隐藏  
  9.     [self.searchBar setShowsScopeBar:NO];  
  10.     [self.searchBar sizeToFit];  
  11. }  
-(void)initTableViewData{    NSBundle *bundle = [NSBundle mainBundle];    NSString *plistPath = [bundle pathForResource:@"user_head" ofType:@"plist"];    allDataArr = [[NSArray alloc] initWithContentsOfFile:plistPath];    dataArr = [NSArray arrayWithArray:allDataArr];    NSLog(@"table data count = %d",[allDataArr count]);        //设定搜索栏ScopeBar隐藏    [self.searchBar setShowsScopeBar:NO];    [self.searchBar sizeToFit];}

4.添加SearchBar的三个事件触发

Cpp代码 技术分享 技术分享
  1. //以下三个方法实现SearchBar的搜索功能  
  2. //当文本内容发生改变时候，向表视图数据源发出重新加载消息  
  3. - (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchString:(NSString *)searchString  
  4. {  
  5.     [self filterContentForSearchText:searchString scope:self.searchBar.selectedScopeButtonIndex];  
  6.     //YES情况下表视图可以重新加载  
  7.     return YES;  
  8. }  
  9.   
  10. // 当Scope Bar选择发送变化时候，向表视图数据源发出重新加载消息  
  11. - (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchScope:(NSInteger)searchOption  
  12. {  
  13.     [self filterContentForSearchText:self.searchBar.text scope:searchOption];  
  14.     // YES情况下表视图可以重新加载  
  15.     return YES;  
  16. }  
  17.   
  18. //点击cancel按钮的事件  
  19. - (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar  
  20. {  
  21.     //查询所有  
  22.     [self filterContentForSearchText:@"" scope:-1];  
  23. }  
//以下三个方法实现SearchBar的搜索功能//当文本内容发生改变时候，向表视图数据源发出重新加载消息- (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchString:(NSString *)searchString{    [self filterContentForSearchText:searchString scope:self.searchBar.selectedScopeButtonIndex];    //YES情况下表视图可以重新加载    return YES;}// 当Scope Bar选择发送变化时候，向表视图数据源发出重新加载消息- (BOOL)searchDisplayController:(UISearchDisplayController *)controller shouldReloadTableForSearchScope:(NSInteger)searchOption{    [self filterContentForSearchText:self.searchBar.text scope:searchOption];    // YES情况下表视图可以重新加载    return YES;}//点击cancel按钮的事件- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar{    //查询所有    [self filterContentForSearchText:@"" scope:-1];}

   5.自定义关键词搜索功能

Cpp代码 技术分享 技术分享
  1. //自定义搜索方法，根据关键词从allDataArr中搜索到满足搜索条件的元素，并将匹配的数组赋值给dataArr，由于dataArr是表视图的数据源，因此表视图的记录也会随之改变。  
  2. - (void)filterContentForSearchText:(NSString*)searchText scope:(NSUInteger)scope;  
  3. {  
  4.     if([searchText length]==0)  
  5.     {  
  6.         //查询所有  
  7.         dataArr = [NSArray arrayWithArray:allDataArr];  
  8.         NSLog(@"dataArr count = %d",[dataArr count]);  
  9.         return;  
  10.     }  
  11.       
  12.     NSPredicate *scopePredicate;  
  13.       
  14.     switch (scope) {  
  15.         case 0:  
  16.             scopePredicate = [NSPredicate predicateWithFormat:@"(SELF.itemName contains[c] %@) OR (SELF.itemImagePath contains[c] %@)",searchText,searchText];  
  17.             NSLog(@"searchText=%@",searchText);  
  18.             dataArr =[NSArray arrayWithArray:[allDataArr filteredArrayUsingPredicate:scopePredicate]];  
  19.             break;  
  20.         case 1:  
  21.             scopePredicate = [NSPredicate predicateWithFormat:@"SELF.itemName contains[c] %@",searchText];  
  22.             dataArr = [NSArray arrayWithArray:[allDataArr filteredArrayUsingPredicate:scopePredicate]];  
  23.             break;  
  24.         case 2:  
  25.             scopePredicate = [NSPredicate predicateWithFormat:@"SELF.itemImagePath contains[c] %@",searchText];  
  26.             dataArr =[NSArray arrayWithArray:[allDataArr filteredArrayUsingPredicate:scopePredicate]];  
  27.             break;  
  28.     }  
  29. }  
//自定义搜索方法，根据关键词从allDataArr中搜索到满足搜索条件的元素，并将匹配的数组赋值给dataArr，由于dataArr是表视图的数据源，因此表视图的记录也会随之改变。- (void)filterContentForSearchText:(NSString*)searchText scope:(NSUInteger)scope;{    if([searchText length]==0)    {        //查询所有        dataArr = [NSArray arrayWithArray:allDataArr];        NSLog(@"dataArr count = %d",[dataArr count]);        return;    }        NSPredicate *scopePredicate;        switch (scope) {        case 0:            scopePredicate = [NSPredicate predicateWithFormat:@"(SELF.itemName contains[c] %@) OR (SELF.itemImagePath contains[c] %@)",searchText,searchText];            NSLog(@"searchText=%@",searchText);            dataArr =[NSArray arrayWithArray:[allDataArr filteredArrayUsingPredicate:scopePredicate]];            break;        case 1:            scopePredicate = [NSPredicate predicateWithFormat:@"SELF.itemName contains[c] %@",searchText];            dataArr = [NSArray arrayWithArray:[allDataArr filteredArrayUsingPredicate:scopePredicate]];            break;        case 2:            scopePredicate = [NSPredicate predicateWithFormat:@"SELF.itemImagePath contains[c] %@",searchText];            dataArr =[NSArray arrayWithArray:[allDataArr filteredArrayUsingPredicate:scopePredicate]];            break;    }}

 6.修改cellForRowAtIndexPath方法

Cpp代码 技术分享 技术分享
  1. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath  
  2. {  
  3.     static NSString *CellIdentifier = @"myTableCell";  
  4.     MyTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];  
  5.     //add code begin:important,for showing searching results  
  6.     //不对cell进行空值的判断，会导致在搜索时，找不到对应identifier的cell而报错。  
  7.     if (cell == nil) {  
  8.     //搜索结果采用简单表视图cell的style，并非自定义的表视图cell的style      
  9.     cell = [[MyTableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];  
  10.         NSUInteger row = [indexPath row];  
  11.         NSDictionary *rowDict = [dataArr objectAtIndex:row];  
  12.         cell.textLabel.text =  [rowDict objectForKey:@"itemName"];  
  13.         NSString *imagePath = [rowDict objectForKey:@"itemImagePath"];  
  14.         cell.imageView.image =  [UIImage imageNamed:imagePath];  
  15.     }  
  16.     //add code end  
  17.   
  18.     NSUInteger row = [indexPath row];  
  19.     NSDictionary *rowDict = [dataArr objectAtIndex:row];  
  20.     cell.label.text =  [rowDict objectForKey:@"itemName"];  
  21.     NSLog(@"cell.label.text =  %@",[rowDict objectForKey:@"itemName"]);  
  22.       
  23.     NSString *imagePath = [rowDict objectForKey:@"itemImagePath"];  
  24.     cell.image.image = [UIImage imageNamed:imagePath];  
  25.     NSLog(@"cell.image.image  =  %@",imagePath);  
  26.       
  27.     cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;  
  28.       
  29.     return cell;  
  30. }  
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{    static NSString *CellIdentifier = @"myTableCell";    MyTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];    //add code begin:important,for showing searching results    //不对cell进行空值的判断，会导致在搜索时，找不到对应identifier的cell而报错。    if (cell == nil) {    //搜索结果采用简单表视图cell的style，并非自定义的表视图cell的style        cell = [[MyTableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];        NSUInteger row = [indexPath row];        NSDictionary *rowDict = [dataArr objectAtIndex:row];        cell.textLabel.text =  [rowDict objectForKey:@"itemName"];        NSString *imagePath = [rowDict objectForKey:@"itemImagePath"];        cell.imageView.image =  [UIImage imageNamed:imagePath];    }    //add code end    NSUInteger row = [indexPath row];    NSDictionary *rowDict = [dataArr objectAtIndex:row];    cell.label.text =  [rowDict objectForKey:@"itemName"];    NSLog(@"cell.label.text =  %@",[rowDict objectForKey:@"itemName"]);        NSString *imagePath = [rowDict objectForKey:@"itemImagePath"];    cell.image.image = [UIImage imageNamed:imagePath];    NSLog(@"cell.image.image  =  %@",imagePath);        cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;        return cell;}

 

IOS之表视图添加搜索栏


联系
我们