Fragments displayed over each other

Question

I've got an Activity with a DrawerLayout, using the guidelines from http://developer.android.com/training/implementing-navigation/nav-drawer.html.

When I click on an drawerItem, I replace the current view with the new fragment:

Fragment fragment;
Bundle args = new Bundle();    
fragment = new NewsListFragment();
args.putInt("category", position);

// Insert the fragment by replacing any existing fragment
FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction()
                   .replace(R.id.content_frame, fragment)
                   .commit();        
mDrawerList.setItemChecked(position, true);

Now, sometimes the old fragment is not replaced but the new fragment is placed on top of the old one:

http://img15.imageshack.us/img15/3179/1kqj.png

Why is this, and how to solve this problem?

Relevant XML:

<!-- The main content view -->
<LinearLayout 
    android:id="@+id/rlMain"
    android:layout_width="fill_parent"
    android:orientation="vertical"
    android:layout_height="fill_parent">

    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" 
        android:layout_weight="1">
    </FrameLayout>

This only happens sometimes, and I haven't found a flow to reproduce this yet. The app doesn't support rotating, so it won't happen there.

Answer 1

We went live with this version and havent received any complaints about this, so I will assume this was the correct answer:

in your onCreateView method add:

if (container != null) {     container.removeAllViews(); } 

Be sure to check if container is not null!

Thanks https://stackoverflow.com/users/2677588/lia-pronina!

Answer 2

After about 1 week, I found the solution without adding background color or anything else. Just add this code and fix that bullshit. I hope it will help all of you.

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    container.clearDisappearingChildren();
    return inflater.inflate(R.layout.fragment, container, false);
}