title: How to push a full-screen page that stays on top of Flutter BottomNavigationBar
body: <p>I searched everywhere and could not come up with an answer.</p>
  
  <p>I have a <code>BottomNavigationBar</code> and a <code>FloatingActionButton</code>.</p>
  
  <p>What I am trying to do is pushing a full screen page when the user presses the <code>FloatingActionButton</code>.</p>
  
  <p>This page needs to cover the area of the <code>BottomNavigationBar</code> and previous <code>AppBar</code> since in this new page user is not allowed to go to the other tabs of the <code>BottomNavigationBar</code>.</p>
  
  <p>I came across <a href="https://docs.flutter.io/flutter/widgets/PageRoute/fullscreenDialog.html" rel="noreferrer"><code>fullscreenDialog</code></a>, a property of <code>PageRoute</code> Widget class and got excited but could not get it to exactly work as I wanted it to work(top&lt;->bottom as I will explain later)</p>
  
  <p>This page will have it's own <code>Scaffold</code> and <code>AppBar</code> and is able to push/pop to next screens(inside of it's own navigation tree)</p>
  
  <p>In order to pop this page, the user will press a 'x' button positioned at bottom center of the page.</p>
  
  <p>I want to push/pop this new Page from top&lt;->bottom instead of the usual navigation style which is left&lt;->right (For iOS/Cupertino)</p>
  
  <p>I am familiar with this type of UI from iOS devices(<code>ModalViewController</code>)</p>
  
  <p>So How would we implement the push and pop commands?</p>
  
  <p>Or is there another, better/recommended way to do this?</p>