SwiftUI: modal view et List

iOS
1

Bonjour à tous,

Je souhaite faire apparaitre une vue modale comportant des informations de villes se trouvant dans une List.
Voici mon code:

	struct ContentView:View {
    let villes = ["Paris","Marseille","Lyon","Lille"]

	@State var selectedVille: String = "Sete"
	@State var showModal: Bool = false

	var body: some View {
		
		List {
			ForEach(0..<self.villes.count) { index in
				HStack {
					Text(self.villes[index])
				}.onTapGesture {
					self.showModal.toggle()
					self.selectedVille = self.villes[index]
				}
			}
		}.sheet(isPresented: $showModal) {
			VilleView(ville: self.selectedVille)
		}	
	}
}

La variable selectedVille me permet de rendre disponible la ville sélectionnée afin que sheet puisse l’utiliser. La variable selectedVille étant de type @State, elle devrait théoriquement prendre la valeur de la ville sélectionnée. Sauf que ce n’est pas le cas!
En effet, lorsque l’on tappe sur une des villes se trouvant dans la table: Paris, Marseille… c’est la ville de Sete, ville utilisée pour initialiser la variable, qui apparait.
Ma question est donc la suivante: quelqu’un a-t-il une idée afin que la bonne ville apparaisse dans ma vue modale ?

Merci à tous :+1:

2

Bonjour,

En changeant l’ordre des deux instructions dans onTapGesture ?

self.selectedVille = self.villes[index]
self.showModal.toggle()

Cordialement,
Nicolas

3

Bonjour Nicolas,
j’ai déjà essayé: cela ne marche pas

4

Salut @Michael7

Essaye sa :

List {
		ForEach(0..<self.villes.count) { index in
			HStack {
				Text(self.villes[index])
			}
            .onTapGesture {
				self.showModal.toggle()
			}
            .sheet(isPresented: $showModal) {
		         VilleView(ville:self.villes[index])
	         }

		}
	}
5

Bonjour Samir,

Hélas toujours pas. Les premiers clicks restent sur « Sete ». Après plusieurs clicks, les informations se trouvant dans la vue modale sont correctes.

6

Essay sa (met ton tableau directement dans le foreach)

List {
		ForEach(tableauDeVille,id: \.self) { ville in
			HStack {
				Text(ville)
			}
            .onTapGesture {
				self.showModal.toggle()
			}
            .sheet(isPresented: $showModal) {
		         VilleView(ville: ville)
	         }

		}
	}
7

Et sinon, je viens de tester ceci qui fonctionne:

    let villes = ["Paris","Marseille","Lyon","Lille"]
    
    var body: some View {
        List {
            ForEach(villes, id: \.self) { ville in
                HStack {
                    VilleSynthese(ville:ville)
                }
            }
            
        }
    }
}

struct VilleSynthese: View {
    var ville: String
    @State var showModal: Bool = false
    var body: some View {
        Text("Vue synthétique, pour la ville \(ville)!")
            .onTapGesture {
                self.showModal.toggle()
                
            }
            .sheet(isPresented: $showModal) {
                            VilleView(ville: ville)
                        }
        
    }
}

Cordialement,
Nicolas

1 « J'aime »
8

Merci Samir de ton aide.

En effectuant ce code, lorsque je clique sur une ville, j’obtiens systématiquement les informations de la première ville du tableau (« Paris »)

9

Merci Nicolas.
Je vais essayer cette solution et je vous tiens au courrant.

10

Merci Nicolas: ça marche parfait ! Les informations des villes sont correctes dès le premier click !
Merci à Samir aussi.

Bonne soirée à tous !

1 « J'aime »
11

J’aurais tendance à mettre à jour selectedVille non pas dans le .onTapGesture mais dans le ForEach, de sorte que ce soit fait au moment du .onTap, mais je n’ai pas essayé avant de répondre et je me trompe souvent.

12

fjacquemin bonjour,
en mettant à jour selectedVille au fur et à mesure que je remplis la table avec le ForEach, je me retrouve avec la dernière valeur de la table affectée à selectedVille. Ainsi, quelque soit l’élément de la table que je sélectionne, la valeur de selectedVille reste la même.

13

Ah oui. Tu as tout à fait raison. D’où l’idée de prévoir un bouton pour pouvoir sélectionner chaque élément de la liste et développer ton action sheet.