Add cancel button to search box

Changelog-Added: Cancel button on search box
Signed-off-by: William Casarin <jb55@jb55.com>
This commit is contained in:
James Carucci
2022-08-09 10:02:44 -07:00
committed by William Casarin
parent b5f13636ae
commit d6ef1c4019

View File

@@ -15,16 +15,25 @@ struct SearchHomeView: View {
var SearchInput: some View {
ZStack(alignment: .leading) {
TextField("", text: $search)
.padding(5)
.padding(.leading, 35)
.textInputAutocapitalization(.never)
HStack{
TextField("", text: $search)
.padding(5)
.padding(.leading, 35)
.textInputAutocapitalization(.never)
Label("", systemImage: "xmark.square")
.padding(EdgeInsets(top: 0.0, leading: 0.0, bottom: 0.0, trailing: 10.0))
.opacity((search == "") ? 0.0 : 1.0)
.onTapGesture {
self.search = ""
}
}
Label("", systemImage: "magnifyingglass")
.padding(.leading, 10)
}
.background {
RoundedRectangle(cornerRadius: 20)
.foregroundColor(.gray.opacity(0.2))
.foregroundColor(.gray.opacity(0.2))
}
.padding()
}