UISearchBar的使用以及下拉列表框的實現

在IOS混飯吃的同志們都很清楚，搜索框在移動開發應用中的地位。今天咱們就結合下拉列表框的實現來聊聊UISearchBar的使用。本人新入行的菜鳥一個，不足之處請多多指教。直接上代碼。

UISearchBar控件的聲明：（在控制器DownListViewController中）

@property (nonatomic,retain) UISearchBar* searchBar;

控件的初始化：

_searchBar = [[UISearchBar alloc]initWithFrame:CGRectMake(0, 0, 320, 40)]; 
_searchBar.placeholder = @"test";   //設置佔位符 
_searchBar.delegate = self;   //設置控件代理

固然，作完這些工做以後，咱們還要在將控件添加到父視圖之上，也能夠把他設置成UITableView的tableHeaderView屬性值，因爲你們需求不一，這裏就再也不給出代碼。

前面，咱們設置了控件的代理，固然咱們必須讓控制器（DownListViewController）的 .h 文件實現 UISearchBarDelegate 協議，而後咱們繼續， 咱們要在 .m 文件中實現協議方法：

#pragma mark - 
#pragma mark UISearchBarDelegate 
 
//搜索框中的內容發生改變時 回調（即要搜索的內容改變）
- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText{ 
    NSLog(@"changed"); 
    if (_searchBar.text.length == 0) { 
        [self setSearchControllerHidden:YES]; //控制下拉列表的隱現
    }else{ 
        [self setSearchControllerHidden:NO]; 
  
    } 
} 
 
- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar { 
    searchBar.showsCancelButton = YES; 
    for(id cc in [searchBar subviews])
    {
        if([cc isKindOfClass:[UIButton class]])
        {
            UIButton *btn = (UIButton *)cc;
            [btn setTitle:@"取消"  forState:UIControlStateNormal];
        }
    }
    NSLog(@"shuould begin"); 
    return YES; 
} 
 
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar { 
    searchBar.text = @""; 
    NSLog(@"did begin"); 
} 
 
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar { 
    NSLog(@"did end"); 
    searchBar.showsCancelButton = NO; 
 
} 
 
- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar { 
    NSLog(@"search clicked"); 
} 
 
//點擊搜索框上的 取消按鈕時 調用
- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar { 
    NSLog(@"cancle clicked"); 
    _searchBar.text = @""; 
    [_searchBar resignFirstResponder]; 
    [self setSearchControllerHidden:YES]; 
}

至此，搜索框的實現就搞定了，怎麼樣簡單吧。下面咱們來說講下拉列表框的實現，先說說他的實現原理或者是思路吧。下拉列表框咱們用一個控制器來實現，咱們新建一個控制器SearchViewController.

@interface SearchViewController : UITableViewController 
 
@end

在 .m 文件中，咱們實現該控制器

- (id)initWithStyle:(UITableViewStyle)style 
{ 
    self = [super initWithStyle:style]; 
    if (self) { 
        // Custom initialization 
    } 
    return self; 
} 
 
- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 
 
    self.tableView.layer.borderWidth = 1; 
    self.tableView.layer.borderColor = [[UIColor blackColor] CGColor]; 
 
}

而後實現控制器的數據源，

#pragma mark - 
#pragma mark Table view data source 
 
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {  
    return 1; 
} 
 
 
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { 
    // 返回列表框的下拉列表的數量 
    return 3; 
} 
 
 
// Customize the appearance of table view cells. 
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { 
     
    static NSString *CellIdentifier = @"Cell"; 
     
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; 
    if (cell == nil) { 
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] ; 
    } 
     
    // Configure the cell... 
    NSUInteger row = [indexPath row]; 
    cell.textLabel.text = @"down list"; 
     
    return cell; 
}

這樣列表框的控制器就實現了。接下來咱們就來看看怎麼讓出現、隱藏。這點咱們利用UIView的動畫效果來實現,咱們在DownListViewController控制器中 增長一個方法：

- (void) setSearchControllerHidden:(BOOL)hidden { 
    NSInteger height = hidden ? 0: 180; 
    [UIView beginAnimations:nil context:nil]; 
    [UIView setAnimationDuration:0.2]; 
     
    [_searchController.view setFrame:CGRectMake(30, 36, 200, height)]; 
    [UIView commitAnimations]; 
}

咱們只需調用該方法就能夠了。如今咱們看看DownListViewController的佈局方法

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 
    _searchBar = [[UISearchBar alloc]initWithFrame:CGRectMake(0, 0, 320, 40)]; 
    _searchBar.placeholder = @"test"; 
    _searchBar.delegate = self;  
     
    _tableview = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStylePlain]; 
    _tableview.dataSource = self; 
    _tableview.tableHeaderView = _searchBar; 
     
    _searchController = [[SearchViewController alloc] initWithStyle:UITableViewStylePlain]; 
    [_searchController.view setFrame:CGRectMake(30, 40, 200, 0)]; 
     
    [self.view addSubview:_tableview]; 
    [self.view addSubview:_searchController.view]; 
}

這樣一切都搞定了。

好了，總結一下：

咱們用了兩個控制器：DownListViewController（搜索框的實現 和 控制下拉列表框的出現與隱藏）和SearchViewController（下拉列表框的實現）。在DownListViewController中咱們聲明並初始化 UISearchBar和SearchViewController（高度開始設置爲零），用動畫來實現下拉列表框的出現與隱藏。