A loader with variable width

loader.swift

//
//  ContentView.swift
//  content_loading
//
//  Created by Amos Gyamfi on 12.7.2020.
//

import SwiftUI

struct ContentView: View {
    
    @State private var moveRightLeft = false
    
    let screenFrame = Color(.systemBackground)
    var body: some View {
        ZStack {
            screenFrame
                .edgesIgnoringSafeArea(/*@START_MENU_TOKEN@*/.all/*@END_MENU_TOKEN@*/)
            
            VStack(spacing: 20) {
                ZStack {
                    Capsule()  // Inactive: Gray
                        .frame(width: 128, height: 6, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                        .foregroundColor(Color(.systemGray4))
                        
                    Capsule()  // Active: Blue
                        .clipShape(Rectangle().offset(x: moveRightLeft ? 80 : -80))  // Animation 2: hide portion the width
                        .frame(width: 100, height: 6, alignment: .leading)
                        .foregroundColor(Color(.systemBlue))
                        .offset(x: moveRightLeft ? 14 : -14)  // Animation 1: Back and forth
                        .animation(Animation.easeInOut(duration: 0.5).delay(0.2).repeatForever(autoreverses: true))
                        .onAppear {
                            moveRightLeft.toggle()
                        }
                }
                Divider()
                Text("Sending photos 7 of 7")
            }.padding(/*@START_MENU_TOKEN@*/.all/*@END_MENU_TOKEN@*/, 30).frame(width: 250, height: /*@START_MENU_TOKEN@*/100/*@END_MENU_TOKEN@*/, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/).background(Color(.systemGray6)).cornerRadius(12)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
          
            
    }
}