Hi,
I have successfully created been able to fetch an audio file from my CMS and started playing it with using the “Play audio” component I installed from the marketplace.
The audio starts playing when I click on a “play” icon. After the audio starts playing I would like to change the visible icon to “pause” and ofcourse when this event is tapped, stop playing the audio file.
anyone have any ideas how this could be setup?
I would do this by creating a page variable “play_icon” and setting it to be type icon name. Then you can set the icon name to come from the page variable, and change the value of the page variable on click of the icon.
Hi @Mevi
simple solution once someone said it out loud, thanks for that 
Would I need to open the page again or somehow trigger something for the icon to change?
No problem! And nope, the icon changes immediately when the page variable changes if it is bound directly to it!
for some reason I don’t get the icon to change
I have it setup like this. Boolean IF to determine which Icon is it (play or pause). When the Play audio. asset starts and the mp3 starts playing, I set the page-var-icon to. pause (+ thee boolean value to 0/false). But thee icon doesn’t change.
Do I need to switch it the same time I start the audio player?
No, it shouldn’t matter. There’s something odd in the logic here, but I can’t tell from the top. I would probably simplify the logic at first to check what’s going wrong. First get the changing of the icon working from click, then add the play/pause of the audio so that it works. My guess would be that if the pausing of your audio doesn’t work, the check of if play or pause isn’t correct. Perhaps check with the debugger if all the page variable values are setting correctly.
Here’s the simplest test case setup in which changing the icon on click works, original code so that the icon is changed from button click, but then moved the logic to icon click. Works similarly.
thanks for this! Really appreciate your help!
On another note, have you used the audio preload feature in Appgyver? I started testing that out as one of the audio files I have for testing is really big. The preload does get the audio, but I can’t reference the audio then later when I try to use the Play Audio feature.
If you have used this I’d love to hear how/where should I store the output of the Preload and how to use that audio with Play Audio
I haven’t used the feature myself, but I had a quick look and you should be able to store the output of the Preload in a page variable. Make an Object-type page variable and add the fields specified in the outputs of the preload audio flow in it – here for reference a page variable the preloaded audio can be stored in to be later used in Play audio.
Thanks for the tip @Mevi.
One last question, how do I store the data in this object? Should I be using some formula function or is there a simple way to store all the fetched data?
Um, you can just set the value of the page variable as Output of a previous node and select the output from preload audio. Note that you have to have linked the set page variable flow function to the preload audio flow function for this output to appear. If the schema of the page variable matches, should work just like that.
ok this might be where I’ve made a mistake. what I tried to do is after getting the URL for the audio with a database fetch, I added to that flow “preload audio” and then after that fetch was done, I set the page variable flow function to the preload audio. It didn’t work. So either my Object definition is wrong or I’ve done something wrong a bit earlier in the flow I created.
Thanks!
Hi,
Would you tell me a formula in Assigned value?
Hi! I can’t quickly find that specific repro app, but the formula is just to pick a random icon name from an array. It’s something like
PICK_ITEM([“play”,“star”,“square”,“circle”],RANDOM_INTEGER_BETWEEN(0,3)) where 3 is the length of the array minus one (if you have the array in page variable, use COUNT to find length and - 1)
Thank you for reply, When using “RANDOM_INTEGER_BETWEEN()”, an icon change “random”.
I’d like to change in order and repetition.
In that case, I would use a page variable to count the index which icon to show. Something like this:
PICK_ITEM([“play”,“star”,“square”,“circle”],pagevariable.icon_index)
And then add +1 to icon_index
