SwiftUI—如何制作样式丰富的过渡动画

2020-07-15  本文已影响0人  anny_4243

原文链接:https://github.com/fzhlee/SwiftUI-Guide#-%E7%AC%AC9%E8%8A%82asymmetrictransition-

本节课将制作样式丰富、视觉精美的过渡动画。

struct ContentView : View {
    @State var showPicture = false //标识是否显示或隐藏指定的视图

    var body: some View {
        VStack {
            Button(action: {
                withAnimation {
                    self.showPicture.toggle() //以动画的方式改变toggle布尔属性的值
                }
            }) {
                Text("Show picture")
            }

            if showPicture { //当布尔属性为真时,显示一个指定名称的图像视图
//                Image("logo")
                
//                Image("logo")
//                    .transition(.move(edge: .top)) //设置图像视图的过渡效果,过渡样式为向上方移动
                
//                Image("logo")
//                    .transition(.scale(scale: 0))
                
//                Image("logo")
//                    .transition(.slide)
                
//                Image("logo")
//                    .transition(.asymmetric(insertion: .scale(scale: 0), removal: .slide))
                
                Image("logo")
                    .transition(AnyTransition.scale(scale: 0).combined(with:.slide))
            }
        }
    }
}
image
上一篇下一篇

猜你喜欢

热点阅读