CODEWITHSUNDEEP
swiftuialamofire
Erik
Erik

Reputation: 519

Show loading image until response

I'm sending via AlamoFire an audio file to a REST API and get a JSON response. Meanwhile I would like to display a loading image (e.g. animated circle) until I receive the response. My current solution is so far:

let voiceData = try? Data(contentsOf: audioRecorder.url)
let uploadUrl = "<server ip>"
    
AF.upload(multipartFormData: { multipartFormData in
   multipartFormData.append(voiceData!, withName: "file", fileName: "recording.m4a", mimeType: "audio/mpeg")
},
to: uploadUrl, method: .post)
.responseJSON { resp in
    print(resp)
}

Now how can I show the loading image in my SwiftUI View?

Upvotes: 0

Views: 301

Answers (1)

Juan Medina
Juan Medina

Reputation: 559

I'm not sure about AlamoFire, but in order to do 2 things in parallel, you must use async methods, so this is what you could do (in JavaScript):

document.querySelector("#getInfoBtn").addEventListener('click',() => {
    toggleInfoBtnSpinner()
    setTimeout(AFUpload, 10)
});

let toggleInfoBtnSpinner = () => {
    const btn = document.querySelector("#getInfoBtn")
    const spinner = btn.querySelector("#infoSpinner")

    if (spinner == null) {
        btn.innerHTML = `<span id="infoSpinner" class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>Search`
    } else {
        spinner.remove()
        btn.innerHTML = `Search`
    }
    btn.disabled = !btn.disabled
}

This will set the spinner start and then, you'll execute your AFUpload function after 10 ms as an async function and you can trigger something rom that function to let the system know it finished

Upvotes: 0

Related Questions