Swapping images and stopping audio playback

I have a “listen” button that kicks off a loop of sounds. Currently, once the loop starts there’s no stopping playback. Even existing the app doesn’t stop it.

To address this I added a Stop button and set it isVisible = false. When the user presses the Listen button, I set it to isVisible = false and make the Stop button visible and then start the sound loop.

The problem is that the image change doesn’t happen until after the loop is completed. How can I make these events synchronous?

Once that is in place, I will need to stop audio playback if they press the Stop button.  Will it be possible to break out of the loop from a button touch event?