如何在 Swift 中设置 SearchController/SearchBar/SearchResultsController

Question

所以在屏幕录制中，我想创建一个像 instacart 一样的搜索控制器/搜索栏。我创建了一个在导航栏中有一个搜索栏的集合视图（通过搜索控制器）。我想在选择搜索栏时显示建议的搜索（如 instacarts 的“热门搜索”）（而不是使背景变暗并显示集合视图 - 就像它的默认功能一样）。然后，一旦用户开始输入，我希望有一个表格视图被过滤并显示过滤后的数据（替换建议的搜索） - 如图所示。最终，一旦单击搜索栏并在用户开始在搜索栏中输入时显示过滤表，我就无法显示建议的搜索。基本上我希望能够做 instacart 在这里完成的事情。任何帮助将不胜感激。谢谢！ Reference pictures

Answer 1

当您单击主类别中的搜索栏时，只需导航到搜索建议。 就我而言，我使用了 UITextField 中的自定义搜索栏。 我创建了 2 个 viewController，1 个用于建议结果，另一个用于显示搜索结果。

在 searchsuggestionsVC viewDidload 中，我正在检查字符数，并在表格视图中调用和加载建议的产品，如下所示

   self.searchTF.addTarget(self, action: #selector(searchRecords(_ :)), for: .editingChanged)

如下创建 searchRecords 选择器

 func textFieldShouldReturn(_ textField: UITextField) -> Bool {
    if self.searchTF.text != "" {
          //any task to perform
          //if you want to dismiss your keyboard
        print("Pro search keyboard button tapped")
        self.proSearchQuery = self.searchTF.text ?? ""
        UserDefaults.standard.set(self.proSearchQuery, forKey: "kProSearchQuery")
        print("PRO SEARCH QUERY : \(self.proSearchQuery ?? "")")
        self.navigatTo(identifier: "SearchResultsVC", animated: false)
       }
    else{
        self.showCustomToast(message: "Please type something to search")
    }
       return true
   }

并使用以下代表通过点击键盘上的搜索按钮导航到搜索结果。

override func viewDidAppear(_ animated: Bool) {
       self.searchTF.becomeFirstResponder()
   }

func textFieldShouldClear(_ textField: UITextField) -> Bool {
  print("text cleared")
  return true
}
// search button execution

func textFieldShouldReturn(_ textField: UITextField) -> Bool {
    if self.searchTF.text != "" {
        //any task to perform
        //if you want to dismiss your keyboard
        print("Pro search keyboard button tapped")
        self.proSearchQuery = self.searchTF.text ?? ""
        UserDefaults.standard.set(self.proSearchQuery, forKey: "kProSearchQuery")
        print("PRO SEARCH QUERY : \(self.proSearchQuery ?? "")")
        self.navigatTo(identifier: "SearchResultsVC", animated: false)
       }
    else{
        self.view.makeToast("Please type something to search")
    }
       return true
   }

上面的代码可能不符合您的要求，但希望您能从中获得一些想法。如果有任何不清楚或加起来的地方，请在 cmets 中告诉我。