How to replace framelayout with fragment programmatically

Question

I am trying to replace a framelayout with id container by a fragment when a button is clicked in an activity. I think the code I've written is working but something is not right may be it's the layout issue. When the app runs, the fragment appears for blink of a second and it fades right away,somethings blocking it. May be the framelayout is having issue with viewpager. What am I doing wrong here?

This is my xml.

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000">

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

        <include
            android:id="@+id/toolbar_actionbar"
            layout="@layout/toolbar_default"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="gone"/>

        <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/toolbar_actionbar"
            android:clickable="true" />

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TextView
            android:layout_below="@+id/toolbar_actionbar"
            android:paddingRight="30dp"
            android:textColor="#fff"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:text="Skip"
            android:textSize="20sp"
            android:gravity="right"
            android:id="@+id/txt_skip"
            android:layout_alignParentRight="true"
            android:layout_marginTop="20dp"
            />

        <com.viewpagerindicator.CirclePageIndicator
            android:id="@+id/indicator"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:gravity="bottom"
            app:centered="true"
            app:fillColor="@color/white"
            app:pageColor="@color/white"
            app:snap="false"
            android:paddingBottom="20dp"
            android:layout_margin="2dp"
            />


        <com.gc.materialdesign.views.ButtonRectangle
            android:id="@+id/sign_in_button"
            android:layout_width="90dp"
            android:layout_height="60dp"
            android:background="@color/primary_color"
            android:text="Sign in"
            android:paddingBottom="20dp"
            android:paddingRight="40dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"/>


        <com.gc.materialdesign.views.ButtonRectangle
            android:id="@+id/sign_up_button"
            android:layout_width="90dp"
            android:layout_height="60dp"
            android:background="@color/primary_color"
            android:text="Sign Up"
            android:paddingBottom="20dp"
            android:paddingLeft="40dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"/>
    </RelativeLayout>


    <fragment
        android:visibility="gone"
        android:layout_width="280dp"
        android:layout_height="match_parent"
        android:id="@+id/fragment_drawer"
        android:layout_gravity="start"
        android:background="#ff0000"
        app:layout="@layout/fragment_navigation_drawer"
        android:name="com.app.foodmandu.view.nav.NavigationDrawerFragment"/>

</android.support.v4.widget.DrawerLayout>

This the method that triggers the fragment transaction from an activity when a button is clicked.

// inside onClick method.
 openFragment( SignupFragment.newInstance());


// This method gets invoked when a button is clicked.
 public void openFragment(Fragment fragment) {
    FragmentTransaction ft = getSupportFragmentManager()
            .beginTransaction();
    ft.replace(R.id.container,
            fragment);
    ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
    ft.addToBackStack(null);
    ft.commitAllowingStateLoss();
}

Answer 1

您需要在活动onCreate方法上添加默认片段，如下所示：

getFragmentManager().beginTransaction().add(R.id.container, YOUR FRAGMENT).commit();

Answer 2

I think your FrameLayout gets hidden under ViewPager and ViewPager is overlapping the FrameLayout. Try this one :

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

    <include
        android:id="@+id/toolbar_actionbar"
        layout="@layout/toolbar_default"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="gone"/>



    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:layout_below="@+id/toolbar_actionbar"
        android:paddingRight="30dp"
        android:textColor="#fff"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:text="Skip"
        android:textSize="20sp"
        android:gravity="right"
        android:id="@+id/txt_skip"
        android:layout_alignParentRight="true"
        android:layout_marginTop="20dp"
        />

    <com.viewpagerindicator.CirclePageIndicator
        android:id="@+id/indicator"
        android:layout_width="80dp"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:gravity="bottom"
        app:centered="true"
        app:fillColor="@color/white"
        app:pageColor="@color/white"
        app:snap="false"
        android:paddingBottom="20dp"
        android:layout_margin="2dp"
        />


    <com.gc.materialdesign.views.ButtonRectangle
        android:id="@+id/sign_in_button"
        android:layout_width="90dp"
        android:layout_height="60dp"
        android:background="@color/primary_color"
        android:text="Sign in"
        android:paddingBottom="20dp"
        android:paddingRight="40dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"/>


    <com.gc.materialdesign.views.ButtonRectangle
        android:id="@+id/sign_up_button"
        android:layout_width="90dp"
        android:layout_height="60dp"
        android:background="@color/primary_color"
        android:text="Sign Up"
        android:paddingBottom="20dp"
        android:paddingLeft="40dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"/>

   <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/toolbar_actionbar"
        android:clickable="true" />

</RelativeLayout>


<fragment
    android:visibility="gone"
    android:layout_width="280dp"
    android:layout_height="match_parent"
    android:id="@+id/fragment_drawer"
    android:layout_gravity="start"
    android:background="#ff0000"
    app:layout="@layout/fragment_navigation_drawer"
    android:name="com.app.foodmandu.view.nav.NavigationDrawerFragment"/>

By putting your FrameLayout at the last inside RelativeLayout , it will appear on top of everything and will overlap any other view.