# Play + Pause, same button

**URL:** <https://community.thunkable.com/t/play-pause-same-button/224012>\
**Category:** Questions about Thunkable X\
**Tags:** beginner\
**Created:** [September 12, 2019, 7:52pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012 "2019-09-12T19:52:19Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![looovelee](https://avatars.discourse-cdn.com/v4/letter/l/e19b73/32.png) [@looovelee](https://community.thunkable.com/u/looovelee)\
**Post date:** [September 12, 2019, 7:52pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/1 "2019-09-12T19:52:19Z")

</div>

Hello! I am trying to use 1 button to play music, then the same to pause it and play again. I would like to change the text (or swap a background image) when this happens. I see the options within thunkable, but I’m having trouble putting these blocks together correctly. Nothing I try seems to work.

 ![59](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/b/4/b414189088904c548f325716b7a7f88f85d74255.png)

This is what I have, but I can’t figure out how to pause the audio and change it back to play with the “play” text afterwards.

Many thanks for your help!

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [September 12, 2019, 7:59pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/2 "2019-09-12T19:59:51Z")

</div>

Hey @looovelee,

Something like this should do the trick:

> [@Creating a Toggle in Thunkable](http://community.thunkable.com/t/creating-a-toggle-in-thunkable-x/53574):
>
> You can create an on/off switch, also known as a toggle switch, in your app with a variety of different components and blocks in Thunkable X. Switch The [switch](https://docs.thunkable.com/thunkable-cross-platform/create/components/user-interface/switch) component is probably the easiest to get started with. When the switch is clicked, the value changes. The newValue variable is either true or false, depending on whether the switch is on or off. In this example, a [label](https://docs.thunkable.com/thunkable-cross-platform/create/components/user-interface/label) is used to display the words “On” or “Off” depending on the position of the string. [05] [Click to remix the “Toggl”…](https://x.thunkable.com/copy/22cb09b96dffc0d557d5feab3e481ffe)

---

<div class="post-metadata">

**Author:** ![looovelee](https://avatars.discourse-cdn.com/v4/letter/l/e19b73/32.png) [@looovelee](https://community.thunkable.com/u/looovelee)\
**Post date:** [September 12, 2019, 8:09pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/3 "2019-09-12T20:09:00Z")

</div>

Thank you so much for your help!

I don’t think I did a very good job of explaining my goals here. 😉

 ![29](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/3/53a3e9a30e08d03c4971f897f04cc779eed6bf14.png)

I am looking to have a play button (left), when clicked this button plays music and instantly changes into a pause button (right) for ease of use. When the user uses this button a 2nd time, it will act as a pause button. As soon as it is clicked the second time, it is now back to the original state (left) of “PLAY”, so the user can use it again to play the media.

What I’ve been able to do so far is have the text change to pause and the media to start on 1st click.

I can’t seem to figure out how to make the 2nd click recognise it is now a pause button? I want it to pause media and return to “PLAY” text or image.

Does that make sense? 🙂 Many thanks!

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [September 12, 2019, 8:38pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/4 "2019-09-12T20:38:37Z")

</div>

There’s an example of this in the 4th post.

> [@Creating a Toggle in Thunkable](http://community.thunkable.com/t/creating-a-toggle-in-thunkable-x/53574/4):
>
> Expanding on the previous idea, you can toggle the background image of a component by doing something like this: [22] [Click to remix the “Toggl” app](https://x.thunkable.com/copy/22cb09b96dffc0d557d5feab3e481ffe)

i.e:  
if play.jpg  
set bg\_image to pause.jpg  
else  
set bg\_image to play.jpg

---

<div class="post-metadata">

**Author:** ![CBVG](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/cbvg/32/32401_2.png) [@CBVG](https://community.thunkable.com/u/CBVG)\
**Post date:** [September 12, 2019, 10:55pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/5 "2019-09-12T22:55:59Z")

</div>

What you need is something like this:

![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/9/b/9b6e6d60a8a0ce76c5dd3f0da627126cdc3ff8b3.png)

Each time someone clicks the PlayPause button, the value of “pause” changes from true to false, or from false to true.  
Then it is only a matter of using the if/else logic block to change the image displayed and to perform the actual playing and pausing. Just be careful which is which, as the changing is done BEFORE it is acted on, so may be the reverse of what you would expect (but since it is a pure if/else, that is easily seen and corrected).

---

<div class="post-metadata">

**Author:** ![looovelee](https://avatars.discourse-cdn.com/v4/letter/l/e19b73/32.png) [@looovelee](https://community.thunkable.com/u/looovelee)\
**Post date:** [September 14, 2019, 12:02pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/6 "2019-09-14T12:02:32Z")

</div>

This is perfect! Exactly what I was looking for here. That all makes such clear sense now and it works!

Thank you so much for the help and clear explanation.

---

<div class="post-metadata">

**Author:** ![looovelee](https://avatars.discourse-cdn.com/v4/letter/l/e19b73/32.png) [@looovelee](https://community.thunkable.com/u/looovelee)\
**Post date:** [September 14, 2019, 12:03pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/7 "2019-09-14T12:03:00Z")

</div>

Thank you for your help!

---

<div class="post-metadata">

**Author:** ![looovelee](https://avatars.discourse-cdn.com/v4/letter/l/e19b73/32.png) [@looovelee](https://community.thunkable.com/u/looovelee)\
**Post date:** [September 14, 2019, 1:02pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/8 "2019-09-14T13:02:40Z")

</div>

Hmm, now something funny is happening. 😅 Sorry to bother you again, but I do appreciate your help.

When I play the media and depart that screen, the music will start from the beginning the next time I click play. However, if I click play and then pause it with the pause app (Which works beautifully!) and _then_ navigate from the screen it will play again from the point where it was paused.

I would prefer that when the user opens the media screen they have a brand new session - if that makes sense. Everything on this screen should start fresh.

I thought by making the close button call stop that would reset the media. This only works if I have not used the “pause” app.

 ![43](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/3/5/3562686c4ba05ae757e38b97679133506b89e205.png)

---

<div class="post-metadata">

**Author:** ![CBVG](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/cbvg/32/32401_2.png) [@CBVG](https://community.thunkable.com/u/CBVG)\
**Post date:** [September 14, 2019, 10:52pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/9 "2019-09-14T22:52:26Z")

</div>

Apparently, the ‘pause’ function is keeping track of where the playing was at the time, and disregarding anything but a resume command.

So, my suggestion is that, if you leave the media screen, you issue a ‘resume’ and immediately call ‘stop’.  
As the two functions would be one after the other, they would run in a fraction of a second, and no real music would have had the time to play before the playing is overall cancelled.  
Sometimes, you have to adapt your code to the limitations imposed by other choices.That would be such an instance.

---

<div class="post-metadata">

**Author:** ![looovelee](https://avatars.discourse-cdn.com/v4/letter/l/e19b73/32.png) [@looovelee](https://community.thunkable.com/u/looovelee)\
**Post date:** [September 17, 2019, 1:06pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/10 "2019-09-17T13:06:55Z")

</div>

Perfect solution! Thanks a million!

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [April 7, 2020, 4:24pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/11 "2020-04-07T16:24:29Z")

</div>

A post was split to a new topic: [Create a music playlist](https://community.thunkable.com/t/create-a-music-playlist/561665)

---

<div class="post-metadata">

**Author:** ![coreyroos33](https://avatars.discourse-cdn.com/v4/letter/c/848f3c/32.png) [@coreyroos33](https://community.thunkable.com/u/coreyroos33)\
**Post date:** [December 7, 2021, 3:16pm UTC](https://community.thunkable.com/t/play-pause-same-button/224012/12 "2021-12-07T15:16:53Z")

</div>

Hi there,

I was wondering if you would be able to post an image of the final code you used for the single play/pause button that refreshes (as you noted above) and starts from the beginning of the audio recording when users navigate away from the screen and come back later.

I am just a little confused about how to implement the suggestion offered in the post by CBVG that says “…issue a ‘resume’ and immediately call ‘stop’…”

Thanks so much!

Corey

---

<div class="post-metadata">

**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\
**Post date:** [November 8, 2024, 11:39am UTC](https://community.thunkable.com/t/play-pause-same-button/224012/13 "2024-11-08T11:39:16Z")

</div>


