How can my BottomNavigationBar float above hero widgets during page transitions? - flutter

I want my NavigationBar to float above my Images during page transitions. These images are marked as hero widgets so they expand and get placed at the top of the "details" page, but during the page transition the bottom ones clip with the NavBar, since the NavBar is not persistent in my case and hero widgets are supposed to float above the previous' page widgets.
I know an easy fix would be to also include a NavBar on the next page and mark both as Hero widgets aswell, but I don't want/need the Bar on the details page.
Is there another way to fix that?
Initial state
User pressed bottom image (partly behind the NavBar), it clips through the navigation bar
The image further expands

Related

How do I create a button with animation in the center of the bottom navigation in Flutter?

enter image description here
I want to use this animation for Bottom Navigation on Flutter, but I don't know what to do.
There are a total of 5 tabs including the button with that animation applied.
Animation button is centered.
Help me, masters.
Floating buttons should not be used...

DraggableScrollableSheet at the bottom of the page not screen

I would like to create an effect similar to DraggableScrollableSheet but instead of it being attached to the bottom of the phone, it is at the end of a scrollable page.
So the user scrolls to the end of the page and finds this sheet, which they can drag up and then scroll through.

Custom flutter navigation?

I am using CupertinoPageRoute for their navigation animation and I want to customize it a bit. Page
I am going to(Page2) will slide from right and when I pop that page(Go back to Page1) it will slide in opposite direction(from left) that's default. I want my pop to slide in the same direction (from right). Like PageView but I'm navigating only between two pages. Green arrow show's direction I want.
Is there a way?
I tried building my custom navigation animation with PageRouteBuilder but could not do anything useful I don't want to push page1 on top of page2.
You can use package https://pub.dev/packages/page_transition for page transition in any direction you want

How to hide material bottom app bar on scroll but the fab stays

I have a material bottom app bar widget with a fab search button attached to it in the center. I want it to scroll down (the fab stays) when I scroll the screen.
I want to implement this scrolling behavior.
https://material.io/design/components/app-bars-bottom.html#behavior

Push Pop Press style Scrolling

I am working on a app that requires scrolling implemented in Our Choice iPad app from Push Pop Press.
Has anyone implemented the nested scrolling like that?
Updated:
There are two scroll views, one on top with paging and another at the bottom. The top one specifies the Chapters and bottom one corresponds to the pages in the chapter.
So when you swipe to next page of top scroller the bottom one moves accordingly to show it pages. And you can scroll bottom scrollview to view the pages on it. Also when you are at the last few pages of the bottom scroll view and try to scroll then it changes the page at the top scroll view and update the bottom scroll view as well.
Here is the demo video of the app
http://vimeo.com/22872218