SwiftUI - come evitare la navigazione hardcoded nella vista?

Cerco di realizzare l'architettura per un'app SwiftUI più grande e pronta per la produzione. Sto correndo continuamente nello stesso problema che indica un grosso difetto di progettazione in SwiftUI.

Ancora nessuno poteva darmi una risposta completa, pronta per la produzione.

Come fare visualizzazioni riutilizzabili in SwiftUIcui contiene la navigazione?

Dato che SwiftUI NavigationLinkè fortemente legato alla vista, ciò non è semplicemente possibile in modo tale da ridimensionarsi anche in App più grandi. NavigationLinkin quelle piccole app di esempio funziona, sì, ma non appena si desidera riutilizzare molte visualizzazioni in un'unica app. E forse anche riutilizzare oltre i confini del modulo. (come: riutilizzare Visualizza in iOS, WatchOS, ecc ...)

Il problema di progettazione: i NavigationLink sono codificati nella vista.

NavigationLink(destination: MyCustomView(item: item))

Ma se la vista che contiene questo NavigationLinkdovesse essere riutilizzabile, non posso codificare la destinazione. Ci deve essere un meccanismo che fornisce la destinazione. Ho chiesto questo qui e ho ottenuto una buona risposta, ma ancora non la risposta completa:

SwiftUI MVVM Coordinator / Router / NavigationLink

L'idea era quella di iniettare i collegamenti di destinazione nella vista riutilizzabile. Generalmente l'idea funziona, ma sfortunatamente questo non si adatta alle vere app di produzione. Non appena ho più schermate riutilizzabili mi imbatto nel problema logico che una vista riutilizzabile ( ViewA) necessita di una vista-destinazione preconfigurata ( ViewB). E se fosse ViewBnecessaria anche una destinazione vista preconfigurata ViewC? Avrei bisogno di creare ViewBgià in modo tale che ViewCviene iniettato già ViewBprima di iniettare ViewBin ViewA. E così via .... ma poiché i dati che a quel tempo devono essere passati non sono disponibili, l'intero costrutto fallisce.

Un'altra idea che ho avuto è stata quella di utilizzare il Environmentmeccanismo di iniezione di dipendenza per iniettare destinazioni NavigationLink. Ma penso che questo dovrebbe essere considerato più o meno come un hack e non una soluzione scalabile per grandi app. Finiremmo per usare l'ambiente praticamente per tutto. Ma poiché anche l'ambiente può essere utilizzato solo all'interno di View (non in coordinatori o ViewModels separati), secondo me ciò creerebbe di nuovo strane costruzioni.

Come la logica aziendale (ad esempio il codice del modello di visualizzazione) e la vista devono essere separate, anche la navigazione e la vista devono essere separate (ad esempio il modello di coordinatore). UIKitÈ possibile perché accediamo alla vista UIViewControllere UINavigationControllerdietro la vista. UIKit'sMVC aveva già il problema di aver combinato così tanti concetti da diventare il nome divertente "Massive-View-Controller" anziché "Model-View-Controller". Ora un problema simile continua SwiftUIma, a mio avviso, anche peggio. La navigazione e le viste sono fortemente accoppiate e non possono essere disaccoppiate. Pertanto non è possibile eseguire visualizzazioni riutilizzabili se contengono navigazione. È stato possibile risolvere questo problema, UIKitma ora non riesco a vedere una soluzione sana inSwiftUI. Purtroppo Apple non ci ha fornito una spiegazione su come risolvere problemi di architettura del genere. Abbiamo solo alcune piccole app di esempio.

Mi piacerebbe essere smentito. Vi prego di mostrarmi un modello di progettazione di app pulito che risolva questo problema per le app di grande produzione pronte.

Grazie in anticipo.

Aggiornamento: questa taglia finirà tra pochi minuti e purtroppo nessuno è stato in grado di fornire un esempio funzionante. Ma inizierò una nuova ricompensa per risolvere questo problema se non riesco a trovare un'altra soluzione e collegarla qui. Grazie a tutti per l'ottimo contributo!

La chiusura è tutto ciò che serve!

struct ItemsView<Destination: View>: View {
    let items: [Item]
    let buildDestination: (Item) -> Destination

    var body: some View {
        NavigationView {
            List(items) { item in
                NavigationLink(destination: self.buildDestination(item)) {
                    Text(item.id.uuidString)
                }
            }
        }
    }
}

Ho scritto un post sulla sostituzione del modello delegato in SwiftUI con chiusure. https://swiftwithmajid.com/2019/11/06/the-power-of-closures-in-swiftui/

La mia idea sarebbe praticamente una combinazione di Coordinatore Delegatemodello. Innanzitutto, crea una Coordinatorclasse:

struct Coordinator {
    let window: UIWindow

      func start() {
        var view = ContentView()
        window.rootViewController = UIHostingController(rootView: view)
        window.makeKeyAndVisible()
    }
}

Adatta il SceneDelegateper usare il Coordinator:

  func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
        if let windowScene = scene as? UIWindowScene {
            let window = UIWindow(windowScene: windowScene)
            let coordinator = Coordinator(window: window)
            coordinator.start()
        }
    }

All'interno di ContentView, abbiamo questo:

struct ContentView: View {
    var delegate: ContentViewDelegate?

    var body: some View {
        NavigationView {
            List {
                NavigationLink(destination: delegate!.didSelect(Item())) {
                    Text("Destination1")
                }
            }
        }
    }
}

Possiamo definire il ContenViewDelegateprotocollo in questo modo:

protocol ContentViewDelegate {
    func didSelect(_ item: Item) -> AnyView
}

Dove Itemè solo una struttura che è identificabile, potrebbe essere qualcos'altro (es. Id di un elemento come in TableViewa UIKit)

Il prossimo passo è adottare questo protocollo Coordinatore passare semplicemente la vista che si desidera presentare:

extension Coordinator: ContentViewDelegate {
    func didSelect(_ item: Item) -> AnyView {
        AnyView(Text("Returned Destination1"))
    }
}

Finora ha funzionato bene nelle mie app. Spero possa essere d'aiuto.

Qualcosa che mi viene in mente è che quando dici:

Ma cosa succede se ViewB necessita anche di una ViewC di destinazione vista preconfigurata? Avrei bisogno di creare ViewB già in modo tale che ViewC sia iniettato già in ViewB prima di iniettare ViewB in ViewA. E così via .... ma poiché i dati che a quel tempo devono essere passati non sono disponibili, l'intero costrutto fallisce.

non è del tutto vero. Invece di fornire viste, è possibile progettare i componenti riutilizzabili in modo da fornire chiusure che forniscono viste su richiesta.

In questo modo la chiusura che produce ViewB su richiesta può fornirle una chiusura che produce ViewC su richiesta, ma la costruzione effettiva delle viste può avvenire in un momento in cui sono disponibili le informazioni contestuali necessarie.

Ecco un divertente esempio di drill down infinito e modifica dei dati per la successiva visualizzazione dettagliata a livello di codice

import SwiftUI

struct ContentView: View {
    @EnvironmentObject var navigationManager: NavigationManager

    var body: some View {
        NavigationView {
            DynamicView(viewModel: ViewModel(message: "Get Information", type: .information))
        }
    }
}

struct DynamicView: View {
    @EnvironmentObject var navigationManager: NavigationManager

    let viewModel: ViewModel

    var body: some View {
        VStack {
            if viewModel.type == .information {
                InformationView(viewModel: viewModel)
            }
            if viewModel.type == .person {
                PersonView(viewModel: viewModel)
            }
            if viewModel.type == .productDisplay {
                ProductView(viewModel: viewModel)
            }
            if viewModel.type == .chart {
                ChartView(viewModel: viewModel)
            }
            // If you want the DynamicView to be able to be other views, add to the type enum and then add a new if statement!
            // Your Dynamic view can become "any view" based on the viewModel
            // If you want to be able to navigate to a new chart UI component, make the chart view
        }
    }
}

struct InformationView: View {
    @EnvironmentObject var navigationManager: NavigationManager
    let viewModel: ViewModel

    // Customize your  view based on more properties you add to the viewModel
    var body: some View {
        VStack {
            VStack {
                Text(viewModel.message)
                .foregroundColor(.white)
            }
            .frame(width: 300, height: 300)
            .background(Color.blue)


            NavigationLink(destination: navigationManager.destination(forModel: viewModel)) {
                Text("Navigate")
            }
        }
    }
}

struct PersonView: View {
    @EnvironmentObject var navigationManager: NavigationManager
    let viewModel: ViewModel

    // Customize your  view based on more properties you add to the viewModel
    var body: some View {
        VStack {
            VStack {
                Text(viewModel.message)
                .foregroundColor(.white)
            }
            .frame(width: 300, height: 300)
            .background(Color.red)
            NavigationLink(destination: navigationManager.destination(forModel: viewModel)) {
                Text("Navigate")
            }
        }
    }
}

struct ProductView: View {
    @EnvironmentObject var navigationManager: NavigationManager
    let viewModel: ViewModel

    // Customize your  view based on more properties you add to the viewModel
    var body: some View {
        VStack {
            VStack {
                Text(viewModel.message)
                    .foregroundColor(.white)
            }
            .frame(width: 300, height: 300)
            .background(Color.green)
            NavigationLink(destination: navigationManager.destination(forModel: viewModel)) {
                Text("Navigate")
            }
        }
    }
}

struct ChartView: View {
    @EnvironmentObject var navigationManager: NavigationManager
    let viewModel: ViewModel

    var body: some View {
        VStack {
            VStack {
                Text(viewModel.message)
                    .foregroundColor(.white)
            }
            .frame(width: 300, height: 300)
            .background(Color.green)
            NavigationLink(destination: navigationManager.destination(forModel: viewModel)) {
                Text("Navigate")
            }
        }
    }
}

struct ViewModel {
    let message: String
    let type: DetailScreenType
}

enum DetailScreenType: String {
    case information
    case productDisplay
    case person
    case chart
}

class NavigationManager: ObservableObject {
    func destination(forModel viewModel: ViewModel) -> DynamicView {
        DynamicView(viewModel: generateViewModel(context: viewModel))
    }

    // This is where you generate your next viewModel dynamically.
    // replace the switch statement logic inside with whatever logic you need.
    // DYNAMICALLY MAKE THE VIEWMODEL AND YOU DYNAMICALLY MAKE THE VIEW
    // You could even lead to a view with no navigation link in it, so that would be a dead end, if you wanted it.
    // In my case my "context" is the previous viewMode, by you could make it something else.
    func generateViewModel(context: ViewModel) -> ViewModel {
        switch context.type {
        case .information:
            return ViewModel(message: "Serial Number 123", type: .productDisplay)
        case .productDisplay:
            return ViewModel(message: "Susan", type: .person)
        case .person:
            return ViewModel(message: "Get Information", type: .chart)
        case .chart:
            return ViewModel(message: "Chart goes here. If you don't want the navigation link on this page, you can remove it! Or do whatever you want! It's all dynamic. The point is, the DynamicView can be as dynamic as your model makes it.", type: .information)
        }
    }
}

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

Sto scrivendo una serie di post sul blog sulla creazione di un approccio Coordinatori MVP + in SwiftUI che può essere utile:

https://lascorbe.com/posts/2020-04-27-MVPCoordinators-SwiftUI-part1/

Il progetto completo è disponibile su Github: https://github.com/Lascorbe/SwiftUI-MVP-Coordinator

Sto cercando di farlo come se fosse una grande app in termini di scalabilità. Penso di aver risolto il problema di navigazione, ma devo ancora vedere come eseguire il deep linking, che è ciò su cui sto attualmente lavorando. Spero possa essere d'aiuto.

Questa è una risposta completamente fuori dal comune, quindi probabilmente si rivelerà una sciocchezza, ma sarei tentato di usare un approccio ibrido.

Utilizzare l'ambiente per passare attraverso un singolo oggetto coordinatore: chiamiamolo NavigationCoordinator.

Dai alle tue visualizzazioni riutilizzabili una sorta di identificatore impostato dinamicamente. Questo identificatore fornisce informazioni semantiche corrispondenti al caso d'uso effettivo dell'applicazione e alla gerarchia di navigazione.

Chiedi alle visualizzazioni riutilizzabili di interrogare NavigationCoordinator per la vista di destinazione, passando il loro identificatore e l'identificatore del tipo di vista a cui stanno navigando.

Ciò lascia NavigationCoordinator come un singolo punto di iniezione ed è un oggetto non visibile a cui è possibile accedere al di fuori della gerarchia della vista.

Durante l'installazione è possibile registrare le classi di visualizzazione corrette affinché possano essere restituite, utilizzando una sorta di corrispondenza con gli identificatori trasmessi in fase di esecuzione. Qualcosa di semplice come la corrispondenza con l'identificatore di destinazione potrebbe funzionare in alcuni casi. O la corrispondenza con una coppia di identificatori host e destinazione.

In casi più complessi puoi scrivere un controller personalizzato che tenga conto di altre informazioni specifiche dell'app.

Dal momento che viene iniettato tramite l'ambiente, qualsiasi vista può sovrascrivere il NavigationCoordinator predefinito in qualsiasi momento e fornire uno diverso ai suoi sottoview.