swiftui 自定义Transition

//
//  Transition.swift
//  TestAppForIos
//
//  Created by wangxuncai on 2021/10/17.
//

import SwiftUI

struct TransitionModifier:ViewModifier{
    let scaleAmount:CGFloat
    let opacity:Double
    let degrees:Double
    func body(content: Content) -> some View {
        content
            .scaleEffect(scaleAmount)
            .opacity(opacity)
            .rotationEffect(Angle(degrees: degrees))
    }
}
struct ThreeDTransitionModifier:ViewModifier{
    let degrees:Double
    let x:CGFloat
    let y:CGFloat
    let z:CGFloat
    let  anchorZ : CGFloat
    let perspective:CGFloat
    let offsetY:CGFloat
    func body(content: Content) -> some View {
        content
            .rotation3DEffect(Angle(degrees: degrees), axis: (x: x, y: y, z: z), anchor: .top, anchorZ: anchorZ, perspective: perspective)
            .offset(x: 0, y: offsetY)
    }
}
extension AnyTransition{
    static var customerScale:AnyTransition{
        return AnyTransition.modifier(
            active: TransitionModifier(scaleAmount: 2, opacity: 0, degrees: 1440),
            identity: TransitionModifier(scaleAmount: 0.0001, opacity: 1, degrees: 0))
    }
    
    static func threeDrotate()->AnyTransition{
        AnyTransition.modifier(
            active: ThreeDTransitionModifier(degrees: 720, x: 1, y: 0, z: 0, anchorZ: 0, perspective: 0.8, offsetY: -600),
            identity: ThreeDTransitionModifier(degrees: 0, x: 0, y: 0, z: 0, anchorZ: 0, perspective: 0.1, offsetY: 0))
    }
}

struct Transition: View {
    @State var show:Bool = false
    @State var   count:Int = 0
 
    var body: some View {
        ZStack {
            LinearGradient(colors: [Color.indigo,Color.indigo.opacity(0.5)], startPoint: .bottom, endPoint: .top)
                .ignoresSafeArea()
            VStack{
                Spacer()
                if show {
                    ZStack {
                        Rectangle()
                           
                            .clipShape(Circle())
                          
                       
                        Text("\(count)")
                            .font(.system(size: 90))
                            .foregroundColor(.white)
                            .frame(width: 200, height: 200)
                            .background(Color.orange)
                            .clipShape(Circle())
                    }
                    .shadow(radius: 10)
                    .frame(width: 300, height: 300)
                    .frame(maxWidth:.infinity,maxHeight: .infinity,alignment: .center)
                    .transition(AnyTransition.threeDrotate())
                }
                Spacer()
                Button(action: {
                    
                    withAnimation(.easeInOut(duration: 1)) {
                        show.toggle()
                    }
                    if show{
                        self.count += 1
                    }
                   
                }, label: {
                    Text(show ? "隐藏":"显示")
                        .font(.title)
                        .foregroundColor(.white)
                        .frame(height:55)
                        .frame(maxWidth:.infinity)
                        .background(Color.pink)//背景色上色放最后
                        .cornerRadius(10)
                        .padding(.horizontal,10)
                    
                })

            }
        }
    }
}