Bring to Button front while having two ConstraintLayout

Question

I'm trying to implement the following design on Android.

I know that to have the button at that position I should have two constraint layout; one for whole change password form and one for change password form without the Save button and then set the Save button's Top and Bottom constraint to the second ConstraintLayout.
But when I do this, the button goes behind the form, and therein lies the problem:

Here is my XML:

    <android.support.design.widget.CoordinatorLayout 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"
        tools:context=".ChangePasswordActivity">
    
        <include
            android:id="@+id/changePasswordBar"
            layout="@layout/top_bar_full"></include>
    
        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">
            <android.support.constraint.ConstraintLayout
                android:id="@+id/changePasswordCTL"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/activities_constraint_top_bottom"
                android:layout_marginEnd="@dimen/activities_constraint_start_end"
                android:layout_marginStart="@dimen/activities_constraint_start_end"
                android:layout_marginTop="@dimen/activities_constraint_top_bottom"
                android:background="@drawable/radius_background_exchange"
                android:elevation="5dp"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent">
    
                // some EditText and TextView views here
    
    
            </android.support.constraint.ConstraintLayout>

    <br.com.simplepass.loading_button_lib.customViews.CircularProgressButton
                android:id="@+id/changePasswordBT"
                style="@style/customButton"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="32dp"
                android:layout_marginStart="32dp"
                android:layout_marginTop="8dp"
                android:fontFamily="@font/sans_web_medium"
                android:text="@string/finish"
                android:textAllCaps="false"
                android:textColor="@android:color/white"
                android:textSize="@dimen/signinup_button_font_size"
                app:initialCornerAngle="5dp"
                app:layout_constraintBottom_toBottomOf="@+id/changePasswordCTL"
                app:layout_constraintEnd_toEndOf="@+id/changePasswordCTL"
                app:layout_constraintStart_toStartOf="@+id/changePasswordCTL"
                app:layout_constraintTop_toBottomOf="@+id/changePasswordCTL"
                app:spinning_bar_color="@android:color/white"
                app:spinning_bar_padding="6dp"
                app:spinning_bar_width="4dp" />
    
        </android.support.constraint.ConstraintLayout>
    
    </android.support.design.widget.CoordinatorLayout>

Answer 1

There is a 5dp elevation on the form and no elevation on the button, so it is partially obscured. Increase the button elevation to at least 5dp.

android:elevation="5dp"

Answer 2

You could achieve such design by using a CoordinatorLayout.

Example:

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <ImageView
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="180dp"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:background="@color/primary" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_camera"
        app:layout_anchor="@id/header"
        app:layout_anchorGravity="bottom|center_horizontal" />

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

just use the following to anchor the layout of your button to the layout of your library view:

app:layout_anchor= "id_of_password_form_layout"