使用自定义单元格将搜索栏实现到 uitableview答案

【问题标题】：Implement searchbar to tableview with custom cell使用自定义单元格将搜索栏实现到 uitableview
【发布时间】：2019-07-05 08:56:53
【问题描述】：

我创建了一个带有自定义单元格的表格视图，我现在正在努力添加一个搜索栏。

import UIKit

class ViewController: UIViewController, UITableViewDataSource {

var SVGdata = [SVG]()

override func viewDidLoad() {
    super.viewDidLoad()

}

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)

    createSVGdata()
}

// Create movies data
func createSVGdata() {
    SVGdata.append(SVG(SVGArtikel: "Art. 1", SVGGesetzestext: "Das darfst du nicht tun"))
    SVGdata.append(SVG(SVGArtikel: "Art. 2", SVGGesetzestext: "Und das erst recht nicht"))

}

// TableView
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return SVGdata.count
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "SVGCell", for: indexPath)

    let sVG = SVGdata[indexPath.row]
    if let SVGCell = cell as? SVGCell {
        SVGCell.setSVG(sVG)
    }

    return cell
}

}

有数千个视频如何在一个简单的数组中进行搜索。但不适用于我的解决方案。

【问题讨论】：

您能解释一下您面临的具体问题是什么吗？您正在寻找什么样的搜索？例如：像默认 iOS 联系人应用一样搜索？
我将为每个表（行）创建一些文本。搜索栏是一种过滤器。我需要显示所有包含搜索到的单词或数字的行。
我已经添加了答案，请查看

标签： ios swift uitableview tableview searchbar

【解决方案1】：

您可以使用 UISearchBar 来做到这一点。首先在您的 tableView 所在的同一 viewController 上的故事板上添加一个 UISearchBar（在表格视图顶部添加搜索栏，如 iOS。联系应用程序）然后添加如下代码的参考：

@IBOutlet weak var searchBar: UISearchBar!

然后在 viewDidLoad 添加委托：

self.searchBar.delegate = self

我有两个dataArray allData，filteredData。在 allData 中我保留了表的所有数据（没有在任何地方更改它）和用于获取过滤结果的过滤数据。因此，在将数据填充到 allData 之后，我从 (viewWillAppear) 完成了：

filteredData = allData

所以，所有 tableView 委托、数据源都使用了过滤数据。
然后扩展您的 viewController（扩展不是强制性的）以符合 UISearchBarDelegate ：

当你使用SVGdata（我使用filteredData）作为tableView，过滤后你必须在重新加载表格之前将所有过滤后的数据放入SVGdata。

extension YourViewController: UISearchBarDelegate{
    func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
    // searchText will contain user input
    // in allData I have kept all data of the table
    // filteredData used to get the filtered result
        if (searchText == ""){
            filteredData = allData
        }
        else{
            filteredData = []
        // you can do any kind of filtering here based on user input
            filteredData = allData.filter{
                $0.cName.lowercased().contains(searchText.lowercased())
            }   
        }
    // lastly you need to update tableView using filteredData so that the filtered rows are only shown
    //As you use SVGdata for tableView, after filtering you have to put all filtered data into SVGdata before reloading the table.
        self.tableView.reloadData()
    }
}

【讨论】：

非常感谢您的回答。不幸的是我没有让它运行。你可以修复我的项目吗？提前谢谢
出了什么问题？你能给出那个 viewController 的屏幕截图，其中 tableview 和搜索栏包含在 StoryBoard 中吗？

【解决方案2】：

我知道当你有一个 TableView 时添加搜索栏的两种方法，所以我建议你首先决定哪种实现更适合你的应用程序：

第一个，如果您有一个 UINavigationController，您可以使用将出现在导航栏中的搜索栏的本机实现。我的意思是，您首先需要以编程方式或通过情节提要将 UINavitationController 添加到您的视图控制器中。然后，您应该创建一个 UISearchController 并关联到 UINavigationController。最后，通过 UISearchController Delegate 监听导航搜索栏中发生的事件，以便更新视图。

https://www.raywenderlich.com/472-uisearchcontroller-tutorial-getting-started

第二种方式是一个搜索栏，它通过他的标题关联到一个tableView，阅读几个教程直到你完成它。

https://www.ioscreator.com/tutorials/add-search-table-view-ios-tutorial

【讨论】：