How to use a custom asset image as a navigation bar in flutter

Question

how to use an image that I design and use it as the navigation UI image Design bar in my flutter project?

i would like to put this image as shown about at the bottom of the screen where the bottom nav bar should be

but the problem is it has a white space around it, I have search for something similar with other questions that has been answered but haven't seen a solution for this.

import 'package:flutter/material.dart';

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage(
              "assets/images/bg.png",
            ),
            fit: BoxFit.cover,
          ),
        ),
        child: Center(
          child: Column(
            children: [
              Padding(
                padding: const EdgeInsets.only(top: 250),
                child: Container(
                  height: 200,
                  width: 200,
                  decoration: const BoxDecoration(
                    image: DecorationImage(
                      image: AssetImage(
                        "assets/images/logo.png",
                      ),
                    ),
                  ),
                ),
              ),
              Expanded(
                child: IconButton(
                  icon: Image.asset('assets/images/google_signin.png'),
                  iconSize: 200,
                  onPressed: () {},
                ),
              ),
              Image(image: Image.asset('assets/images/bottom_bar'),
              position: Bottom)
            ],
          ),
        ),
      ),
    );
  }
}