Uitableview SwiftUI-在列表标题中搜索

我试图用SwiftUI重新创建大家都知道的UITableView：tableview标题中的一个简单搜索字段：

但是，SwiftUI中的列表视图似乎没有添加页眉或页脚的方法。您可以将带有文本字段的标题设置为如下节：

@State private var searchQuery: String = ""

var body: some View {

List {
    Section(header:
        Group{
            TextField($searchQuery, placeholder: Text("Search"))
                                .background(Color.white)
            }) {
                  ListCell()
                  ListCell()
                  ListCell()
                }

    }
}

但是，我不确定这是否是最好的方法，因为：

当您从UITableView向下滚动时，标题不会隐藏

搜索字段看起来不像我们所知道和喜爱的搜索字段

---

有人找到一个好方法吗？我不想回到UITableView上。

Xcode 13/swiftui3

您现在可以使用

.searchable

创建列表。。。可搜索

struct ContentView: View {

    @State private var searchQuery: String = ""

    var body: some View {
        NavigationView {
            List {
                ForEach(Array(1...100)
                            .map { "\($0)" }
                            .filter { searchQuery.isEmpty ? true : $0.contains(searchQuery) }
                        ,id: \.self) { item in
                    Text(verbatim: item)
                }
            }
            .navigationTitle("Fancy Numbers")
            .searchable(text: $searchQuery)
        }
    }

}

仅当

列表

嵌入到

导航视图

中时，搜索栏才会出现

---

Xcode 12，SwiftUI 1/2

您可以将

ui搜索栏

移植到SwiftUI

（有关这方面的更多信息，请参阅优秀的WWDC 2019演讲-）

结构搜索栏：UIViewRepresentable{ @绑定变量文本：字符串 类协调器：NSObject，UISearchBarDelegate{ @绑定变量文本：字符串 init（文本：绑定）{ _文本=文本 } func searchBar（searchBar:UISearchBar，textDidChange searchText:String）{ 文本=搜索文本 } } func makeCoordinator（）->Coordinator{ 退货协调员（文本：$text） } func makeUIView（上下文：UIViewRepresentableContext）->UISearchBar{ 让searchBar=UISearchBar（帧：.0） searchBar.delegate=context.coordinator 返回搜索栏 } func updateUIView（uiView:UISearchBar， 上下文：UIViewRepresentableContext）{ uiView.text=文本 } } 然后像这样使用它：

@State private var searchQuery: String = ""

var body: some View {

List {
    Section(header:
        Group{
            TextField($searchQuery, placeholder: Text("Search"))
                                .background(Color.white)
            }) {
                  ListCell()
                  ListCell()
                  ListCell()
                }

    }
}

struct ContentView:View{
@国家私有var searchQuery:String=“”
var body：一些观点{
名单{
节（标题：搜索栏（文本：self.$searchQuery））{
ForEach（数组（1…100）.过滤器{
self.searchQuery.isEmpty？
正确：
“\（$0）”.contains（self.searchQuery）
}，id:\.self）{中的项
文本（“\（项目）”）
}
}
}
}
}

这是一个合适的搜索栏，但它并没有隐藏——我相信我们一定能够通过SwiftUIAPI在某个时候做到这一点

看起来像这样：

---

也许这是一个起点。考虑使用<代码> ZStack <代码>对滚动视图的滚动效果消失。

结构ContentView:View{
@状态变量搜索：字符串
var body：一些观点{
导航视图{
VStack（对齐：。中心，间距：0）{
HStack{
图像（系统名称：“放大镜”）
.padding（.leading，CGFloat（10.0））
TextField（“搜索”，text:$Search，onEditingChanged:{在中处于活动状态
打印（“编辑已更改：\（活动）”）
}，电子委员会：{
打印（“提交：\（self.search）”）
})
.填充（.垂直，CGFloat（4.0））
.填充（.training，CGFloat（10.0））
}
.覆盖(
圆角转角（拐角半径：5.0）
.笔划（颜色.次要，线宽：1.0）
)
.padding（）
名单{
ForEach（0…100，id:\.self）{e in
案文（“项目\（e）”）
}
}
}
.navigationBarTitle（标题（用于：self.search））
}
}
私有函数标题（值：字符串？->字符串）{
保护let value=value，value.count>0其他{
返回“无搜索”
}
返回#“搜索”\#（值）”#
}
}

---

我使用SwiftUI实现了我的国家采摘器项目

Columbus

。我实现了一个定制发布者

CountryListViewModel

，并将其与文本字段连接起来。通过这种方式，我可以在所有操作完成后键入、搜索数据源、过滤出结果/解块并更新表视图。非常好地工作2021-Xcode 13/SwiftUI 3

本机SwiftUI解决方案：

List {
    ForEach(0..<5) {
        index in
            Text("item \(index)")
        }
    }
}
.searchable(text: .constant("search_value")) // should be a Binding

列表{
ForEach（0..谢谢，在这里使用UISearchBar可能是最好的主意。@Daniel，直到SwiftUI变得更好：）是的，我相信苹果公司在未来对SwiftUI有很多计划。这会让我的编译器崩溃（在莫哈韦的操场上试用过，可能与此有关？）。如果不将其放在标题中，可以更好地查看。相反，请将其放在间距为0的VStack中，并包含搜索栏和列表：
VStack（对齐：。居中，间距：0）{SearchBar（文本：self.$searchQuery）；列表{…
。这样你可以让它使用全宽，搜索栏始终保持在顶部。嘿，如何触发动作（例如调用函数）会很有趣对于
搜索的每次更改
。这可能吗？@blackjacx我正在寻找相同的解决方案。你有什么解决方案吗？@blackjacx只需附加解决方案即可。@FlorentMorin我肯定遗漏了什么，但我在你的代码中没有看到
ZStack
？