前提・実現したいこと
List上でカードがスライドするanimationを実装したいと考えています。
発生している問題・エラーメッセージ
現在Spacerをtoggleにて出現させる仕様にしているのですが、Listに10個ほど入れたあたりから挙動がおかしくなります。
本来ならば、Spacerをduration: 2でゆっくり出現させたいところが、一瞬で出現し、カードが滑らかに動きません。
どなたか原因が分かる方はいらっしゃらないでしょうか?よろしくお願いします。
該当のソースコード
SwiftUI
1struct ContentView: View { 2 @State private var animals = [ 3 Row(name: "dog"), 4 Row(name: "wolf"), 5 Row(name: "horse"), 6 Row(name: "gorilla"), 7 Row(name: "monkey"), 8 Row(name: "rabbit"), 9 Row(name: "rat"), 10 Row(name: "tiger"), 11 Row(name: "cat"), 12 Row(name: "pig"), 13 Row(name: "lion"), 14 Row(name: "fox"), 15 Row(name: "bear"), 16 ] 17 18 var body: some View { 19 HStack { 20 List{ 21 ForEach(animals, id: .self) { animal in 22 RowView(animalName: animal.name) 23 } 24 } 25 } 26 } 27} 28 29struct Row: Identifiable, Hashable { 30 var id = UUID() 31 var name : String 32} 33 34struct RowView: View { 35 @State var show = false 36 var animalName: String 37 38 var body: some View { 39 HStack{ 40 if show{ 41 Spacer() 42 } 43 44 ZStack { 45 Rectangle() 46 .fill(Color.white) 47 .frame(width: 180, height: 180) 48 .border(Color.black, width: 5) 49 .gesture(TapGesture().onEnded{ 50 withAnimation(.linear(duration: 2)){ 51 self.show.toggle() 52 } 53 }) 54 55 Text(animalName) 56 } 57 } 58 } 59}
試したこと
Spacerをoffsetに変えてみる✖️
DispatchQueueによる遅延処理✖️
ListをFormに変えてみる✖️
などなど色々試してみましたがうまくいきません。
しかし本意では無いですが、下記のようにNavigationListを実装するときちんと動作することは確認できました。
該当のソースコード
SwiftUI
1struct ContentView: View { 2 @State private var animals = [ 3 Row(name: "dog"), 4 Row(name: "wolf"), 5 Row(name: "horse"), 6 Row(name: "gorilla"), 7 Row(name: "monkey"), 8 Row(name: "rabbit"), 9 Row(name: "rat"), 10 Row(name: "tiger"), 11 Row(name: "cat"), 12 Row(name: "pig"), 13 Row(name: "lion"), 14 Row(name: "fox"), 15 Row(name: "bear"), 16 ] 17 18 var body: some View { 19 HStack { 20 NavigationView { 21 List{ 22 ForEach(animals, id: .self) { animal in 23 NavigationLink(destination: SecondView()) { 24 RowView(animalName: animal.name) 25 } 26 } 27 } 28 } 29 } 30 } 31}
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。