1. 程式人生 > >下拉自動彈出搜尋框

下拉自動彈出搜尋框

專案介紹

下面要實現一個整合下拉彈出搜尋框並支援中英文搜尋的框架

主要功能:

  • 下拉時搜尋框自動彈出,沒有進行搜尋操作,兩秒後自動隱身

  • 上拉、點選螢幕或點選cancer按鈕時搜尋框隱藏

  • 支援中英文搜尋

演示

這裡寫圖片描述

實現

下拉彈出 上拉隱藏

上拉下拉的操作都是通過UIscrollView的代理方法進行監聽

// 開始滑動tableView時呼叫
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    [self.view endEditing:YES];

    if (self.searchBar
.text.length == 0 && self.searchBar.frame.origin.y >= 0) { self.searchBar.frame = CGRectMake(0, -44, self.view.frame.size.width, 44); self.switchTip = 0; } } //手指按住螢幕滾動時呼叫 - (void)scrollViewDidScroll:(UIScrollView *)scrollView { if (self.switchTip == 0) { if
(scrollView.contentOffset.y <= -44) { [UIView animateWithDuration:0.3 animations:^{ //設定searchBarframe, 顯示出來 self.searchBar.frame = CGRectMake(0, 0, self.view.frame.size.width, 44); //tableView設定上面間距44 self.tableView.contentInset
= UIEdgeInsetsMake(44, 0, 0, 0); }]; //設定2s後關閉搜尋框 [self performSelector:@selector(closeSearch) withObject:nil afterDelay:2]; self.switchTip = 1; } } }

搜尋框編輯

對搜尋框操作的監聽是由UISearchBarDelegate 這個代理的方法實現的

#pragma mark - UISearchBarDelegate
//當searchBar開始編輯,即當點選搜尋框時
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar
{
    [self.searchBar becomeFirstResponder];
}

//當在搜尋框輸入文字時呼叫
- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText
{
    self.tmpItems = [self.searchBar searchContent:searchText InArray:self.items];

    [self.tableView reloadData];
}

//搜尋框結束搜尋時呼叫
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar
{
    if (self.searchBar.text.length == 0)
    {
        [self performSelector:@selector(closeSearch) withObject:nil afterDelay:2];
    }
}

//點選cancer按鈕時執行
- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar
{
    self.searchBar.text = @"";
    [self.tmpItems removeAllObjects];
    [self.tableView reloadData];
    [self.searchBar resignFirstResponder];
}

中英文搜尋

這部分主要解決的問題:

  • 中英文混合字串轉換

    • 中文轉換為拼音
    • 其他字母、字元保持不變
  • 對檢索關鍵詞進行搜尋

    • 對檢索關鍵詞和搜尋池中的字串都進行轉換
    • 把檢索到的字串放到新陣列中返回

不多說,直接上程式碼:

#pragma mark - 中文轉換為拼音字串
- (NSString *)ZHStringChangeToEN:(NSString *)ZHText
{
    NSMutableString *stringResult = [NSMutableString string];

    for (int i=0; i<ZHText.length; i++)
    {        
        //獲取字元range
        NSRange range = NSMakeRange(i, 1);

        //獲取字元,注意CFStringTransform 接收NSMutableString
        NSMutableString *keyWord = [[NSMutableString alloc] initWithString:[ZHText substringWithRange:range]];

        int keyWordInt = [ZHText characterAtIndex:i];

        //判斷是否為中文
        if (keyWordInt > 0x4e00 && keyWordInt < 0x9fff)
        {
            //先轉換為latin style
            CFStringTransform((__bridge CFMutableStringRef)keyWord, 0, kCFStringTransformMandarinLatin, NO);
            //再轉換為Pinyin
            CFStringTransform((__bridge CFMutableStringRef)keyWord, 0, kCFStringTransformStripDiacritics, NO);
        }

        [stringResult appendString:keyWord];
    }

    return stringResult;
}
//對關鍵字進行索引
- (NSMutableArray *)searchContent:(NSString *)searchText InArray:(NSArray *)array
{
    NSString *upperSearchString = [[NSString alloc] init];
    NSString *upperSearchPoolString = [[NSString alloc] init];

    NSMutableArray *searchResultArray = [NSMutableArray array];

    upperSearchString = [[self ZHStringChangeToEN:searchText] uppercaseString];

    for (int i=0; i<array.count; i++)
    {
        upperSearchPoolString =  [[self ZHStringChangeToEN:array[i]] uppercaseString];

        if ([upperSearchPoolString containsString:upperSearchString])
        {
            [searchResultArray addObject:array[i]];
        }
    }

    return searchResultArray;
}

遇到問題

  • 中文字元直接串轉拼音,拼音間會有空格,對於連續的詞就不能進行檢索

    解決方法就是對字串單個字元進行轉化,然後再拼接起來

  • 搜尋框2s後自動隱藏,如果2s以內進行上拉操作,則搜尋框不隱藏

    - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView 這個方法中隱藏搜尋框

GitHub

感覺不錯的小夥伴給個star哦-_-