Created on 29 November 2018
icon_unfollowing
Login to follow
bottombarstacknavigation

BottomBarStackNavigation

Stable version 1.1.1 (Compatible with OutSystems 11)
Uploaded on 10 December 2018 by 
bottombarstacknavigation

BottomBarStackNavigation

Details
Using the BottomBar, ever wish each BottomBar Item (Tab) could remember their previous location (Screen and Scroll location)? This application includes a Sample module that uses some Utility Client Actions that can be used to enable this "Stack Navigation" across BottomBar Items (Tabs), allowing each Tab to remember the last screen and scroll amount.
Read more

Using the BottomBar, ever wish each BottomBar Item (Tab) could remember their previous location (Screen and Scroll location)? 

This application includes a Sample module that uses some Utility Client Actions that can be used to enable this "Stack Navigation" across BottomBar Items (Tabs), allowing each Tab to remember the last screen and scroll amount: 

  • SwitchTab Client Action 
    • Stores the current location (Screen and ScrollTop) for the Tab we are leaving, then returns the Screen name it needs to navigate to for the new destination Tab (based on the last Screen that was viewed on the Tab).
  • GoScrollInit Client Action
    • Scrolls the current Screen to the stored ScrollTop location when it was last viewed.

I tried to make this as simple as possible: 

  1. For each ButtonBar Tab, call the SwitchTab Action within LinkOnClickXXX 
    • Pass in a unique Tab name for each BottomBar Tab
  2. Use a Switch that checks the SwitchTab.Screen output and create a condition for all possibilities to the appropriate Screen Destination. 
    • (Use Otherwise to go to the initial/default screen) 
    • TEST HERE to make sure each BottomBar Tab remembers the last screen it was on! 
    • If Tabs are not remembering the last screen it was on (goes to the default screen), then you are most likely not using the correct Screen Name for the Switch Condition OR the Switch Condition for the Screen does not exist. 
    • Use a Breakpoint on the Switch and see what SwitchTab.Screen is - make sure you have a Switch Condition for all the possible Screen names it returns. 
    • You can also use the GetPageName Client Action on each page to see what it would return. 
  3. For each (navigatable) Screen from all the BottomBar Tabs, call GoScrollInit Action within OnRender.  No parameters needed! 
    • If the Scrolling isn't working, then you might have to set the optional SelectorOverride input parameter for the Screen after finding which Selector is being used to scroll (instead of the default .content class) on that Screen (See Known Limitations below)

NOTES

  • Even if a BottomBar Tab links to only 1 Screen:
    • Calling SwitchTab (without the Switch statement) and going to the (one) Destination is required for it to remember the Screen name and Scroll location on that screen before it navigates away.
    • Calling GoScrollInit is required for the (one) Screen to be able to scroll to the previous Scroll location when navigated to.
  • Running it on a device (i.e. OutSystemsNow) shows the GoScrollInit scrolling to be instantaneous as opposed to in the Simulator where it is much slower.
  • The Utility module will add 1 AO (1 Local Storage Entity) to your project - there are no Screens and no external integrations involved.

Known Limitations

  • If using SelectorOverride, the current design requires modifying the internals of SwitchTab to call StoreCurrTabScreen with the specific SelectorOverride depending on the Tab that you are leaving (GetCurrTab.Tab) so that it can retrieve and store the correct ScrollTop for the current Screen.  This might make sense to be placed in Local Storage for retrieval with the (last used) Screen Name for each Tab.

Here is a related Ideas entry for this workaround:

https://www.outsystems.com/ideas/5996/bottombar-that-behaves-like-tabs-stacknavigation-for-all-screens-in-each-tab


Release notes (1.1.1)

Changed icon to differentiate between this and TabStackNavigation

Reviews (0)
Category
User interface, Navigation
Tags
Support options
This asset is not supported by OutSystems. You may use the discussion forums to leave suggestions or obtain best-effort support from the community, including from  who created this asset.
Dependencies
See all 2 dependencies
Application Objects
BottomBarStackNavigation has 14 AOs.
Team
Compatible with
Version 11
Database:
All
Asset consumers
No consumers yet.
Weekly downloads