SwiftUI JSON-Daten in Array übernehmen

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • SwiftUI JSON-Daten in Array übernehmen

    Hallo zusammen,

    Ich bin neu im Forum und eben so neu (Anfänger) in SwiftUI. Ich möchte eine Rezepte-App erstellen und habe nun folgendes programmiert.

    Programmcode für den DataManager:

    import Foundation

    class DataManager {
    func fetchData(completion: @escaping ([Rezepte]) -> Void) {
    guard let url = Bundle.main.url(forResource: "MeineRezepte", withExtension: "json") else {
    print("Keine JSAN-Datei gefunden.")
    completion([])
    return
    }
    URLSession.shared.dataTask(with: url) { rezepte, _, error in
    if let error = error {
    print("Konnte Daten nicht übertragen: \(error.localizedDescription)")
    completion([])
    return
    }
    guard let jsonData = rezepte else {
    print("Keine Daten gefunden.")
    completion([])
    return
    }
    do {
    _ = try JSONDecoder().decode([Rezepte].self, from: jsonData)
    } catch let DecodingError.dataCorrupted(context) {
    print(context)
    } catch let DecodingError.keyNotFound(key, context) {
    print("Schlüssel '\(key)' nicht gefunden:", context.debugDescription)
    print("kodierter Pfad:", context.codingPath)
    } catch let DecodingError.valueNotFound(value, context) {
    print("Wert '\(value)' nicht gefunden:", context.debugDescription)
    print("kodierter Pfad:", context.codingPath)
    } catch let DecodingError.typeMismatch(type, context) {
    print("Typ '\(type)' stimmt nicht:", context.debugDescription)
    print("kodierter Pfad:", context.codingPath)
    } catch {
    print("Fehler: ", error)
    }
    }
    .resume()
    }
    }

    Programmcode für die ContentView:

    import SwiftUI

    struct Rezepte: Codable, Identifiable{
    var id: Int
    let Seite: String
    let Buch: String
    let Rezept: String
    let Kategorie: String
    }

    struct ContentView: View {
    @State private var rezepte = [Rezepte]()
    private let dataManager = DataManager()
    var body: some View {
    NavigationView {
    ScrollView {
    VStack {
    List(rezepte, id: \.id) { item in
    ForEach(rezepte) { rezept in
    HStack {
    Text(String(rezept.id))
    Text(rezept.Seite)
    Text(rezept.Buch)
    Text(rezept.Rezept)
    Text(rezept.Kategorie)
    }
    }

    }
    .onAppear {
    dataManager.fetchData { fetchedData in
    rezepte = fetchedData
    }
    }
    }
    }
    }
    }
    }

    struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
    ContentView()
    }
    }

    #Preview {
    ContentView()
    }

    Leider erscheint im Simulator keine Anzeige der Daten. Wer kann mir behilflich sein? ?(

    Liebe Grüsse

    Marios

  • Hi!

    Willkommen im Forum :)

    Ich werde Dir leider bei SwiftUI nicht weiterhelfen können. Allerdings fällt es auch anderen leichter, wenn Du Quellcode über die entsprechende Schaltfläche der Editor-Werkzeugleiste formatierst: Sonst lassen sich Einrückungen etc. kaum erkennen. Nur als gut gemeinter Tipp...

    Mattes
    Diese Seite bleibt aus technischen Gründen unbedruckt.

  • Hallo Mattes

    Besten Dank für deinen Tipp! Werde das Beispiel nochmals formatiert einstellen:


    Quellcode

    1. import Foundation
    3. class DataManager {
    4. func fetchData(completion: @escaping ([Rezepte]) -> Void) {
    5. guard let url = Bundle.main.url(forResource: "MeineRezepte", withExtension: "json") else {
    6. print("Keine JSAN-Datei gefunden.")
    7. completion([])
    8. return
    9. }
    10. URLSession.shared.dataTask(with: url) { rezepte, _, error in
    11. if let error = error {
    12. print("Konnte Daten nicht übertragen: \(error.localizedDescription)")
    13. completion([])
    14. return
    15. }
    16. guard let jsonData = rezepte else {
    17. print("Keine Daten gefunden.")
    18. completion([])
    19. return
    20. }
    21. do {
    22. _ = try JSONDecoder().decode([Rezepte].self, from: jsonData)
    23. } catch let DecodingError.dataCorrupted(context) {
    24. print(context)
    25. } catch let DecodingError.keyNotFound(key, context) {
    26. print("Schlüssel '\(key)' nicht gefunden:", context.debugDescription)
    27. print("kodierter Pfad:", context.codingPath)
    28. } catch let DecodingError.valueNotFound(value, context) {
    29. print("Wert '\(value)' nicht gefunden:", context.debugDescription)
    30. print("kodierter Pfad:", context.codingPath)
    31. } catch let DecodingError.typeMismatch(type, context) {
    32. print("Typ '\(type)' stimmt nicht:", context.debugDescription)
    33. print("kodierter Pfad:", context.codingPath)
    34. } catch {
    35. print("Fehler: ", error)
    36. }
    37. }
    38. }
    39. }
    41. import SwiftUI
    43. struct Rezepte: Codable, Identifiable{
    44. var id: Int
    45. let Seite: String
    46. let Buch: String
    47. let Rezept: String
    48. let Kategorie: String
    49. }
    51. struct ContentView: View {
    52. @State private var rezepte = [Rezepte]()
    53. private let dataManager = DataManager()
    54. var body: some View {
    55. NavigationView {
    56. ScrollView {
    57. VStack {
    58. List(rezepte, id: \.id) { item in
    59. ForEach(rezepte) { rezept in
    60. HStack {
    61. Text(String(rezept.id))
    62. Text(rezept.Seite)
    63. Text(rezept.Buch)
    64. Text(rezept.Rezept)
    65. Text(rezept.Kategorie)
    66. }
    67. }
    69. }
    70. .onAppear {
    71. dataManager.fetchData { fetchedData in
    72. rezepte = fetchedData
    73. }
    74. }
    75. }
    76. }
    77. }
    78. }
    79. }
    80. struct ContentView_Previews: PreviewProvider {
    81. static var previews: some View {
    82. ContentView()
    83. }
    84. }
    86. #Preview {
    87. ContentView()
    88. }
    Alles anzeigen
    Danke zum Voraus für einen Tipp :saint:

  • Hallo zusammen

    Habe die App nochmals neu programmiert. Leider bekomme ich wieder keine Liste in der DetailView angezeigt. Wer kann mir helfen?
    Die JSON-Datei "Meine_Rezepte.json" habe ich in der Projektstruktur hinterlegt. Sie ist validiert und entspricht der Struktur des Arrays [Rezept].
    Danke zum Voraus für eure Hilfe.

    Quellcode

    1. import SwiftUI
    3. struct ContentView: View {
    4. var body: some View {
    5. ZStack {
    6. Rectangle()
    7. .foregroundColor(.gray)
    8. .edgesIgnoringSafeArea(.all)
    9. NavigationView {
    10. VStack {
    11. Text("Meine Rezepte")
    12. .font(.largeTitle)
    13. .bold()
    14. .foregroundColor(.blue)
    15. Image(systemName: "cooktop.fill")
    16. .resizable()
    17. .font(.largeTitle)
    18. .foregroundColor(.blue)
    19. .padding()
    20. List {
    21. NavigationLink(destination: DetailView()) {
    22. Text("Gehe zur Rezepte-Liste")
    23. .font(.title)
    24. .bold()
    25. .foregroundColor(.red)
    26. }
    27. }
    28. }
    29. }
    30. }
    32. }
    33. }
    35. struct ContentView_Previews: PreviewProvider {
    36. static var previews: some View {
    37. ContentView()
    38. }
    39. }
    41. import SwiftUI
    43. struct DetailView: View {
    44. @State private var rezepte = [Rezept]()
    46. var body: some View {
    47. Text("Rezepte-Liste")
    48. .font(.largeTitle)
    49. .bold()
    50. .foregroundColor(.blue)
    51. ScrollView {
    52. List {
    53. VStack(alignment: .leading) {
    54. ForEach(rezepte, id: \.id) { rezept in
    55. HStack {
    56. Text(rezept.id)
    57. Text(rezept.Seite)
    58. Text(rezept.Buch)
    59. Text(rezept.Rezept)
    60. Text(rezept.Kategorie)
    61. }
    62. }
    64. }
    65. .padding(6)
    66. }
    67. }
    68. .onAppear(perform: { rezepte = decode("Meine_Rezepte.json")})
    69. }
    70. }
    72. struct DetailView_Previews: PreviewProvider {
    73. static var previews: some View {
    74. DetailView()
    75. }
    76. }
    78. import SwiftUI
    80. struct Rezept: Codable {
    81. var id: String
    82. var Seite: String
    83. var Buch: String
    84. var Rezept: String
    85. var Kategorie: String
    86. }
    88. func decode(_ file: String) -> [Rezept] {
    89. guard let url = Bundle.main.url(forResource: file, withExtension: nil) else {
    90. fatalError("Konnte die JSON-Datei \(file) im Bundle nicht finden.")
    91. }
    93. guard let data = try? Data(contentsOf: url) else {
    94. fatalError("Konnte die JSON-Datei \(file) nicht aus dem Bundle laden.")
    95. }
    97. let decoder = JSONDecoder()
    99. guard let loadedFile = try? decoder.decode([Rezept].self, from: data) else {
    100. fatalError("Konnte die JSON-Datei \(file) nicht decodieren.")
    101. }
    102. return loadedFile
    103. }
    Alles anzeigen

  • Eine List hat bereits ein entsprechendes Design und bringt einige Funktionalitäten wie die ScrollView bereits mit.
    Da also jede Liste eine ScrollView hat, die Liste aber in einer ScrollView ist, hast du hier quasi eine ScrollView welche in einer ScrollView steckt. Dies führt zu einem Konflikt.
    Du solltest dich daher entscheiden, ob du die Liste streichst und dich selbst um alles (wie z.B. um die ScrollView.) kümmerst oder ob du die Liste nimmst (dann wäre, in meinen Augen, auch der VStack unnötig).

    Also ohne Liste:

    Quellcode

    1. ScrollView {
    2. VStack(alignment: .leading) {
    3. ForEach(rezepte, id: \.id) { rezept in
    4. HStack {
    5. Text(rezept.id)
    6. Text(rezept.Seite)
    7. Text(rezept.Buch)
    8. Text(rezept.Rezept)
    9. Text(rezept.Kategorie)
    10. }
    11. }
    12. }
    13. .padding(6)
    14. }
    Alles anzeigen

    Oder Mit Liste

    Quellcode

    1. List {
    2. ForEach(rezepte, id: \.id) { rezept in
    3. HStack {
    4. Text(rezept.id)
    5. Text(rezept.Seite)
    6. Text(rezept.Buch)
    7. Text(rezept.Rezept)
    8. Text(rezept.Kategorie)
    9. }
    10. }
    11. .padding(6)
    12. }
    Alles anzeigen
    Oder sogar noch etwas kompakter mit List:

    Quellcode

    1. List (rezepte, id: \.id) { rezept in
    2. HStack {
    3. Text(rezept.id)
    4. Text(rezept.Seite)
    5. Text(rezept.Buch)
    6. Text(rezept.Rezept)
    7. Text(rezept.Kategorie)
    8. }
    9. .padding(6)
    10. }

    Du solltest außerdem darauf achten mit möglichst aktuellen Quellen zu lernen. NavigationView ist deprecated, heißt es wird nicht mehr verwendet, nimm stattdessen NavigationStack.

    Dieser Beitrag wurde bereits 3 mal editiert, zuletzt von Rumpelstiltskin ()