title: Flutter "complex" UI design for Dragable Container over another Container
body: <p>I'm trying to solve a <code>UI</code> problem of an <strong>idea</strong> I had with <code>flutter</code>, but I have no clue on how to do it.</p>
  <p>Basically, I am imagining a kind of container that covers half of the screen and that can be dragged up, so cover the information that is behind in order to show more of the information that this dragable container hides, something like the illustration below.</p>
  <p><a href="https://i.stack.imgur.com/Ir4eR.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Ir4eR.png" alt="enter image description here" /></a></p>
  <p>I had tried using <strong>showModalBottomSheet</strong>, as indicated <a href="https://stackoverflow.com/questions/57233622/flutter-draggablescrollablesheet-not-showing-up-on-press-of-a-button/57233707#57233707">here</a>, solution but it does not meet the requirements of my idea, mainly because it does not remain visible in a portion of the screen, and also as it starts from the bottom of the screen it hides the icons of the menu bar, plus because it is a modal completely darken the container that is below it which does not look very good, it should only give the illusion that it is a little above it.</p>
  <p>It does not necessarily have to cover all the content of the container below it can go up to a limit, I know it is an open problem but I have no clue on how to get this idea in flutter since I have little experience, I would appreciate if someone could give me some point how address this problem.</p>