Add and replace one fragment with another on button click

Question

I have two fragments, WishlistFragment and GoShoppingFragment and a button "Continue Shopping". On button click i want WishlistFragment replaced with GoShoppingFragment.

This is implementation of onClick.

public void onClickShopNow() {
    FragmentManager fragmentManager = getFragmentManager();
    Fragment fragment = new GoShoppingFragment();
    fragmentManager
            .beginTransaction()
            .replace(R.id.container, fragment)
            .addToBackStack(null)
            .commit();
    if(fragmentManager.getBackStackEntryCount() > 0) {
        fragmentManager.popBackStackImmediate();
    }
}

Issue here is, when I click on button "Continue shopping" then WishlistFragment gets relaced GoShoppingFragment but I get output like this . WishlistFragment remains in the background. How do I solve this issue?

GoShopping layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ui.store.goshopping.GoShoppingFragment">
<android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/swipe_refresh_go_shopping"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="gone">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_go_shopping"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</android.support.v4.widget.SwipeRefreshLayout>
<ProgressBar
    android:id="@+id/progress_bar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:visibility="visible" />
<LinearLayout
    android:id="@+id/moreLoading"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_alignParentBottom="true"
    android:background="@color/transparent"
    android:gravity="center"
    android:orientation="horizontal"
    android:visibility="gone">
    <ProgressBar
        android:id="@+id/moreLoadingIndicator"
        style="?android:attr/progressBarStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginStart="10dp"
        android:text="@string/label_loading_more" />
</LinearLayout></RelativeLayout>

Wishlist layout:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/container"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="io.launchbyte.appio.ui.store.mywishlist.MyWishlistFragment">

<LinearLayout
    android:id="@+id/layout_continue_shopping"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:orientation="vertical"
    android:visibility="gone">

    <TextView
        android:id="@+id/txt_wishlist_empty"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="8dp"
        android:text="@string/wishlist_empty" />

    <TextView
        android:id="@+id/txt_wishlist_add_items"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="8dp"
        android:text="@string/wishlist_add_items" />

    <Button
        android:id="@+id/button_continue_shopping"
        android:layout_width="150dp"
        android:layout_height="48dp"
        android:layout_gravity="center"
        android:layout_marginTop="24dp"
        android:background="@drawable/primary_color_button_selector"
        android:text="@string/continue_shopping" />
</LinearLayout>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_my_wishlist"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fadeScrollbars="true"
        android:visibility="gone" />

    <ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:visibility="visible" />
</RelativeLayout></FrameLayout>

Answer 1

设置片段的背景，并在每个片段xml中设置setClickable（true）。

Answer 2

在父级布局中将背景色设置为白色可解决此问题。

Answer 3

Remove this :

if(fragmentManager.getBackStackEntryCount() > 0) {
    fragmentManager.popBackStackImmediate();
}

Also in your GoShopping layout: in root tag add:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:background="?android:attr/windowBackground"
tools:context=".ui.store.goshopping.GoShoppingFragment">

Answer 4

public void onClickShopNow() {

    FragmentManager fragmentManager = getFragmentManager();

    Fragment fragment = new GoShoppingFragment();
    Fragment WishlistFragment = 
    fragmentManager.getFragmentByTag("TagName");

    fragmentManager
            .beginTransaction()
            .remove(WishlistFragment)
            .commit();

    fragmentManager
            .beginTransaction()
            .add(R.id.container, fragment,"TagHere")
            .commit();

}

I hope this help you..