Back to top button possible?

Is it possible to create a “back to top” button maybe with some css magic?

Also, I’ve seen examples and I’ve been helped by some users here (thank you all, you are very useful and competent this IS a great community) with some rich text format code, like the last example that I might use is in the messaging app that @Drearystate and other power users are developing which is just fantastic, that keeps a text input ‘locked’ on the bottom part of the screen and lets the list scroll behind it.

The question is, I think I should just study css (I think it is css I read in other posts or am I confusing?) and it will generally help me or is there a specific branch of it that can be used in glide?

Thx in advance.

2 Likes

I’ve looked into this. I don’t think it’s possible because back to top buttons usually involve JavaScript.

1 Like

It’s possible, and in fact I’ve done it in an app that I’m working on at the moment. Essentially what you do is create an action that momentarily hides all the components. It takes a bit of fiddling to get it right - especially if you have a lot of components on the screen - but it can be done.

You mentioned @Drearystate. I actually got the idea from Joe a few months back, so he gets the credit for it.

2 Likes

Interesting. do you use set columns with timestamps?

I’ve tried a few different ways.
In my Golf app, I do it that way, just setting a USC datetime column to 1 second in the future. It works, but it isn’t instant - so the user experience isn’t great. (I think the minimum resolution might be 5 sec, so how long it takes depends on where in that cycle you tap the button).

In another app I’ve been working on with @Santiago_Perez1, we got it working simply by toggling a user specific boolean off/on within an action sequence. It works great, and it’s instant. I haven’t figured out the exact “secret sauce” yet, but I’m pretty sure it’s tied to the complexity of the action sequence. ie. if you just try and toggle a boolean off/on in a two step sequence it won’t work - the off/on happens too quickly. But if the sequence is sufficiently complex, you can toggle off at the start of the sequence, then toggle back on at the end of the sequence. In our scenario, where it works perfectly, the sequence is:

  • Toggle off (Set Columns)
  • Show Notification
  • Add Row
  • Set Columns
  • Toggle on (Set Columns)
  • Increment

I suspect it’s probably the Add Row in there that injects just enough delay for the toggle off/on to take effect, but I haven’t been able to confirm that.

1 Like

I’ve been on vacation. But thank you sir for throwing credit my way :slight_smile:

1 Like

no… is not working :frowning:
i did all steps … 3 times add row… nothing… i put a button to manually turn off, this is working… but action … NO
any other ideas how to go back to the top?

Did you try the first method, where you set a USC date/time column to 1 second in the future, then hide all components while NOW() is earlier than that time?

That method seems to work more reliably, but there can be a few seconds delay, so as I mentioned above the user experience isn’t great.

1 Like

im trying now, and it works!!! yeaaaa!!!

but it takes more than a second… and is weird … i need to create some distraction for that

Yeah, I think (but am not 100% sure) that Glide only updates the current time about once every 5 seconds. So it could take anywhere between 1-5 seconds to change

yep… is random… i can’t make any reliable distraction. ;-(

what i need is to set up rich text back to beginning, it is a long paragraph… maybe some CSS with template??? will help
i’m replacing rich text in template to have next page of text, but when i do this, next page is at the end or where previous page end, anyone have experience with making an App for a book and turning pages back and forth ? I wanna use rich text, for a nicer fonts and colors.

Now you can do this natively but need two inline lists. Here is the demo

Nice. Does the button just do an increment that toggles between the two identical lists?

That is correct. The tab has to have one inline list for it to work (and its duplicate) on the rest of the tab.