Navigation between records - possible?

Ok, I made a copy and I’m playing with it. I guess tiles won’t work side by side since they are separate lists. If you change the relations to multiple, that allows you to use an inline list, which gives you the caption option. Unfortunately inline lists have a horizontal line between list items, so it kind of looks bad. I wish we could turn that line on or off. Here’s a couple examples of what I’m thinking. This is after selecting Multiple in the relation. The Previous button is an Inline List with Title, Detail, and Caption filled. The Next button is an inline list in compact view.

image

@Jeff_Hager - I know this is an older post - but did something today that made me think of this … thought you may want to see something similar I did (on a much SMALLER scale)

In this app, on the front page … scroll all the way down to the bottom

You may remember (see below) that The front page is always ZERO day, so yesterday is -1 and tomorrow is +1

So I did a tiles and filtered all days OUT but -1 and +1

So it gives me two little navigation buttons to go backward and forward ONE day.
(In this particular app, I do not want the user to go more than one day back and forward, so that is where I stopped the buttons.)

and it sorta goes along with our discussion on this post

1 Like

Hmm, that gets my wheels turning. I’m trying to think of a way to apply this method to any list. Maybe two columns set up as an array column with one column showing the prior record id, the second column showing the next record id. Then creating a relation off of that array column. Not very far off from what we set up with before. Just a single relation instead of two. I may have to try to come up with a demo in the concepts app.

1 Like

Hi Jeff - Curious if you made any progress on this. I’m trying to build the same sort of thing - including a “next” button when looking at one item from a list so that you can go to the next item in the list, without having to navigate back to the full list.

Yes, I have a Paging example in https://concepts.glideapp.io/.

1 Like

Thanks Jeff! This is really good. Much appreciated - and I’ll check out what else you have in the concepts app…

One follow-up question: Clicking on the tiles basically “drills into” the app each time you use a button to go to the next list item. Which means going back to the full list (when done) requires you to press on “back” a large number of times. Did you design another way to get back into the main app functionality?

@mattbrowning - Do you do navigation between items in a list the same way, or do you have another way to do it?

Yeah, I think the paging works best if you have tabs showing in the app. You can just double tap on a tab to get back to the top level.

Do you think that you use this method to show “previous” and “next” instead of the item names. The “previous” and “next” could appear as images in place of the background image, or as text on some type of background.

This is great work guys, :+1:t4: going to add this as a technique in docs.

1 Like

I don’t know of a way to show previous or next. Both button tiles are pointing to the same columns to get the text or images, and there isn’t a way to tell an inline list to use one set of column values for the “previous” and a second set of columns for the “next”. If you have any ideas, feel free to let me know.

I’m currently working on an app for my family reunion this summer. I’ve built in a photo gallery with previous/next buttons, but instead of text, I just show the previous and next image in the tile “buttons”. It’s a little more hacked together, because I also have faked out first and last rows with just a white image and that gives all components when you get to the beginning it end of the gallery. I also am creating a relation from the record to itself to show the main image in a tile instead of an image component. This is so all issues have a consistent width and height be screen. This makes it easier to page without having to scroll. The buttons are always in the same position on the screen. Maybe at some point I’ll throw together a more advanced photo gallery / paging example in Concepts.

Thanks for the help Jeff. With your help, I was able to meet the client’s expectations.

The app I’m building now has 2 buttons (previous, next) with generic names (“previous exercise”, “next exercise”), as well as a way to have the next button cycle from the last item cycle back to the first item. Also, I added a button that says “Workout complete” with conditional formatting so that it only appears for the final item in the list.

I’ll include screenshots later today.

1 Like

@matt Here’s a copy of the app I’m working on. It pretty rough at the moment, but if you look at the memories tab you can see what I’m doing with the buttons. It’s a photo gallery with buttons that show the previous and next image. I’m not cycling from last to first in mine. Instead I have an empty First and Last page so the tile buttons stay in their respective places once I hit the end of the gallery. I’m also displaying everything in reverse order so the logic is a bit backwards.

Curious how you did the Previous and Next text. Are you using a Tile list like me or using separate buttons?

rwtsk.glideapp.io

I’m adding this to feature requests. I’ve wanted paging, too. I see it working in the details view for any inline list. Just a “simple” previous/next button to navigate to the detail view of the previous/next row in the table.

1 Like

Hey Gliders. This is what I was able to do to navigate from one detail screen of a list to another detail screen without needing to go back to the list, as well as have a “workout complete” button.

The list that I wanted to click through is a set of 10 exercises. The detail screen for each exercise has a diagram of how the exercise is done, the sets/reps, and a description of the exercise. I didn’t want the buttons to show the name of the next exercise, instead opting to just show “next exercise” in the button. I also wanted to add a “workout complete” button that only appears at the final exercise of the list.

To have the button show “Next Exercise” instead of the exercise name, I just added a column with the text that I wanted to display for each exercise. The key data elements in my table are the current exercise name, the text of the next button, and the exercise that will be displayed with the next button is selected. See table.

image

I then built the relationship (like Jeff) which links one row of a table to the next row. I then added an inline list (again, like Jeff) with tiles and selected the “Title” of button to be the “Next Text” data field (instead of the exercise name). I preferred no background image for my buttons and de-selected the option to “show title when image is not available”. This created a standard, but somewhat boring, button on each detail screen.

For the final exercise, I included the text of “Done” (which didn’t match any values in the exercise name column), which prevented the next button from appearing at all for the final exercise. However, the final task needed to display a “workout complete” button, which I solved by adding a button component with a visibility condition to show the component when the Next Exercise value is “Done”.

The downside to this solution is that the next exercise button and workout complete buttons have different fonts, colors, etc., but it met the functionality requirements.

Some screenshots…
image

Jeff - many thanks for your model. Couldn’t have built this without it.

LMK if anything didn’t make sense…

8 Likes

Well done, @matt. Bookmarking this for later.

1 Like

I think this would make a lot of things simpler with the newly launched increment action.

1 Like

Is it possible to go to next rows or previous rows with swipe left or swipe right in detail view?

1 Like

You can use buttons with increment action for it.

2 Likes

Thank you very much I am going to learn from it.

1 Like