试试这个
extension AnyTransition {
static var delayAndFade: AnyTransition {
return AnyTransition.identity
.combined(with: .opacity)
.animation(.default.delay(3))
}
}
如果要移动视图,则应offset
使用该withAnimation
功能对其进行动画处理。
Text("Move and fade.")
.offset(y: offset)
.transition(.delayAndFade)
struct ContentView: View {
@State private var showDetails = false
@State var offset:CGFloat = 0
var body: some View {
VStack {
Button("Press to show details") {
showDetails.toggle()
withAnimation(.default.delay(3)) {
self.offset = -20
}
}
if showDetails {
Text("Move and fade.")
.offset(y: offset)
.transition(.delayAndFade)
}
}
}
}
更新
extension AnyTransition {
static var moveAndFade: AnyTransition {
return AnyTransition.move(edge: .top)
.combined(with: .opacity)
}
}
试试这个
HStack {
Text("Move and fade.")
}
.animation(Animation.default.delay(2))
.transition(.moveAndFade)
它适用于除文本之外的所有类型的视图。
struct ContentView: View {
@State private var showDetails = false
@State var offset:CGFloat = 0
var body: some View {
VStack {
Button("Press to show details") {
showDetails.toggle()
}
if showDetails {
// Works!
HStack {
Text("Move and fade.")
}
.animation(Animation.default.delay(2))
.transition(.moveAndFade)
Button("Move and fade.") {}
.animation(Animation.default.delay(2))
.transition(.moveAndFade)
// Does not work
Text("Move and fade.")
.animation(Animation.default.delay(2))
.transition(.moveAndFade)
}
}
}
}