How to select an item from a search file and place in textfield in another file - search

Using SwiftUI - Xcode 14.2 - iOS 16.0
I have tried different search tutorials to create a search file for my project but am unable to find out how to select the item in the search file and place that selected item in a textfield in another file. I have searched this site for other posts, i tried searching through Google, YouTube, etc...
In File 1, I have a textfield that that has a prompt 'start typing' and when selected, it directs you to the Search file to select the item you want, so it can be placed in place of the prompt.
File 1 (where the textfield is needed to paste the selected item):
VStack {
NavigationLink(destination: NameSearch()) {
TextField("Name", text: .constant(""), prompt: Text(" Start typing ")
.foregroundColor(.blue))
.multilineTextAlignment(.leading)
.padding()
}
}
Once I click on the 'start typing' prompt, it navigates to NameSearch.swift file, as seen below.
NameSearch.swift:
import SwiftUI
struct NameSearch: View {
let name = [
"Jane", "George", "Sam", "Henry", "Sally", "Liz", "John"
]
#State private var searchText = ""
var body: some View {
NavigationStack {
VStack {
// Search view
SearchBarView(searchText: $searchText)
List {
// Filtered list of names
ForEach(name.filter{$0.hasPrefix(searchText) || searchText == ""}, id:\.self) {
searchText in Text(searchText)
}
}
.navigationBarTitle(Text("Search Name"))
.resignKeyboardOnDragGesture()
}
}
}
}
struct NameSearch_Previews: PreviewProvider {
static var previews: some View {
Group {
NameSearch()
.environment(\.colorScheme, .light)
NameSearch()
.environment(\.colorScheme, .dark)
}
}
}
extension UIApplication {
func endEditing(_ force: Bool) {
self.windows
.filter{$0.isKeyWindow}
.first?
.endEditing(force)
}
}
struct ResignKeyboardOnDragGesture: ViewModifier {
var gesture = DragGesture().onChanged{_ in
UIApplication.shared.endEditing(true)
}
func body(content: Content) -> some View {
content.gesture(gesture)
}
}
extension View {
func resignKeyboardOnDragGesture() -> some View {
modifier(ResignKeyboardOnDragGesture())
}
}
struct SearchBarView: View {
#Binding var searchText: String
#State private var showCancelButton: Bool = false
var onCommit: () ->Void = {print("onCommit")}
var body: some View {
HStack {
HStack {
Image(systemName: "magnifyingglass")
// Search text field
ZStack (alignment: .leading) {
if searchText.isEmpty { // Separate text for placeholder to give it the proper color
Text("Search")
}
TextField("", text: $searchText, onEditingChanged: { isEditing in
self.showCancelButton = true
}, onCommit: onCommit).foregroundColor(.primary)
}
// Clear button
Button(action: {
self.searchText = ""
}) {
Image(systemName: "xmark.circle.fill").opacity(searchText == "" ? 0 : 1)
}
}
.padding(EdgeInsets(top: 8, leading: 6, bottom: 8, trailing: 6))
.foregroundColor(.secondary) // For magnifying glass and placeholder test
.background(Color(.tertiarySystemFill))
.cornerRadius(10.0)
if showCancelButton {
// Cancel button
Button("Cancel") {
UIApplication.shared.endEditing(true) // this must be placed before the other commands here
self.searchText = ""
self.showCancelButton = false
}
.foregroundColor(Color(.systemBlue))
}
}
.padding(.horizontal)
.navigationBarHidden(showCancelButton)
}
}
Question 1: How do I hide all the names from showing in the list so that I just see the search bar and the cancel button and an empty list?
Question 2: Once I type the name I am looking for, it should pop up and I want to select name - how can I do this?
once I type the name in search bar, it appears in the empty list
I select that name
it then takes me back to File 1
replaces the 'start typing' prompt with the name i just selected in the Search file.
Question 3: I have noticed in the Search file, I am getting a warning with the following code. How can I resolve it?
extension UIApplication {
func endEditing(_ force: Bool) {
self.windows
.filter{$0.isKeyWindow}
.first?
.endEditing(force)
}
}
The warning that appears is:
'windows' was deprecated in iOS 15.0: Use UIWindowScene.windows on a
relevant window scene instead

Firstly, thank you for providing a working example of your code.
As you're building for iOS 15+, you should probably be using the .searchable modifier rather than rolling your own.
The 2021 WWDC video introducing this feature is here https://developer.apple.com/wwdc21/10176
Some new features from 2022 here: https://developer.apple.com/wwdc22/10052

Related

SwiftUI UISearchController replacement: search field, results and some scrollable content fail to coexist in a meaningful manner

Starting with this
var body: some View {
ScrollView {
VStack(spacing: 0.0) {
Some views here
}
}
.edgesIgnoringSafeArea(.top)
}
How would I add
List(suggestions, rowContent: { text in
NavigationLink(destination: ResultsPullerView(searchText: text)) {
Text(text)
}
})
.searchable(text: $searchText)
on top if that scrollable content?
Cause no matter how I hoax this together when
#State private var suggestions: [String] = []
gets populated (non empty) the search results are not squeezed in (or, better yet, shown on top of
"Some views here"
So what I want to achieve in different terms: search field is on top, scrollable content driven by the search results is underneath, drop down with search suggestions either temporarily squeeses scrollable content down or is overlaid on top like a modal sheet.
Thanks!
If you are looking for UIKit like search behaviour you have to display your results in an overlay:
1. Let's declare a screen to display the results:
struct SearchResultsScreen: View {
#Environment(\.isSearching) private var isSearching
var results: [String]?
var body: some View {
if isSearching, let results {
if results.isEmpty {
Text("nothing to see here")
} else {
List(results, id: \.self) { fruit in
NavigationLink(destination: Text(fruit)) {
Text(fruit)
}
}
}
}
}
}
2. Let's have an ObservableObject to handle the logic:
class Search: ObservableObject {
static private let fruit = [
"Apples 🍏",
"Cherries 🍒",
"Pears 🍐",
"Oranges 🍊",
"Pineapples 🍍",
"Bananas 🍌"
]
#Published var text: String = ""
var results: [String]? {
if text.isEmpty {
return nil
} else {
return Self.fruit.filter({ $0.contains(text)})
}
}
}
3. And lastly lets declare the main screen where the search bar is displayed:
struct ContentView: View {
#StateObject var search = Search()
var body: some View {
NavigationView {
LinearGradient(colors: [.orange, .red], startPoint: .topLeading, endPoint: .bottomTrailing)
.overlay(SearchResultsScreen(results: search.results))
.searchable(text: $search.text)
.navigationTitle("Find that fruit")
}
}
}

NavigationLinks are being grouped

I have a restaurant menu app that is grouping menu items inside of sections of the menu with NavigationLinks on each menu item which are intended to display a more detailed description of the item. All the menu items in a section are being grouped together as if they were just a single link and triggering the error "Fatal error: UIKitNavigationBridge: multiple active destinations: file SwiftUI". In other words, it is trying to display the detail for all the items within that section when you click on any individual item.
I'm doing this with a section view that displays the various sections and in turn, each section displays the items within that section.
It appears to be a bug in SwiftUI, but since I'm relatively new to SwiftUI, I thought I'd seek more seasoned advice.
import SwiftUI
struct MenuSectionView: View
{
#Environment(\.managedObjectContext) var managedObjectContext
#EnvironmentObject var env: GlobalEnvironment
var group: Group
var items: [MenuItem]
init(group: Group)
{
self.group = group
items = getMenuItems(businessid: group.businessid!, groupid: group.groupid)
}
var body: some View
{
VStack
{
ForEach (items, id: \.itemid)
{
itemx in
if group.groupid == itemx.groupid
{
MenuItemView(item: itemx)
}
}
}
}
}
import SwiftUI
import CoreData
struct MenuItemView: View
{
#Environment(\.managedObjectContext) var context
#EnvironmentObject var env: GlobalEnvironment
var item: MenuItem
init(item: MenuItem)
{
self.item = item
}
var body: some View
{
return VStack
{
NavigationLink(destination: DetailView(item: item))
{
VStack
{
HStack
{
if let image = item.image
{
Image(uiImage: UIImage(data: image)!).resizable().frame(width: 40, height: 40).cornerRadius(5)
} else
{
Image(item.name!).resizable().frame(width: 40, height: 40).cornerRadius(5)
}
Text(item.name!)
}
Text(item.desc!)
}
}
}
}
}
}
Apparently the VStack in the above example was the cause of the error/bug. I eliminated it and now the links work correctly. It is still a bug since in a more complex iteration, the VStack is needed. I found the same thing happens with Buttons within stacks.

Editing a specific core data object in modal view

Progressing in my Core Data learning, I'm now stuck on the following :
I display a list of core data objects in ContentView.
If the user wants to edit one of them, he long-touches the item in the list which pops up a context sheet with and edit button. So far so good.
The edit Button summons a modal view on which the editing will take place.
In the Edit view, I start by fetching the correct item through its UUID property that I had stored in UserDefaults.
I am able to display the item's name, but I run into an issue with its date (the item has an "eventDate" Date property.
The app builds, I run it on my device, but it crashes as soon as I try to edit an item. An error is thrown in my EditView code when I instantiate the value to be displayed by a picker to the event's date :
Here's what happens inside the edit button :
Button(action: {
self.modalViewCaller = 1 // To tell the sheet which view to display
UserDefaults.standard.set(item.identNumber?.uuidString, forKey: kactiveEventUUID)
self.settingsModalIsPresented = true
})
{ Text("Edit entry")
Image(systemName: "globe")
}
And the way I fetch the event in EditView :
#Environment(\.managedObjectContext) var managedObjectContext
// We get the event to be edited through its UUID :
#FetchRequest(entity: Takeoffs.entity(),
sortDescriptors: [NSSortDescriptor(keyPath: \Takeoffs.eventDate, ascending: false)],
predicate: NSPredicate(format: "identNumber == %#", UUID(uuidString: UserDefaults.standard.string(forKey: kactiveEventUUID)!)! as CVarArg)) var fetchedEvent: FetchedResults<Takeoffs>
// UserDefaults.standard.object(forKey: kactiveEventUUID) as! CVarArg)
#State var selectedDate = Date()
init() { // This sets "selectedDate" to the event's value for the date picker
_selectedDate = State(initialValue: fetchedEvent.first?.eventDate ?? Date()) // The underscore is used here
}
The project is available here if anyone has the courage : https://github.com/Esowes/RecentExp
Thanks for any help...
[Edit :] Trying the .didAppear solution suggested below, but can't seem to find a view that accepts .didAppear in my body :
var body: some View {
NavigationView {
Form {
HStack {
Text("Airport : ")
TextField(String(fetchedEvent.first?.airportName ?? ""), text: $airportNameTextfield)
.disabled(airportNameTextfield.count > 2) // To limit the textField to 3 chars (IATA code)
Button(action: {
self.airportNameTextfield = ""
}) {
Image(systemName: "clear")
}
} // END of Hstack
Picker("", selection: $typeSelectorIndex) {
ForEach(0 ..< types.count) { index in
Text(self.types[index]).tag(index)
}
}
.pickerStyle(SegmentedPickerStyle())
// Text("Selected type is: \(types[typeSelectorIndex])")
VStack {
Button(action: {
self.selectedDate = Date()
}) {
Text("Today")
}
DatePicker("",selection: $selectedDate, displayedComponents: .date)
.padding(30)
.labelsHidden()
}
} // END of Form
.navigationBarItems(
leading:
Button("Done") {
self.saveEdits()
self.presentationMode.wrappedValue.dismiss() // This dismisses the view
} // END of Button "Done"
)
.navigationBarTitle("Event edition")
} // END of Navigation View
} // END of some View
The fetchedEvent is not available yet at View.init call moment, so instead use it in .didAppear, like below
// ... remove that init at all
var body: some View {
Text("Any internal view here")
.onAppear {
// assigned fetched event data, here it is available
self.selectedDate = self.fetchedEvent.first?.eventDate ?? Date()
}
}

Tab to next text field when 'next/return' key hit on keyboard in SwiftUI

This is strictly for SwiftUI.
I would like to have the keyboard move to the next available text field when the user hits the 'return' key on the keyboard.
I have the following view:
var body: some View {
VStack {
NavigationView {
Form {
TextField("First name", text: $model.firstname)
.tag(1)
TextField("Last name", text: $model.lastname)
.tag(2)
}
.navigationBarTitle("Add a Person", displayMode: .inline)
}
}
}
And the following code that should allow the tab:
func textFieldShouldReturn(_ textField: UITextField) -> Bool {
let nextTag = textField.tag + 1
if let nextResponder = textField.superview?.viewWithTag(nextTag) {
nextResponder.becomeFirstResponder()
} else {
textField.resignFirstResponder()
}
return true
}
I am just not sure how to implement it in SwiftUI?
How do I assign it to the delegate of the textfield?!
****UPDATE****
func textFieldShouldReturn(_ textField: UITextField) -> Bool {
print("Current Tag: ", textField.tag) // Works correctly
let nextTag = textField.tag + 1
print("Next Tag: ", nextTag) // Works correctly
let nextResponder = textField.superview?.viewWithTag(nextTag) as UIResponder? // ALWAYS RETURN NIL
....
Not sure why the assignment of nextResponder always returns nil?!
iOS15+
Now it can be easily done with FocusState+.focused(,equals:) specifying named tags and updating focus state on needed action.
Tested with Xcode 13.3 / iOS 15.4
Here is main part:
#FocusState private var infocus: Field?
enum Field {
case first, last
}
// ...
TextField("First name", text: $firstname,
onCommit: { infocus = .last }) // << here !!
.focused($infocus, equals: .first)
Complete test module in project is here

SwiftUI: make layout relative to a central view

Assume I build a view like this:
struct MyView: View {
#State private var a: String
#State private var b: String
#State private var c: String
var body: some View {
VStack {
HStack {
Text(a)
// this is the central view
Text(b).font(.headline)
}
Text(c)
}
}
}
I would like the central text view (the one displaying b) to be the anchor of the layout. That is, no matter how other text values change, I would like the central text to always stay in the centre of MyView (the centre of the text element and the centre of MyView should stay identical) and the other text elements should be laid out around the central one.
How to I achieve this? I tried to look at alignment guides, but I just don't seem to understand how to use them properly.
After spending some time to learn how alignment works in detail, I managed to arrive at a solution that only uses stacks and custom alignments, with minimal alignment guides and without needing to save any intermediate state. It's purely declarative, so I am supposed this is how SwiftUI designers intended it. I still think that there might have been a better design for it, but one can work with it.
struct ContentView: View {
#State var a: String = "AAAAA"
#State var b: String = "BBBB"
#State var c: String = "CCCCCC"
var body: some View {
VStack {
ZStack(alignment: .mid) {
// create vertical and horizontal
// space to align to
HStack { Spacer() }
VStack { Spacer() }
VStack(alignment: .midX) {
Text(self.a)
HStack(alignment: .center) {
Text(self.c)
Text(self.b)
.font(.title)
.border(Color.blue)
.alignmentGuide(.midX) { d in
(d[.leading] + d[.trailing])/2
}
.alignmentGuide(.midY) { d in
(d[.top] + d[.bottom])/2
}
}
}
}
.layoutPriority(1.0)
.overlay(CrossHair().stroke(Color.pink, lineWidth: 2))
TextField("", text: self.$b).textFieldStyle(RoundedBorderTextFieldStyle())
}
}
}
fileprivate extension HorizontalAlignment {
enum MidX : AlignmentID {
static func defaultValue(in d: ViewDimensions) -> CGFloat {
return (d[.leading] + d[.trailing])/2
}
}
static let midX = HorizontalAlignment(MidX.self)
}
fileprivate extension VerticalAlignment {
enum MidY : AlignmentID {
static func defaultValue(in d: ViewDimensions) -> CGFloat {
return (d[.top] + d[.bottom])/2
}
}
static let midY = VerticalAlignment(MidY.self)
}
fileprivate extension Alignment {
static let mid = Alignment(horizontal: .midX, vertical: .midY)

Resources