title: Disable animation when a view appears in SwiftUI
body: <p>I got a problem while trying to display a custom loading view in SwiftUI.
  I created a  custom struct view OrangeActivityIndicator:</p>
  <pre><code>struct OrangeActivityIndicator: View {
      var style = StrokeStyle(lineWidth: 6, lineCap: .round)
      @State var animate = false
      let orangeColor = Color.orOrangeColor
      let orangeColorOpaque = Color.orOrangeColor.opacity(0.5)
      
      init(lineWidth: CGFloat = 6) {
          style.lineWidth = lineWidth
      }
      
      var body: some View {
          ZStack {
              Circle()
                  .trim(from: 0, to: 0.7)
                  .stroke(
                      AngularGradient(gradient: .init(colors: [orangeColor, orangeColorOpaque]), center: .center), style: style
                  )
                  .rotationEffect(Angle(degrees: animate ? 360 : 0))
                  .animation(Animation.linear(duration: 0.7).repeatForever(autoreverses: false))
          }.onAppear() {
              self.animate.toggle()
          }
      }
  }
  </code></pre>
  <p>I use it inside  different screens or views, my problem is that it appears weirdly, for example in CampaignsView of the app I display it when the server call is in progress.</p>
  <pre><code>struct CampaignsView: View {
      
      @ObservedObject var viewModel: CampaignsViewModel
      
      var body: some View {
          NavigationView {
              ZStack {
                  VStack(spacing: 0) {
                      CustomNavigationBar(campaignsNumber: viewModel.cardCampaigns.count)
                          .padding([.leading, .trailing], 24)
                          .frame(height: 25)
                      CarouselView(x: $viewModel.x, screen: viewModel.screen, op: $viewModel.op, count: $viewModel.index, cardCampaigns: $viewModel.cardCampaigns).frame(height: 240)
                      CampaignDescriptionView(idx: viewModel.index, cardCampaigns: viewModel.cardCampaigns)
                          .padding([.leading, .trailing], 24)
                      Spacer()
                  }
                  .onAppear {
                      self.viewModel.getCombineCampaigns()
                  }
                  if viewModel.isLoading {
                      OrangeActivityIndicator()
                          .frame(width: 40, height: 40)
                  }
              }
              .padding(.top, 34)
              .background(Color.orBackgroundGrayColor.edgesIgnoringSafeArea(.all))
              .navigationBarHidden(true)
          }
      }
  }
  </code></pre>
  <p>The Indicator itself is correctly spinning, the problem is when it appears, it appears as a translation animation coming from the bottom to the middle of the screen. This is my viewModel with the server call and isLoading property:</p>
  <pre><code>class CampaignsViewModel: ObservableObject {
      
      @Published var index: Int = 0
      @Published var cardCampaigns: [CardCampaign] =  [CardCampaign]()
      @Published var isLoading: Bool = false
  
      var cancellable: AnyCancellable?
  
  
      
      func getCombineCampaigns() {
          self.isLoading = true
          let campaignLoader = CampaignLoader()
          cancellable = campaignLoader.getCampaigns()
              .receive(on: DispatchQueue.main)
              //Handle Events operator is used for debugging.
              .handleEvents(receiveSubscription: { print(&quot;Receive subscription: \($0)&quot;) },
                            receiveOutput: { print(&quot;Receive output: \($0)&quot;) },
                            receiveCompletion: { print(&quot;Receive completion: \($0)&quot;) },
                            receiveCancel: { print(&quot;Receive cancel&quot;) },
                            receiveRequest: { print(&quot;Receive request: \($0)&quot;) })
              .sink { completion in
                  switch completion {
                  case .finished:
                      break
                  case .failure(let error):
                      print(error)
                  }
              } receiveValue: { campaignResult in
                  self.isLoading = false
                  guard let campaignsList = campaignResult.content else {
                      return
                  }
                  self.cardCampaigns = campaignsList.map { campaign in
                      return CardCampaign(campaign: campaign)
                  }
                  self.moveToFirstCard()
              }
      }
  }
  </code></pre>