Pages overlap when i did migration

Question

I used bottom navigation bar. Bottom navigation bar is running but have a problem. 2 pages overlap when it running.

Codes and image are below.

binding.bottomNavigationBar.setOnItemSelectedListener(item->{
        switch (item.getItemId()){
            case R.id.anasayfaFragment:
                replaceFragment(new AnasayfaFragment());
                break;
            case R.id.aramaFragment:
                replaceFragment(new AramaFragment());
                break;
            case R.id.kategoriFragment:
                replaceFragment(new KategoriFragment());
                break;
            case R.id.profilFragment:
                replaceFragment(new ProfilFragment());
                break;
            case R.id.kampanyaFragment:
                replaceFragment(new KampanyaFragment());
                break;
        }
        return true;
    });

    return binding.getRoot();
}
private void replaceFragment(Fragment fragment){
    FragmentManager fragmentManager = getActivity().getSupportFragmentManager();
    FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
    fragmentTransaction.replace(R.id.frameLayout,fragment);
    fragmentTransaction.commit();
}
enter image description here

[image link]https://drive.google.com/file/d/1ZNrTqQ67Tp1sNe6h7ID9nPP7bCTU7DeI/view?usp=sharing i expecting conflict-free page transfer when i to create bottom navigation bar.