Is there a way to do this in android studio? I want to achieve that when you scroll down the header will overlap above and under is the scrollview part. What I've got is it scrolls over the header. In android studio

This is what Im trying to achieve that was made in figma

Default

When you scroll

So far this is what my code looks like

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".Fragment.RecordFragment"
    android:orientation="vertical">

    <View
        android:layout_width="369dp"
        android:layout_height="71dp"
        android:layout_alignParentLeft="true"
        android:layout_marginLeft="13dp"
        android:layout_alignParentTop="true"
        android:layout_marginTop="14dp"
        android:background="@drawable/ic_header"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginStart="25dp"
        android:layout_marginTop="25dp"
        android:layout_marginEnd="25dp"
        android:layout_marginBottom="25dp"
        android:text="Record"
        android:textAlignment="center"
        android:textColor="@color/white"
        android:textSize="35sp" />


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

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="vertical"
            android:paddingBottom="100dp">

            <TextView
                android:id="@ id/txtDate"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_marginTop="128dp"
                android:text="Date for today"
                android:textAlignment="center"
                android:textColor="@color/black"
                android:textSize="50sp" />

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

                <View
                    android:layout_width="316dp"
                    android:layout_height="201dp"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentTop="true"
                    android:layout_gravity="center"
                    android:layout_marginTop="50dp"
                    android:background="@drawable/sec_bp" />

                <EditText
                    android:layout_width="250dp"
                    android:layout_height="30dp"
                    android:layout_marginLeft="30dp"
                    android:layout_marginTop="70dp"
                    android:background="@drawable/rounded_corner"
                    android:gravity="center"
                    android:hint="SBP" />

                <EditText
                    android:layout_width="250dp"
                    android:layout_height="30dp"
                    android:layout_marginLeft="30dp"
                    android:layout_marginTop="120dp"
                    android:background="@drawable/rounded_corner"
                    android:gravity="center"
                    android:hint="DBP" />

                <EditText
                    android:layout_width="250dp"
                    android:layout_height="30dp"
                    android:layout_marginLeft="30dp"
                    android:layout_marginTop="170dp"
                    android:background="@drawable/rounded_corner"
                    android:gravity="center"
                    android:hint="BPM" />

                <Button
                    android:layout_width="70dp"
                    android:layout_height="30dp"
                    android:layout_marginLeft="120dp"
                    android:layout_marginTop="210dp"
                    android:background="@drawable/rounded_corner"
                    android:gravity="center"
                    android:text="save" />

            </RelativeLayout>

            <View
                android:layout_width="316dp"
                android:layout_height="117dp"
                android:layout_alignParentLeft="true"
                android:layout_alignParentTop="true"
                android:layout_marginTop="50dp"
                android:background="@drawable/sec_temp" />

            <View
                android:layout_width="316dp"
                android:layout_height="117dp"
                android:layout_alignParentLeft="true"
                android:layout_alignParentTop="true"
                android:layout_marginTop="50dp"
                android:background="@drawable/sec_temp" />


        </LinearLayout>

    </ScrollView>

</RelativeLayout>

CodePudding user response：

Try adding elevation inside your header view. like this :

<View
    android:layout_width="369dp"
    android:layout_height="71dp"
    android:layout_alignParentLeft="true"
    android:layout_marginLeft="13dp"
    android:layout_alignParentTop="true"
    android:layout_marginTop="14dp"
    android:background="@drawable/ic_header"/
    android:elevation="1dp">

<TextView
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_marginStart="25dp"
    android:layout_marginTop="25dp"
    android:layout_marginEnd="25dp"
    android:layout_marginBottom="25dp"
    android:text="Record"
    android:textAlignment="center"
    android:textColor="@color/white"
    android:textSize="35sp" 
    android:elevation="2dp"/>

I set the View elevation 1dp and the TextView 2dp so that the text can still in front of the View.