前提
SwiftUIでNavigationLinkを活用して画面遷移を行うプログラムを作成しています。
遷移元から遷移先へ移動する際のアニメーションは、「transaction」によって無効にしています。
遷移先から遷移元へ戻る際は、NavigationViewデフォルトの戻るボタンを使わずに「dismiss()」を実行して画面を破棄しています。
(理想のレイアウトを実現するために、デフォルトの戻るボタンは使用せずに実装したいです。)
「dismiss()」も同じように「transaction」でアニメーションを無効にしたいのですが、同じように実装しても遷移時のアニメーションが残ってしまっています。
実現したいこと
- dismissで画面を遷移(破棄)した際のアニメーションを無効にしたい
発生している問題・エラーメッセージ
「transaction」でアニメーションを無効にしても、遷移時のアニメーションが残ってしまう。
該当のソースコード
【ContentView.swift】
swift
1import SwiftUI 2 3struct ContentView: View { 4 @State var page : Int? = 0 5 @State var transaction = Transaction() 6 var body: some View { 7 NavigationView { 8 ZStack{ 9 NavigationLink(destination : testView2(), tag: 1, selection: $page) {} 10 NavigationLink(destination : testView3(), tag: 2, selection: $page) {} 11 Image("bg_coast") 12 .resizable(resizingMode: .stretch) 13 .aspectRatio(contentMode: .fit) 14 .scaleEffect(1.5) 15 VStack { 16 Image("titlelogo_none") 17 .resizable(resizingMode: .stretch) 18 .aspectRatio(contentMode: .fit) 19 Spacer() 20 Button(action: { 21 transaction.disablesAnimations = true // 画面遷移アニメーション無効 22 withTransaction(transaction) { 23 self.page = 1 // 画面遷移実行 24 } 25 print("start") 26 }) { 27 Text("スタート") 28 .font(.system(size: 45)) 29 .fontWeight(.bold) 30 .frame(width:300, height: 90, alignment: .center) 31 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 32 .background(Color(hue: 0.156, saturation: 1.0, brightness: 1.0)) 33 }.buttonStyle(MyButtonStyle()) 34 Spacer() 35 Button(action: { 36 transaction.disablesAnimations = true // 画面遷移アニメーション無効 37 withTransaction(transaction) { 38 self.page = 2 // 画面遷移実行 39 } 40 print("collection") 41 }) { 42 Text("コレクション") 43 .font(.largeTitle) 44 .fontWeight(.bold) 45 .frame(width:300, height: 60, alignment: .center) 46 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 47 .background(Color.yellow) 48 }.buttonStyle(MyButtonStyle()) 49 Spacer() 50 Button(action: { 51 print("config") 52 }) { 53 Text("せってい") 54 .font(.title) 55 .fontWeight(.bold) 56 .frame(width:300, height: 60, alignment: .center) 57 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 58 .background(Color.yellow) 59 }.buttonStyle(MyButtonStyle()) 60 Spacer() 61 } // VStack 62 } // ZStack 63 .navigationBarTitle("") // NavigationBar非表示 64 .navigationBarHidden(true) 65 .navigationBarBackButtonHidden(true) // 戻るボタン非表示 66 } // NavigationView 67 } 68} 69 70struct testView2:View{ 71 @State var page : Int? = 0 72 @Environment(\.dismiss) var dismiss 73 @State var transaction = Transaction() 74 var body: some View{ 75 ZStack(){ 76 NavigationLink(destination : testView3(), tag: 1, selection: $page) {} 77 Image("bg_tetrapod") 78 .resizable(resizingMode: .stretch) 79 .aspectRatio(contentMode: .fit) 80 .scaleEffect(1.5) 81 HStack(){ 82 Spacer() 83 Button(action: { 84 transaction.disablesAnimations = true // 画面遷移アニメーション無効 85 withTransaction(transaction) { 86 dismiss() 87 } 88 print("back") 89 }) { 90 Text("もどる") 91 .font(.title) 92 .fontWeight(.bold) 93 .frame(width:120, height: 50, alignment: .center) 94 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 95 .background(Color.yellow) 96 }.buttonStyle(MyButtonStyle()) 97 Spacer() 98 Button(action: { 99 var transaction = Transaction() 100 transaction.disablesAnimations = true // 画面遷移アニメーション無効 101 withTransaction(transaction) { 102 self.page = 1 // 画面遷移実行 103 } 104 print("ok") 105 }) { 106 Text("オッケー") 107 .font(.title) 108 .fontWeight(.bold) 109 .frame(width:150, height: 50, alignment: .center) 110 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 111 .background(Color.yellow) 112 }.buttonStyle(MyButtonStyle()) 113 Spacer() 114 } 115 } 116 .navigationBarTitle("") // NavigationBar非表示 117 .navigationBarHidden(true) 118 .navigationBarBackButtonHidden(true) // 戻るボタン非表示 119 } 120} 121 122struct testView3:View{ 123 @Environment(\.dismiss) var dismiss 124 var body: some View{ 125 ZStack(){ 126 Image("bg_sunset") 127 .resizable(resizingMode: .stretch) 128 .aspectRatio(contentMode: .fit) 129 .scaleEffect(1.5) 130 HStack(){ 131 Spacer() 132 Button(action: { 133 dismiss() 134 print("back") 135 }) { 136 Text("もどる") 137 .font(.title) 138 .fontWeight(.bold) 139 .frame(width:120, height: 50, alignment: .center) 140 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 141 .background(Color.yellow) 142 }.buttonStyle(MyButtonStyle()) 143 Spacer() 144 Button(action: { 145 print("ok") 146 }) { 147 Text("オッケー") 148 .font(.title) 149 .fontWeight(.bold) 150 .frame(width:150, height: 50, alignment: .center) 151 .foregroundColor(Color(hue: 0.665, saturation: 1.0, brightness: 1.0)) 152 .background(Color.yellow) 153 }.buttonStyle(MyButtonStyle()) 154 Spacer() 155 } 156 } 157 .navigationBarTitle("") // NavigationBar非表示 158 .navigationBarHidden(true) 159 .navigationBarBackButtonHidden(true) // 戻るボタン非表示 160 } 161} 162 163struct MyButtonStyle: ButtonStyle { 164 func makeBody(configuration: Self.Configuration) -> some View { 165 configuration.label 166 .cornerRadius(10, antialiased: true) 167 .opacity(configuration.isPressed ? 0.9 : 1) 168 } 169} 170 171struct ContentView_Previews: PreviewProvider { 172 static var previews: some View { 173 ContentView() 174 testView2() 175 testView3() 176 } 177} 178
試したこと
下記のサイトを拝見したのですが、サイト内で使われている「dismissHandler」の使い方が分からず実現できませんでした。
dismissのアニメーションを無効化する方法
補足情報(FW/ツールのバージョンなど)
- Xcode:13.1
あなたの回答
tips
プレビュー