TabBar with bottom sheet - flutter

Question

I am making Flutter app i which I want to design bottom sheet with TabBar view as below design.
I have seen option for bottom sheet in Scafold() but onlz tabs are visible. I dont know how to animate it as the above.
My code so far is as below
class MainScreen extends StatefulWidget {
static final String id = 'MainScreen';
const MainScreen({Key? key}) : super(key: key);
#override
_MainScreenState createState() => _MainScreenState();
}
class _MainScreenState extends State<MainScreen> with SingleTickerProviderStateMixin {
TabController? _tabController;
bool isNull = false;
#override
void initState() {
super.initState();
_tabController = TabController(length: 4, vsync: this, initialIndex: 2);
_tabController!.addListener(_tabChanged);
}
void _tabChanged() {
if (_tabController!.indexIsChanging) {
print('tabChanged: ${_tabController!.index}');
}
}
#override
void dispose() {
_tabController!.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: TabBarView(
controller: _tabController,
children: [
HomePage(),
PersonalData(),
LoginPage(),
RegistrationPage()
],
)
),
bottomSheet: SafeArea(
child: TabBar(
controller: _tabController,
labelColor: color,
indicatorColor: Colors.black,
unselectedLabelColor: Colors.black,
tabs: [
const Tab(
icon: Icon(
Icons.home_outlined,
//color: Colors.white,
),
),
const Tab(
icon: Icon(
Icons.shopping_cart_outlined,
//color: Colors.white,
),
),
const Tab(
icon: Icon(
Icons.favorite_border,
//color: Colors.white,
),
),
const Tab(
icon: Icon(
Icons.send,
//color: Colors.white,
),
)
],
)
),
);
}
}
AnyOne has some idea how to do it?? If there is some package to use for this bottom sheet behaviour ??