How to overide flutter BottomNavigationBar widget with a custom container widget?

I'm using scaffold to use bottom navigation bar. There is a page where i need to change the bottom navigation bar widget into a custom widget like image below on a state changed. How can i do this?

from this

to this

I didn't found how to solve this, so please help and tell me how to do this in flutter/Dart.

You can directly use custom widget in bottomNavigationBar: customWidget() bottomNavigationBar accepts type Widget? so you can create customWidget() as per your need

As per your image reference:

Widget customWidget() {
    return Row(
      children: [
        Expanded(
          child: Text(
            "Select Photo",
            textAlign: TextAlign.center,
          ),
        ),
        Icon(Icons.delete),
      ],
    );
  }