開始用Swift開發(fā)iOS 10 - 18 Search Bar 和 UISearchController


上一篇 開始用Swift開發(fā)iOS 10 - 17 使用Core Data 是使用Core Data存儲數(shù)據(jù)销部,這一篇是添加搜索功能阻逮。

使用 UISearchController

UISearchController是一個簡潔的創(chuàng)建搜索條和管理搜索結(jié)果的API谊囚。
通常情況下晚岭,為以table為基礎(chǔ)的app添加搜索條只需要下面三行代碼就可以了嗤无,searchResultsControllernil時搜索結(jié)果顯示就在當前搜索的頁面以當前的樣式顯示壶愤。

searchController = UISearchController(searchResultsController: nil)
searchController.searchResultsUpdater = self
tableView.tableHeaderView = searchController.searchBar

為我的FoodPin應(yīng)用添加搜索條:

  • RestaurantTableViewController中添加一個變量:

     var searchController: UISearchController!
    
  • viewDidLoad中初始化:

      searchController = UISearchController(searchResultsController: nil)
      tableView.tableHeaderView = searchController.searchBar
    

這樣就添加了搜索條麦轰,但還每天添加搜索邏輯乔夯,搜索沒效。

篩選內(nèi)容

  • RestaurantTableViewController中繼續(xù)添加一個變量款侵,用戶存儲篩選結(jié)果:

    var searchResults: [RestaurantMO] = []
    
  • 添加篩選方法:

      func filterContent(for searchText: String) {
          searchResults = restaurants.filter({
          (restaurant) -> Bool in
              
              if let name = restaurant.name {
                  let isMatch = name.localizedCaseInsensitiveContains(searchText)
                  return isMatch
              }
              return false
          })
      }
    

filter是數(shù)組的一個方法末荐,它遍歷數(shù)組的每一項進行閉包中的操作,根據(jù)結(jié)果判斷是否刪除對應(yīng)項新锈,最后得到一個篩選的數(shù)組甲脏。
localizedCaseInsensitiveContains方法用來判斷name中是否包含searchText(忽略大小寫)

更新搜索結(jié)果

  • RestaurantTableViewController “符合” UISearchResultsUpdating協(xié)議:

    class RestaurantTableViewController: UITableViewController, NSFetchedResultsControllerDelegate, UISearchResultsUpdating
    
  • 實現(xiàn)UISearchResultsUpdating協(xié)議:
    中的updateSearchResults(for:)方法,這個方法在搜索條被選則和輸入搜索字時調(diào)用:

    func updateSearchResults(for searchController: UISearchController) {
        if let searchText = searchController.searchBar.text {
            filterContent(for: searchText)
            tableView.reloadData()
        }
    }
  • 更新tableView(_:numberOfRowsInSection:)妹笆。UISearchController有一個isActive屬性用來判斷搜索控制器當前活躍狀態(tài)块请。
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        if searchController.isActive {
            return searchResults.count
        } else {
            return restaurants.count
        }
    }
  • 更新tableView(_:cellForRowAt:)。根據(jù)UISearchController的狀態(tài)判斷是從restaurants中獲取數(shù)據(jù)還是searchResults拳缠。
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cellIdentifier = "Cell"
        let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier,
                                                 for: indexPath) as! RestaurantTableViewCell
        
        let restaurant = (searchController.isActive) ? searchResults[indexPath.row] : restaurants[indexPath.row]
        
        cell.nameLabel.text = restaurant.name
        cell.thumbnailImageView.image = UIImage(data: restaurant.image! as Data)
        cell.thumbnailImageView.layer.cornerRadius = 30.0
        cell.thumbnailImageView.clipsToBounds = true
        cell.locationLabel.text = restaurant.location
        cell.typeLabel.text = restaurant.type
        cell.accessoryType = restaurant.isVisited ? .checkmark: .none
        
        return cell
    }
  • 實現(xiàn)一個新的方法墩新,讓table在搜索狀態(tài)下不可以滑動編輯。
    override func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {
        if searchController.isActive {
            return false
        } else {
            return true
        }
    }
  • 更新prepare(for:)窟坐,讓segue在傳輸數(shù)據(jù)到detail view時的數(shù)據(jù)也相對應(yīng)海渊。

      destinationController.restaurant = searchController.isActive ? searchResults[indexPath.row] : restaurants[indexPath.row
    
  • viewDidLoad中添加兩行代碼:

searchController.searchResultsUpdater = self
searchController.dimsBackgroundDuringPresentation = false

現(xiàn)在就完成了搜索功能。

定制搜索條的樣式

UISearchBar提供一些屬性用來定制哲鸳。在viewDidLoad中添加:

searchController.searchBar.placeholder = "Search restaurants..."
searchController.searchBar.tintColor = UIColor.white
searchController.searchBar.barTintColor = UIColor(red: 218.0/255.0, green:
100.0/255.0, blue: 70.0/255.0, alpha: 1.0)

Exercise:添加地址搜索

只需要更改搜索函數(shù)filterContent

searchResults = restaurants.filter({
        (restaurant) -> Bool in
            
            if let name = restaurant.name, let location = restaurant.location {
                let isMatchName = name.localizedCaseInsensitiveContains(searchText)
                let isMatchLocation = location.localizedCaseInsensitiveContains(searchText)
                if isMatchName || isMatchLocation {
                    return true
                }
                
            }
            return false
        })

代碼

Beginning-iOS-Programming-with-Swift

說明

此文是學習appcode網(wǎng)站出的一本書 《Beginning iOS 10 Programming with Swift》 的一篇記錄

系列文章目錄

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末讯沈,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子婿奔,更是在濱河造成了極大的恐慌缺狠,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,743評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件脸秽,死亡現(xiàn)場離奇詭異儒老,居然都是意外死亡,警方通過查閱死者的電腦和手機记餐,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,296評論 3 385
  • 文/潘曉璐 我一進店門驮樊,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事囚衔⊥谘” “怎么了?”我有些...
    開封第一講書人閱讀 157,285評論 0 348
  • 文/不壞的土叔 我叫張陵练湿,是天一觀的道長猴仑。 經(jīng)常有香客問我,道長肥哎,這世上最難降的妖魔是什么辽俗? 我笑而不...
    開封第一講書人閱讀 56,485評論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮篡诽,結(jié)果婚禮上崖飘,老公的妹妹穿的比我還像新娘。我一直安慰自己杈女,他們只是感情好朱浴,可當我...
    茶點故事閱讀 65,581評論 6 386
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著达椰,像睡著了一般翰蠢。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上啰劲,一...
    開封第一講書人閱讀 49,821評論 1 290
  • 那天梁沧,我揣著相機與錄音,去河邊找鬼呈枉。 笑死趁尼,一個胖子當著我的面吹牛埃碱,可吹牛的內(nèi)容都是我干的猖辫。 我是一名探鬼主播,決...
    沈念sama閱讀 38,960評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼砚殿,長吁一口氣:“原來是場噩夢啊……” “哼啃憎!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起似炎,我...
    開封第一講書人閱讀 37,719評論 0 266
  • 序言:老撾萬榮一對情侶失蹤辛萍,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后羡藐,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體贩毕,經(jīng)...
    沈念sama閱讀 44,186評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,516評論 2 327
  • 正文 我和宋清朗相戀三年仆嗦,在試婚紗的時候發(fā)現(xiàn)自己被綠了辉阶。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,650評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖谆甜,靈堂內(nèi)的尸體忽然破棺而出垃僚,到底是詐尸還是另有隱情,我是刑警寧澤规辱,帶...
    沈念sama閱讀 34,329評論 4 330
  • 正文 年R本政府宣布谆棺,位于F島的核電站,受9級特大地震影響罕袋,放射性物質(zhì)發(fā)生泄漏改淑。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,936評論 3 313
  • 文/蒙蒙 一浴讯、第九天 我趴在偏房一處隱蔽的房頂上張望溅固。 院中可真熱鬧,春花似錦兰珍、人聲如沸侍郭。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,757評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽亮元。三九已至,卻和暖如春唠摹,著一層夾襖步出監(jiān)牢的瞬間爆捞,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,991評論 1 266
  • 我被黑心中介騙來泰國打工勾拉, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留煮甥,地道東北人。 一個月前我還...
    沈念sama閱讀 46,370評論 2 360
  • 正文 我出身青樓藕赞,卻偏偏與公主長得像成肘,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子斧蜕,可洞房花燭夜當晚...
    茶點故事閱讀 43,527評論 2 349

推薦閱讀更多精彩內(nèi)容