Back to previous screen button

Hello everybody…

After converting my bubble. app to a mobile app (wrapping), I noticed that the “Return to previous screen” function does not work (see image below).

Are there any free plugins that do this?

Hi @souadbelakhdarrb!

What wrapping plugin are you using?

Hi Dillon…
I wrapped my bubble web app with a service provider called “Air native”

Hello brother, how are you?

I don’t use any plugin to perform this action, i learned that we have infinite possibilities to make things happen in Bubble and in this case, i just use a code inside an HTML element.

As i use it in several places, i created a reusable element that i called “BACK BUTTOM”.

1 - Create a reusable element
2 - Inside it, add 2 elements, HTML and Icon

In the HTML element insert the code:

<button style="cursor: pointer;color:transparent;background:none; border:none; " onclick="goBack()">BACK</button>
<script>
function goBack() {
  window.history.back();
}
</script>

backbtn2

Ready! That’s how i resolved it.

Hope i helped in some way. Success in your business, stay with God!

Good evening dear friend…

Thank you very much…i will try it.

1 Like

Good evening Mr. Tulio;

It didn’t work…I don’t know why!

Should I insert the Code you quoted to me as it is on the HTML? That is to say, do I have to copy and paste the Code without any adaptation?

Hello good afternoon! @souadbelakhdarrb

I’m sorry if my explanation may have been confusing.

I am attaching below the editor link of an example application that I made just now to show you in practice the solution that I use for the same problem that you are having.

Editor: backbutton | Bubble Editor

Please tell me if you were able to understand, use and apply it in your case.
If you need anything I can help you with, reply here and we’ll keep in touch! :slight_smile:

I’m hoping it works out. A big hug!

Hello again Tulioportela;

I may have figured out why it doesn’t work with my native App.

The solution you proposed (and for which I thank you very much) works when an app contains several pages (in addition to the index). The return icon always returns to the index.

But the App I have is made entirely on the index. And the user navigates between groups created on the index. That’s why it’s still on the index.

Thank you very much for the initiative dear friend.

1 Like

Oh brother @souadbelakhdarrb maybe the desire to try to help you was greater than the attention I should have had in the description of your post, hehe. :sweat_smile:

Sorry I couldn’t help you. But, I hope you get your problem resolved soon and that everything goes well with your business. I wish you a 2023 of much prosperity.

Big hug, may God bless you!

So you build your app as an SPA, do you use custom states to show/hide screens?

Because if you do, that’s the problem I think :thinking:

True @design.agx
I think you’re right. I thought about that too.

The way i built it was using reusable elements like pages inside a floating group and the menu navigation redirects (url) to the page (reusable element).

As everything is loaded once, navigation is almost at the speed of light, hehe.

Another positive point is that the suggestion i made here using a reusable element with a code simulating a “back button”, works perfectly! :slight_smile:

1 Like

Hello Tulio;

Very moved by your level of communication…How elegant!

Thank you very much dear friend.

1 Like

Yes I use “custums states” to show and hide screens.

But my problem is with the “Return” button located on the strip at the base of the mobile. the one that takes the user out of the application. This one does not work (See the photo of my post to better understand me.

Normally when I build a web app, I build it as an SPA, and show/hide screens according to the URL.

So if Im in this URL.

{AppName}/home

And I want to show the screen profile, I would change it to

{AppName}/profile.

The action of the button that redirects the user from home to profile, would have a ‘Go to page’ and select the same page but in information to send, I would write ‘profile’

This change of URL is what let’s the back button work. I use this system all the time for web apps, and it works from the desktop and mobile version.

So when a user click the back button, it bring him back one screen.

I’m assuming if your web app is built like this and then you wrap it to be a native app, this will work. :slight_smile:

But I haven’t tested it.

This topic was automatically closed after 70 days. New replies are no longer allowed.