[Example] Add bottom_navigation_complex

[NeroThroN]

⚠️ This example still contains lots of bugs ⚠️

Description

Add a complete and complex example using multiples Beamers with deep and root pages.

Issue tracker:

• Bottom Navigation Bar: Only after the second click on an item the routeListener is trigger
• Route conflict : When going from a BeamPage (A) to a sibling (B), if we push again the first (A), the second (B) is removed from history. Like a popUntil and not a push.
• Back button : After opening /Books/1, /Books/2, /Books/3 (screens inside Layout), when using android back button the history is updated but not the application's screen.
• AppBar leading pop page: When navigating to the route /Book/:bookID, when using the default back button inside the AppBar, the route is updating to /Book. The correct behavior for this can be trigger by the back button on the web browser . In this example the /Book page doesn't exist, only the /Book/:bookID one (Maybe a redirect to the initial path when navigating to /Book ?)
• Route not found: When navigating to /Book/:bookID, unable to open /Books/:bookID (the nested in layout one) via push or pop (if the page was open before)
• Deeplink: Going from /Books to /Articles/1 lead to NotFound page.

Bonus:

• Exit app only on the initial route: Exit the app only on the /Books route. If we are in the /Articles, when poping this route should navigate in /Books where the app can now be poped.

Pages structure

[slovnicki]

Hey @NeroThroN 👋
Sorry for the delay, but I finally had the time to take a look at this.

Very cool! 💙

As we talked on Discord, this is a great addition to the examples and I really like it.
Tomorrow evening I'll try to advise you on some easier issues you provided (although all of them are tough and very specific 🙂)

I hope we merge this by the end of the week 💪

Thanks again and sorry for late response 😞

[IlyaMax]

@NeroThroN Hello, your example is very good, but there are some cases which I think should be included also. Pls read this issue #542 . I don't find in this example how can I reach deep link destination. For instance this "/Articles/1".

[dleurs]

@NeroThroN Thank you very much for this example ! It was exactly what I was looking for. It seems flutter's favorite go_router cannot provide such functionnalities with bottom nav bar. Hope bugs will be solved

[rivella50]

@dleurs And go_router still is not capable of providing multiple navigation stacks.

[dleurs]

On real device Android 10 Honor 10 --profile --trace-skia , I am having heavy performance issues, with a lot of janks

[slovnicki]

Hey guys!

As I spoke with @NeroThroN, I'm working on a new feature called "Route Structure" which should help in building complex scenarios like this one. Current draft PR is here, but needs more work until I merge it.

I'm also on a vacation so things are massively slowed down these weeks.

[slovnicki]

Hey @NeroThroN 👋
Long time no see. I'm getting healthier and having a bit more time so I checked this again.

Deeplink: Going from /Books to /Articles/1 lead to NotFound page.

The correct action is already implemented for onLongPress (it should also be the action for onTap):

onLongPress: () => Beamer.of(context).root.beamToNamed('/Article/${article.id}'),
// or onLongPress: () => Beamer.of(context, root: true).beamToNamed('/Article/${article.id}'),

We have to take the root Beamer here because we're inside booksRouterDelegate so context.beamToNamed will try to use that router, which has no knowledge of articles.

Route conflict : When going from a BeamPage (A) to a sibling (B), if we push again the first (A), the second (B) is removed from history. Like a popUntil and not a push.

Can you describe this one in terms of exact routes in the app? I have a vague idea of what you're talking about, but am unsure how to reproduce this exactly in the app.

Exit app only on the initial route: Exit the app only on the /Books route. If we are in the /Articles, when poping this route should navigate in /Books where the app can now be poped.

A general note regarding this (presuming it's about the Android back button); Overall behavior should be better if BeamerBackButtonDispatcher is put only on MaterialApp.router and removed from nested Beamers. I believe that the default behavior should be /Articles -> /Books -> exit if we didn't deep link to /Articles, but this could also also be tweaked further.

[pishguy]

@NeroThroN

Is this example relevant to the problem that I have encountered? Please check the link below.

#631

[stan-at-work]

Are there updates on this ?