Search code examples
androidandroid-layoutandroid-framelayout

How can I prevent FrameLayout from shadowing my Views?


My interface looks like this:

enter image description here

XML:

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

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:id="@+id/profile_fields_container"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="20dp"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/account_person_name_label" />

            <EditText
                android:id="@+id/person_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:minWidth="150dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="@string/account_person_emailId_label" />
            <EditText
                android:id="@+id/person_emailId"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="textEmailAddress"
                android:minWidth="150dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="@string/account_person_phoneNo_label" />
            <EditText
                android:id="@+id/person_phoneNo"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="phone"
                android:maxLength="10"
                android:minWidth="150dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="@string/account_person_password_label" />
            <EditText
                android:id="@+id/password"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="textPassword"
                android:minWidth="150dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:text="@string/account_person_retypePassword_label" />
            <EditText
                android:id="@+id/retype_password"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="textPassword"
                android:minWidth="150dp"/>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:layout_marginTop="20dp">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/learner_tutor_status_label" />

                <android.support.v7.widget.AppCompatSpinner
                    android:id="@+id/learner_tutor_status_spinner"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

            </LinearLayout>

        </LinearLayout>

    </ScrollView>

    <!--Floating Button-->
    <Button
        android:id="@+id/create_account"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:text="@string/create_account_string"
        style="@style/Widget.AppCompat.Button.Colored"/>

</FrameLayout>

Now, you can see at the bottom there is I am here to.... This is a dropdown and when I choose one of the options, my code dynamically adds a few views to the hierarchy but the problem is they are not visible(not all of them; just I am a... is visible.)

I checked the layout hierarchy through the Layout inspector and turns out that the hierarchy is alive but the floating button(Create Account) has overshadowed it.

Now, I know if I were to replace the root FrameLayout with a LinearLayout, it would be visible but the problem is that if then I would click on a EditText button, the keypad would cover the screen with the Create Account button as covered too. I actually want this button to be on the screen at all times.

Does anyone how can I get around this problem?


Solution

  • Your layout is not totally correct because your floating button hides the bottom of your ScrollView all the time. You should replace the FrameLayout with a vertical LinearLayout (just like you said) and then specify the window behavior of your activity when the soft keyboard pops up with the windowSoftInputMode attribute in your activity element on the AndroidManifest.xml file. If you use android:windowSoftInputMode="adjustResize", the window will resize accordingly and the button should be always visible.