Question

I’m trying to replace a fragment in a composite layout. Here’s my root layout XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <fragment
        android:id="@+id/buttons"
        android:name="com.kippygo.android.touch_talker.ButtonsFragment"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        class="com.kippygo.android.touch_talker.ButtonsFragment" >
        <!-- Preview: layout=@layout/buttons_fragment -->
    </fragment>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <fragment
        android:id="@+id/buffer"
        android:name="com.kippygo.android.touch_talker.BufferFragment"
        android:layout_width="match_parent"
        android:layout_height="80dp" >

        <!-- Preview: layout=@layout/buffer_fragment -->
    </fragment>

    <FrameLayout
        android:id="@+id/grid_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="?android:attr/detailsElementBackground" >

    </FrameLayout>

</LinearLayout> 

</LinearLayout>

As you can see, I have three areas in my layout, a fixed left column containing a fragment with buttons the rest of the layout is divided vertically with a fragment managing a textView at the top and a grid of data in the lower section.

I want to use a common layout to place various GridView elements in the “grid_frame” as I press buttons in the “buttons” fragment. Here is the “grid_fragment” layout that I want to use for each GridView fragment:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/grid_fragment_layout"
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical">

<GridView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/grid_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnWidth="80dp"
    android:clipToPadding="true"
    android:gravity="center"
    android:horizontalSpacing="20dp"
    android:numColumns="auto_fit"
    android:orientation="vertical"
    android:stretchMode="columnWidth"
    android:verticalSpacing="20dp" >
    <!-- Preview: listitem=@android:layout/simple_list_item_2 -->
</GridView>

<TextView
    android:id="@+id/android:empty"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:textSize="22sp"
    android:textStyle="bold"
    android:text="@string/no_list_items"/>

</LinearLayout>

This composite layout opens up fine when I start my app. and I set my first fragment in the FrameLayout id “grid_frame” in my initial activity with the following code:

    // Execute a transaction to put the categoriesFragment in the grid_view
    FragmentTransaction ft = getFragmentManager().beginTransaction();
    ft.replace(R.id.grid_frame, new CategoriesFragment(), "category_fragment");
    ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
    ft.commit();

This works perfectly fine and I see my buttons on the left, text input box on top and a grid of nicely filled cells to the right of the buttons.

When I click one of the list items in the GridView presented by the dynamic fragment I want to replace the fragment in the “grid_frame” FrameLayout. I do this with the following code in the onItemClick listener method of the “grid_frame” fragment with the following code:

    // Execute a transaction to put the categoriesFragment in the grid_view
    FragmentTransaction ft = getFragmentManager().beginTransaction();
    ft.replace(R.id.grid_frame, categoryWordsFragment, "category_words_fragment");
    ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
    ft.commit();

Which looks remarkably similar to the code I used in the activity to set the initial fragment which worked fine.

When I do this my entire screen is replaced with the new fragment layout, which is another GridView with different data. My root layout appears to be totally replaced with the layout that was inflated by the new fragment even though I specify the “grid_frame” FrameLayout as the container view id in the replace method call.

I have tried everything I can find to make my layout stay intact and just change the fragment in the FrameLayout container.

What am I doing wrong please?

Answer 1

Problem solved! It was a very stupid mistake. I had converted my Activity classes to Fragment classes and in this one class I had forgotten to remove the call to setContentView in the class onCreate method. So the fragment was setting a new layout each time I created a new instance