I know that this has been asked before, but I can't seem to achieve quite what I want with the answers I have found.
What I'm trying to do is use a TabBar and TabView inside of a Scrollable view of some kind, below other widgets. I don't have any preference for which type of scrollable view, as long as it works.
I have two working solutions, but both are unsatisfactory to me. The first I was able to come across on my own through experimentation. I use a ListView
, inside of which is the other widgets, followed by the TabBar
. I use the TabBar
and a controller to drive an AnimatedSwitcher
, which gives the appearance of switching tabs, but I get a jerky effect if the page is scrolled, since the tabs are different sizes. You can see the effect here:
I've also tried using NestedScrollView
to try and achieve this goal, however I end up with way more space on bottom than I would like, and I haven't been able to find how to remove that unused whitespace. Effect shown here:
I adapted the NestedScrollView solution from this question here. I also looked at all of the questions referenced in that one, trying to find some solution, but so far no luck.
The code for each of these solutions can be found in this gist.
What I'm looking for is a way to allow both to be completely scrolled on screen, without any unnecessary whitespace on the bottom of the taller tab. I know that I'll likely have the whitespace below the shorter tab, but that's alright.