1

我正在尝试从列表中的一行将图像动画到全屏,然后在我关闭它时动画回来。我正在尝试 .matchedGeometryEffect 但有两个大问题。

首先,解雇时没有动画。

其次,如果您先按行导航到推送的视图,然后返回并尝试按图像,它会非常奇怪地反向动画。

struct ContentView: View {
    
    @Namespace private var animation
    
    @State var showFullScreen = false
    
    var body: some View {
        NavigationView {
            ZStack {
                List {
                    NavigationLink {
                        Text("Hello World")
                    } label: {
                        Button {
                            withAnimation {
                                showFullScreen = true
                            }
                        } label: {
                            Image(uiImage: UIImage(named: "image") ?? UIImage())
                                .resizable()
                                .aspectRatio(contentMode: .fill)
                                .frame(width: 60, height: 60)
                                .matchedGeometryEffect(id: "ident", in: animation)
                        }
                        .buttonStyle(PlainButtonStyle())
                    }
                    .padding()
                }
                if showFullScreen {
                    Image(uiImage: UIImage(named: "image") ?? UIImage())
                        .resizable()
                        .aspectRatio(contentMode: .fit)
                        .matchedGeometryEffect(id: "ident", in: animation)
                }
            }
            .navigationTitle("Geometry Test")
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Button {
                        withAnimation {
                            showFullScreen = false
                        }
                    } label: {
                        Text("Dismiss")
                    }

                }
            }
        }
    }
}
4

0 回答 0