How to make bottomBar back ground transparent and make the extends body to true

I have the below BottomBarNavigation as the image one:

So what I need just to make the back ground color to transparent and the extends to the body..

Here’s my code:

import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

class IPetHomeScreen extends StatefulWidget {
  @override
  _IPetHomeScreenState createState() => _IPetHomeScreenState();
}

class _IPetHomeScreenState extends State<IPetHomeScreen>
    with SingleTickerProviderStateMixin {
  TabController _tabController;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _tabController = TabController(length: 5, vsync: this);
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    _tabController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: TabBarView(
        children: [
          Container(
            color: Colors.white,
          ),
          Container(
            color: Colors.green,
          ),
          Container(
            color: Colors.green,
          ),
          Container(
            color: Colors.green,
          ),
          Container(
            color: Colors.green,
          ),
        ],
        controller: _tabController,
      ),
      bottomNavigationBar: Padding(
        padding: const EdgeInsets.all(16.0),
        child: ClipRRect(
          borderRadius: BorderRadius.all(
            Radius.circular(50.0),
          ),
          child: Container(
            color: Colors.black54,
            width: 0.0,
            child: TabBar(
              labelStyle: TextStyle(
                fontSize: 10.0,
              ),
              labelColor: Colors.white,
              unselectedLabelColor: Colors.grey,
              indicatorColor: Colors.black54,
              tabs: [
                Tab(
                  icon: Icon(
                    FontAwesomeIcons.paw,
                    size: 24.0,
                  ),
                ),
                Tab(
                  icon: Icon(
                    FontAwesomeIcons.filter,
                    size: 24.0,
                  ),
                ),
                Tab(
                  icon: Icon(
                    FontAwesomeIcons.heart,
                    size: 24.0,
                  ),
                ),
                Tab(
                  icon: Icon(
                    FontAwesomeIcons.shoppingBasket,
                    size: 24.0,
                  ),
                ),
                Tab(
                  icon: Icon(
                    FontAwesomeIcons.userAlt,
                    size: 24.0,
                  ),
                ),
              ],
              controller: _tabController,
            ),
          ),
        ),
      ),
    );
  }
}

Scaffold(
  body: Stack(
    children: [
      TabBarView(
        children: [
          Container(color: Colors.red),
          Container(color: Colors.green),
          Container(color: Colors.blue),
        ],
        controller: _tabController,
      ),
      Align(
        alignment: Alignment.bottomCenter,
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: ClipRRect(
            borderRadius: BorderRadius.circular(50),
            child: Container(
              color: Colors.black54,
              child: TabBar(
                tabs: [
                  Tab(icon: Icon(Icons.home)),
                  Tab(icon: Icon(Icons.business)),
                  Tab(icon: Icon(Icons.school)),
                ],
                controller: _tabController,
              ),
            ),
          ),
        ),
      ),
    ],
  ),
)