Button On Activity Showing Over Fragment

Question

I have a fragment that needs to be displayed over the activity but the button in the activity keeps showing up over the fragment.I need the fragment to completely overlap the activity.

The xml of the activity.

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

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@color/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    app:navigationIcon="@drawable/ic_close_black_24dp"
    app:popupTheme="@style/Theme.AppCompat.NoActionBar"
    app:titleTextColor="@color/toolbarTextColor" />

<android.support.design.widget.TextInputLayout

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

    <EditText
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:inputType="textMultiLine"
        android:lines="3"
        android:maxLines="10"
        android:scrollbars="vertical" />


</android.support.design.widget.TextInputLayout>

</LinearLayout>

The fragment

    <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        app:navigationIcon="@drawable/ic_close_black_24dp"
        app:popupTheme="@style/Theme.AppCompat.NoActionBar"
        app:titleTextColor="@color/toolbarTextColor" />

    <TextView
        android:id="@+id/firstnameTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="@dimen/activity_horizontal_margin"
       />

    <TextView
        android:id="@+id/lastnameTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="@dimen/activity_horizontal_margin"
       />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:text="Chat" />

    <fragment
        android:id="@+id/fragment_chat"
        android:name="user.InitiateChat_Fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</FrameLayout>

private void init() {
    final FragmentManager fragmentManager = getSupportFragmentManager();
    fragment = fragmentManager.findFragmentById(R.id.fragment_chat);
    final FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
    fragmentTransaction.hide(fragment);
    fragmentTransaction.commit();
}

public void showChatForm() {
    showHideFragment(fragment);
}

private void showHideFragment(final Fragment fragment) {

    final FragmentTransaction fragTransaction = getSupportFragmentManager().beginTransaction();
    fragTransaction.setCustomAnimations(R.anim.fragment_slide_from_bottom, R.anim.fragment_slide_to_bottom);

    if (fragment.isHidden()) {
        fragTransaction.show(fragment);
    } else {
        fragTransaction.hide(fragment);
    }
    fragTransaction.commit();
}

The init code is called on activity create.Fragment is a global variable.

Answer 1

Your Button is visible because is has a default elevation of 2dp when using a Material Design Theme. You should give the layout above the button an elevation with 2 or more dp. This will make the button disappear behind the fragment layout in your case.

   android:elevation="2dp"

Answer 2

Try this:

<fragment
    android:id="@+id/fragment_chat"
    android:name="user.InitiateChat_Fragment"
    android:layout_width="match_parent"
    android:background="?android:attr/colorBackground"   //add this
    android:layout_height="match_parent" />

2nd Way

Create a layout in your fragment and hide it's visibility during showing the fragment

    <?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        app:navigationIcon="@drawable/ic_close_black_24dp"
        app:popupTheme="@style/Theme.AppCompat.NoActionBar"
        app:titleTextColor="@color/toolbarTextColor" />

    <LinearLayout
        android:id="@+id/activity_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:id="@+id/firstnameTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="@dimen/activity_horizontal_margin" />

        <TextView
            android:id="@+id/lastnameTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="@dimen/activity_horizontal_margin" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:text="Chat" />

    </LinearLayout>

    <fragment
        android:id="@+id/fragment_chat"
        android:name="user.InitiateChat_Fragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</FrameLayout>

Now in your code:

  private void showHideFragment(final Fragment fragment) {

    final FragmentTransaction fragTransaction = getSupportFragmentManager().beginTransaction();
    fragTransaction.setCustomAnimations(R.anim.fragment_slide_from_bottom, R.anim.fragment_slide_to_bottom);

    if (fragment.isHidden()) {
        fragTransaction.show(fragment); //show fragment
        layout.setVisibility(View.GONE);  //hide Linearlayout
    } else {
        fragTransaction.hide(fragment);
    }
    fragTransaction.commit();
}

Where LinearLayout layout =(LinearLayout)findViewById(R.id.activity_button);