Overlapping fragments in activity

Question

I have been learning android app development for a couple of days using the 'developer.android.com' tutorial. Currently I m learning the concept of fragments and frame-sets. I have written a hello world program using fragments. But the prob is that my fragment layout gets inserted in the fragment container twice and the result is 2 overlapped fragments in the frame-set. Can u please tell me why this happens and what is wrong with my code?

Below is my Home_page.java (the activity which contains the fragment_container)

package com.technology.computer.mit.ctechmit;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;


public class Home_page extends ActionBarActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_home_page);



        // Create a new Fragment to be placed in the activity layout
        Home_pageFragment firstFragment = new Home_pageFragment();
        // In case this activity was started with special instructions from an
        // Intent, pass the Intent's extras to the fragment as arguments
        firstFragment.setArguments(getIntent().getExtras());
        // Add the fragment to the 'fragment_container' FrameLayout
        getSupportFragmentManager().beginTransaction()
                .add(R.id.fragment_container, firstFragment).commit();


    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_home_page, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

Below is my Home_pageFragment.java (the fragment which is supposed to be inserted in the container)

package com.technology.computer.mit.ctechmit;

import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A placeholder fragment containing a simple view.
 */
public class Home_pageFragment extends Fragment {


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {

        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_home_page, container, false);
    }

}

Below is my activity_home_page.xml (fragment_container layout)

<fragment
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/fragment_container"
    android:name="com.technology.computer.mit.ctechmit.Home_pageFragment"
    tools:layout="@layout/fragment_home_page"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Below is my fragment_home_page.xml (fragment layout)

<LinearLayout
    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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:orientation="horizontal"
    tools:context=".Home_pageFragment">

    <TextView
        android:text="@string/hello_world"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_send" />

</LinearLayout>

Can u please help me with this error? Why is the fragment getting loaded twice in the home activity? I am getting an overlapped hello world text.

Answer 1

It's simple. The layout you are inserting your Fragment is not a view that you are using as a Container. In fact, it's fragment itself.

So either use a FrameLayout as a fragment container, or keep the Fragment in your XML and do not call Fragment Manager to insert to this Fragment. I would suggest the first one.

<FrameLayout
   android:id="@+id/fragment_container"
   android:layout_width="match_parent"
   android:layout_height="match_parent"/>