I have successfully created a way to navigate properly on my mobile app from page to page (group to group).
However, each page uses the same scroll, resulting in the entire page scrolling when a user only desires to scroll on one page.
Example:
Page 1 is 1000px
Page 2 is 1000px
If I’m on Page 1 and I scroll down 500px from the top, then jump over to Page 2, I will also be 500px from the top EVEN THOUGH I never scrolled on Page 2.
So my question: is there a way to separate the scrolling from page to page?
It’s because you’re technically on the same page location and just showing & hiding groups from wherever you are. To scroll back to the top though use the “scroll to” element action for every “page” navigation. If you select the page itself (e.g. index) as the element to scroll to, it’ll shoot to the top. Try it out.
@romanmg’s solution is the way to do this. Every time a User clicks anything which changes which group is shown, insert an action that scrolls to ‘index’. This will bring them back to the top each time.
It doesn’t have to go to the top every time, only at the times you would like it to. If you’re viewing Group 1 (scrolled down at 500px) and then need to change to Group 2 (scroll to 200px), the actions are:
“When next page is clicked”:
Actions:
1.set state: Group 2
2. scroll to [element within group 2 at 200px].
It’s flexible to where you need it to scroll. You would just select index if you need it to go to the top.
I see exactly what you’re saying. If you look at your Twitter App or Facebook App, each tab has it’s own scroll. So whatever happens on Tab 1 has no affect on any of the other tabs. I’m just wondering if anyone’s figured out how to get that? I’m guessing not.
Ohhh my apologies - I think I see the difference now. What if before changing pages, you stored the scroll position into a custom state on the group? Each group has a custom state for “scroll position” type: number, list: no?
I haven’t done it before but I don’t see why not as long as each group has its own scrolling position custom state - There may be other ways of course but let me know if you need any help setting them up.
@emmanuel would it be possible to allow us to input a number when using the ‘scroll to’ action to scroll to a position on the page (in pixels), instead of scrolling to an element? The use case is for mobile apps, and storing a ‘Scroll Position’ on each Group.
For example, a User is viewing their newsfeed in Newsfeed Group and scrolls far down to the bottom of the page. Then they click to view another User’s profile; the workflow that occurs is:
“When View Profile is clicked” -->
Current page scrolling position is stored as the value in Newsfeed Group’s Scrolling Position’s custom state
Newsfeed Group is hidden
Profile Group is visible (the page is scrolled to the top)
The User then wants to go back to their Newsfeed Group and it scrolls to the position that was stored in the custom state right before navigating to Profile Group. If not, totally understand. Thank you!
Not 100% sure what the issue is (I can check links from this thread via desktop later)
What I can say though: if your repeating groups are set to be visible or not, under different conditions, then yes, by scrolling one group; you may be subsequently scrolling the group behind it as well…
A way to get around this is to re think your hide/show UX - if a group(repeating) is truly hidden, it will not change scroll position.
Also you can do a “scroll to” custom state.
I am using one as well via a repeating group.
You will have to think of a workflow that saves the custom state though (like a user clicking one of the cells).
Then you can have a conditional workflow that says "when group 1 is visible and (elements)scroll to is not empty > scroll to …
(Or however you want the scroll to function)
The custom state type - will be the same data type of the content that is in your repeating group.
Newsfeed was probably a bad example since that would be a repeating group, and we could use scroll to entry. I think @dbevan is trying to accomplish this: a User opens the app and scrolls down Group 1 (which may only contain text elements and images), navigates to view Group 2, then goes back to Group 1 - there isn’t a way to store and scroll to the position on the page were they left off in Group 1 (Since there’s no entry inside of a repeating group to scroll to).
I don’t think this will work. Because the ‘scroll to’ action will only scroll to elements, not specific numbers.