swiftui自定义过度动画

首先创建一个结构体,需要符合ViewModifier，

struct CornerRotateModifier:ViewModifier {

  let amount : Double

  let anchor : UnitPoint

  func body(content:Content) -> some View {

    content

      .rotationEffect(.degrees(amount),anchor: anchor)

      .clipped()

  }

}

然后对其进行扩展,也可以不用扩展,直接使用.modifier过渡直接尝试

extension AnyTransition{

  static var pivot:AnyTransition{

    .modifier(active: CornerRotateModifier(amount: -90, anchor: .topLeading), identity: CornerRotateModifier(amount: 0, anchor: .topLeading))

  }

}

然后在view中使用

struct ShowView: View {

  @State private var isShowRed = false

    var body: some View {

      ZStack{

        Rectangle()

          .fill(.blue)

          .frame(width: 200, height: 200)

        if isShowRed{

          Rectangle()

            .fill()

            .frame(width: 200, height: 200)

            .transition(.pivot)

        }

      }

      .onTapGesture {

        withAnimation{

          isShowRed.toggle()

        }

      }

    }

}