web-dev-qa-db-fra.com

SWIFTUI: Animez les modifications de la liste sans animation de changements de contenu

J'ai une application simple à Swiftui qui montre un List, et chaque élément est un VStack avec deux Text éléments:

var body: some View {
    List(elements) { item in
        NavigationLink(destination: DetailView(item: item)) {
            VStack(alignment: .leading) {
                Text(item.name) 
                Text(self.distanceString(for: item.distance))
            }
        }
    }
    .animation(.default)
}

La fonction .animate() est là car je souhaite animer des modifications à la liste lorsque le tableau elements modifie. Malheureusement, Swiftui anime également les modifications apportées au contenu, conduisant à un comportement étrange. Par exemple, la seconde Text Dans chaque élément met à jour des mises à jour assez fréquemment, et une mise à jour montrera maintenant l'étiquette tronquée (avec ... À la fin) avant de mettre à jour le nouveau contenu.

Comment puis-je empêcher ce comportement étrange lorsque je mettez à jour le contenu de la liste, mais gardez des animations lorsque les éléments de la liste changent?

Au cas où il est pertinent, je crée une application de surveillance.

swiftswiftuiwatchosswiftui-list
9
BlackWolf

Les éléments suivants devraient désactiver des animations pour les internaux de ligne

VStack(alignment: .leading) {
    Text(item.name) 
    Text(self.distanceString(for: item.distance))
}
.animation(nil)
7
Asperi

La réponse de @Asperi a corrigé la question que j'avais aussi (la réponse suscitée comme toujours).

J'ai eu un problème où j'avais animé l'écran entier à l'aide de ci-dessous: AnyTransition.asymmetric(insertion: .move(Edge: .bottom), removal: .move(Edge: .top))

Et tout le texte () et le bouton () sous les vues où l'animation aussi dans des voies étranges et non merveilleuses. J'ai utilisé Animation (NIL) pour résoudre le problème après avoir vu la réponse d'Asperi. Cependant, le problème était que mes boutons ne sont plus animés sur la sélection, avec d'autres animations que je voulais.

J'ai donc ajouté une nouvelle variable d'état pour allumer et éteindre les animations du VStack. Ils sont désactivés par défaut et une fois que la vue a été animée à l'écran, je leur permet de leur permettre un petit retard:

struct QuestionView: Voir {@state private Var allowanimations: bool = false

var body : some View {
    VStack(alignment: .leading, spacing: 6.0) {
        Text("Some Text")

        Button(action: {}, label:Text("A Button")
    }
    .animation(self.allowAnimations ? .default : nil)
    .onAppear() {
         DispatchQueue.main.asyncAfter(deadline: .now() + 0.4) {
             self.allowAnimations = true
         }
    }
}

Il suffit d'ajouter ceci pour quiconque a un problème similaire pour moi et qu'il avait besoin de construire sur une excellente réponse d'Asperi.

0
Brett