SwiftUI - como evitar a navegação codificada na exibição?

Eu tento fazer a arquitetura para obter um SwiftUI App maior e pronto para produção. Estou correndo o tempo todo com o mesmo problema que aponta para uma falha de design importante no SwiftUI.

Ainda assim, ninguém poderia me dar uma resposta completa, pronta para produção.

Como fazer vistas reutilizáveis ​​nas SwiftUIquais contêm navegação?

Como o SwiftUI NavigationLinkaplicativo está fortemente vinculado à visualização, isso simplesmente não é possível, de forma que ele também é dimensionado em aplicativos maiores. NavigationLinknessas pequenas amostras de aplicativos, sim - mas não assim que você deseja reutilizar muitas visualizações em um aplicativo. E talvez também reutilize além dos limites do módulo. (como: reutilizar a exibição no iOS, WatchOS etc.)

O problema do design: os NavigationLinks são codificados na Visualização.

NavigationLink(destination: MyCustomView(item: item))

Mas se a exibição que contém isso puderNavigationLink ser reutilizada, não será possível codificar o destino. Tem que haver um mecanismo que forneça o destino. Perguntei isso aqui e obtive uma resposta muito boa, mas ainda não a resposta completa:

Coordenador SwiftUI MVVM / Roteador / NavigationLink

A idéia era injetar os Links de destino na exibição reutilizável. Geralmente, a ideia funciona, mas infelizmente isso não é dimensionado para aplicativos de produção reais. Assim que tenho várias telas reutilizáveis, encontro o problema lógico de que uma view reutilizável ( ViewA) precisa de um destino de visualização pré-configurado ( ViewB). Mas e se ViewBtambém precisar de um destino de exibição pré-configurado ViewC? Eu preciso criar ViewBjá de tal forma que ViewCjá é injetado em ViewBantes de eu injetar ViewBem ViewA. E assim por diante ... mas como os dados que naquele momento precisam ser transmitidos não estão disponíveis, toda a construção falha.

Outra idéia que tive foi usar o Environmentmecanismo de injeção como dependência para injetar destinos NavigationLink. Mas acho que isso deve ser considerado mais ou menos como um hack e não uma solução escalável para aplicativos grandes. Nós acabaríamos usando o Ambiente basicamente para tudo. Mas como o Ambiente também pode ser usado apenas dentro do View (não em coordenadores ou ViewModels separados), isso criaria novamente construções estranhas na minha opinião.

Assim como a lógica de negócios (por exemplo, ver código do modelo) e a visualização, também é necessário separar a navegação e a visualização (por exemplo, o padrão do coordenador). UIKitÉ possível porque acessamos UIViewControllere UINavigationControllerpor trás da visualização. UIKit'sO MVC já teve o problema de juntar tantos conceitos que se tornou o nome divertido "Massive-View-Controller" em vez de "Model-View-Controller". Agora, um problema semelhante continua, SwiftUImas ainda pior na minha opinião. A navegação e as visualizações são fortemente acopladas e não podem ser dissociadas. Portanto, não é possível fazer visualizações reutilizáveis ​​se elas contiverem navegação. Foi possível resolver isso, UIKitmas agora não consigo ver uma solução sã noSwiftUI. Infelizmente, a Apple não nos deu uma explicação sobre como resolver problemas de arquitetura como esse. Temos apenas alguns aplicativos de amostra pequenos.

Eu adoraria provar que estou errado. Mostre-me um padrão de design de aplicativo limpo que resolve isso para aplicativos prontos para grandes produções.

Desde já, obrigado.

Atualização: essa recompensa terminará em alguns minutos e, infelizmente, ainda ninguém foi capaz de fornecer um exemplo de trabalho. Mas vou iniciar uma nova recompensa para resolver esse problema se não encontrar outra solução e vinculá-la aqui. Obrigado a todos pela excelente contribuição!

O fechamento é tudo que você precisa!

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)
                }
            }
        }
    }
}

Eu escrevi um post sobre a substituição do padrão delegado no SwiftUI por fechamentos. https://swiftwithmajid.com/2019/11/06/the-power-of-closures-in-swiftui/

Minha idéia seria praticamente uma combinação de Coordinatore Delegatepadrão. Primeiro, crie uma Coordinatorclasse:

struct Coordinator {
    let window: UIWindow

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

Adapte o SceneDelegatepara usar o 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()
        }
    }

Dentro de ContentView, temos o seguinte:

struct ContentView: View {
    var delegate: ContentViewDelegate?

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

Podemos definir o ContenViewDelegateprotocolo assim:

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

Onde Itemé apenas uma estrutura que é identificável, poderia ser qualquer outra coisa (por exemplo, id de algum elemento como em um TableViewno UIKit)

O próximo passo é adotar esse protocolo Coordinatore simplesmente passar a visualização que você deseja apresentar:

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

Até agora, isso funcionou bem nos meus aplicativos. Espero que ajude.

Algo que me ocorre é que quando você diz:

Mas e se o ViewB também precisar de um ViewC de destino de exibição pré-configurado? Eu precisaria criar o ViewB já de forma que o ViewC já seja injetado no ViewB antes de injetar o ViewB no ViewA. E assim por diante .... mas como os dados que naquele momento precisam ser transmitidos não estão disponíveis, toda a construção falha.

não é bem verdade. Em vez de fornecer visualizações, você pode projetar seus componentes reutilizáveis ​​para fornecer tampas que fornecem visualizações sob demanda.

Dessa forma, o fechamento que produz o ViewB on demand pode fornecê-lo com um fechamento que produz o ViewC sob demanda, mas a construção real das visualizações pode ocorrer no momento em que as informações contextuais necessárias estão disponíveis.

Aqui está um exemplo divertido de detalhar infinitamente e alterar seus dados para a próxima exibição de detalhes programaticamente

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())
    }
}

Estou escrevendo uma série de posts sobre como criar uma abordagem MVP + Coordinators no SwiftUI, o que pode ser útil:

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

O projeto completo está disponível no Github: https://github.com/Lascorbe/SwiftUI-MVP-Coordinator

Estou tentando fazer isso como se fosse um grande aplicativo em termos de escalabilidade. Acho que resolvi o problema de navegação, mas ainda preciso ver como fazer links diretos, e é nisso que estou trabalhando atualmente. Espero que ajude.

Esta é uma resposta completamente absurda, então provavelmente será um absurdo, mas eu ficaria tentado a usar uma abordagem híbrida.

Use o ambiente para passar por um único objeto coordenador - vamos chamá-lo de NavigationCoordinator.

Dê às suas visualizações reutilizáveis ​​algum tipo de identificador que é definido dinamicamente. Esse identificador fornece informações semânticas correspondentes ao caso de uso real do aplicativo cliente e à hierarquia de navegação.

Faça com que as visualizações reutilizáveis ​​consultem o NavigationCoordinator quanto à visualização de destino, passando seu identificador e o identificador do tipo de visualização para o qual estão navegando.

Isso deixa o NavigationCoordinator como um único ponto de injeção e é um objeto sem visualização que pode ser acessado fora da hierarquia da visualização.

Durante a instalação, você pode registrar as classes de exibição corretas para retornar, usando algum tipo de correspondência com os identificadores que são transmitidos no tempo de execução. Algo tão simples quanto combinar com o identificador de destino pode funcionar em alguns casos. Ou combinando com um par de identificadores de host e destino.

Em casos mais complexos, você pode escrever um controlador personalizado que leve em consideração outras informações específicas do aplicativo.

Como é injetado pelo ambiente, qualquer visualização pode substituir o NavigationCoordinator padrão a qualquer momento e fornecer um diferente para suas subvisões.