How to hide bottomnavigationbar when miniplayer at max height

[toklive]

I saw this comment for this property... but not sure how to use it ? My app is using Getx

///Allows you to use a global ValueNotifier with the current progress. ///This can be used to hide the BottomNavigationBar. final ValueNotifier? valueNotifier;

I got this error https://stackoverflow.com/questions/68073121/getx-and-hide-bottomnavigation-bar-error-with-stateful-widget-rendering, when I tried to make it work using Getx

[toklive]

@peterscodee it will be great if we get a sample I think since I am using my entire page within MiniplayerWillPopScope() none of the statement options like ValueNotifier, Getx are not working to re-render the bottomnavigation. I saw the above comment in the ValueNotifier code, there will be an easier way to achieve this.. thanks for your help

[dxvid-pts]

Did you have a look at the example? An implementation would be:

bottomNavigationBar: ValueListenableBuilder(
        valueListenable: playerExpandProgress,
        builder: (BuildContext context, double height, Widget? child) {
          final value = percentageFromValueInRange(
              min: playerMinHeight, max: playerMaxHeight, value: height);

          var opacity = 1 - value;
          if (opacity < 0) opacity = 0;
          if (opacity > 1) opacity = 1;

          return SizedBox(
            height:
                kBottomNavigationBarHeight - kBottomNavigationBarHeight * value,
            child: Transform.translate(
              offset: Offset(0.0, kBottomNavigationBarHeight * value * 0.5),
              child: Opacity(opacity: opacity, child: child),
            ),
          );
        },
        child: BottomNavigationBar(
          currentIndex: 0,
          selectedItemColor: Colors.blue,
          items: <BottomNavigationBarItem>[
            BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Feed'),
            BottomNavigationBarItem(
                icon: Icon(Icons.library_books), label: 'Library'),
          ],
        ),
      ),

[toklive]

Thank you so much David. I think I am getting closer now :)...

In my case I have to keep the miniplayer in full height whenever I click on the button... for that I saw that we have to use ValueNotifier...

final ValueNotifier<double> playerExpandProgress =
    ValueNotifier(MediaQuery.of(context).size.height);

I am using the above way. Because of that I think the the example code is hiding the bottomnavigation always by default and whenever I minimize the miniplayer it is making the bottomnavigation bar visible. What is the best way to keep the bottomnavigation visible for this situation. I might be missing some basics. Thanks for your help.

[prateekmedia]

@toklive Don't set default value to full height.

Use

final ValueNotifier<double> playerExpandProgress =
    ValueNotifier(playerMinHeight);

Where playerMinHeight is the minimum height of the player.

[nwatab]

@toklive Does it work as expected? I got an overflow error at the bottom.