How can I have Scrolling Text in SwiftUI?

Question

I am trying to make a scrolling text which I want starts with normal position from leading part and scroll to left, once all text disappeared, then text start appears to screen from right and scrolls to left. I made this down code for this goal, but it has 2 issue with it, first: the text should placed outside of screen on right before the animation starts! it means the user be not able see text in normal situation without scrolling, second issue: when I what stop the animation, it makes weird glitz and weird animation, which is not what I want, I want the text jump back to leading position as soon as animation stop! How could i edit this code for those issues?

here is my code:

    struct ContentView: View {
 
    @State var textScrollAction: Bool = Bool()
    
    @State var textGeometrySize: CGSize = CGSize()
    

    var body: some View {

        ZStack {

            Color.yellow.ignoresSafeArea()

            VStack {
                
                Button("Start/Stop") {
                    
                    textScrollAction.toggle()
                    
                }.padding()

                Spacer()
                
            }

            HStack {

                Text("Hello, World!")
                    .padding(.vertical, 5)
                    .background( GeometryReader { geometry in
                        
                        Color.clear
                            .onAppear() { textGeometrySize = geometry.size }
                            .onChange(of: geometry.size) { newValue in textGeometrySize = newValue }
                        
                    })
                    .offset(x: textScrollAction ? -(300 + textGeometrySize.width)/2 : (300 + textGeometrySize.width)/2)
                    .animation(Animation.linear(duration: 8).repeatForever(autoreverses: false), value: textScrollAction)
                

            }
            .frame(width: 300, alignment: .center)
            .background(Color.white)
            .clipped()
            .cornerRadius(7)
            .shadow(radius: 5)


        }
  
    }
}

my goal animation is this:

question from:https://stackoverflow.com/questions/65617182/how-can-i-have-scrolling-text-in-swiftui

Answer 1

Waitting for answers