SwiftUI Can't Extract Subview, Core Data, Custom Modifier - xcode

Question

I have a SwiftUI list/detail app with many data fields that are all the same except of
course for the data. I am trying to extract a view but cannot seem to get the
connections correct.
The data is in Core Data and the entity of note is Patient. I pass a patient record to
the detail view. Everything works when the code is repeated for each data field.
While I don't think the issue is with the custom modifier, for clarity I have included
the code for the custom modifier that adds a clear button. Strangely, I could not
find a built-in SwiftUI TextField clear button.
Here is the relevant code for an individual data element - this works:
var patient: Patient
#State private var updatedTitle: String = "No Title"
//title
VStack(alignment: .leading) {
Text("Person Title:")
.padding(.leading, 5)
.font(.headline)
HStack {
TextField("Enter a Title", text: $updatedTitle)
.frame(minWidth: 0, maxWidth: .infinity)
.padding(.trailing, -25)
.padding(.leading, 5)
.frame(height: 45)
.onAppear {
self.updatedTitle = self.patient.title ?? ""
}
Text("")
.frame(width: 35, height: 35)
.modifier(ClearButton(text: self.$updatedTitle))
.padding(.trailing, 15)
.padding(.leading, -20)
}
.background(Color("TextFieldBackground")).cornerRadius(8)
.overlay(
RoundedRectangle(cornerRadius: 8)
.stroke(Color.gray, lineWidth: 1)
)
.padding(.leading, 10)
.padding(.trailing, 10)
}.padding(10)
This is my attempt to extract a subview:
struct MyDataCell {
#Binding var tfData: String
var passedInLabel: String
var patient: Patient
var body: some View {
VStack(alignment: .leading) {
Text(passedInLabel)
.padding(.leading, 5)
.font(.headline)
HStack {
TextField("Enter a Title", text: $tfData)
.frame(minWidth: 0, maxWidth: .infinity)
.padding(.trailing, -25)
.padding(.leading, 5)
.frame(height: 45)
.onAppear {
self.tfData = self.patient.title ?? ""
}
Text("")
.frame(width: 35, height: 35)
.modifier(ClearButton(text: $tfData))
.padding(.trailing, 15)
.padding(.leading, -20)
}
.background(Color("TextFieldBackground")).cornerRadius(8)
.overlay(
RoundedRectangle(cornerRadius: 8)
.stroke(Color.gray, lineWidth: 1)
)
.padding(.leading, 10)
.padding(.trailing, 10)
}.padding(10)
}
}
This is the line of code I use to call the subview - the compiler instantly complains
with an error that has nothing to do with this line.
MyDataCell(tfData: $updatedTitle, passedInLabel: "Patient Title", patient: patient)
As mentioned, this is the code for the custom modifier:
struct ClearButton: ViewModifier {
#Binding var text: String
public func body(content: Content) -> some View {
HStack {
content
Button(action: {
self.text = ""
}) {
Image(systemName: "multiply.circle.fill")
.foregroundColor(.secondary)
}
}
}
}
Xcode Version 11.2 beta 2 (11B44) I have tried both the simulator and a device. Any
guidance would be appreciated.

Answer 1

MyDataCell needs to confirm to View - struct MyDataCell: View {
A property needs to be passed in that is the actual attribute for the Entity. In this case pass in the string of patient.title instead of passing the Entity, Patient. Then in .onAppear use that string.
Lastly, remember the max 10 item per view - break the list into groups.