I would like to animate a Text view whenever it is conditionally presented or removed based upon a state variable.

I've tried, to no avail

struct AnimatedText: View {
  @State var showingText = false
  
  var body: some View {
    VStack {

      if showingText {
        Text("Hello world")
          .animation(.easeInOut, value: showingText)
      }
      
      Button("Toggle") {
        showingText.toggle()
      }
    }
  }
}

How can I animate the Text view?

CodePudding user response：

Appear/disappear is animated by container, so you need to place Text into some container and make it animatable, like

var body: some View {
  VStack {

    VStack {
      if showingText {
        Text("Hello world")
      }
    }.animation(.easeInOut, value: showingText)     // << here !!

    Button("Toggle") {
      showingText.toggle()
    }
  }
}