Reputation: 101

How to set my toolbar fixed while scrolling android

I am currently working in e-commerce android app, i need to fix the toolbar while scrolling.

As i attached the screenshot below. while scrolling the action bar need to be fixed and the body content scroll behind the toolbar

Here is the layout xml:

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

    <include
        android:id="@+id/toolbar_reg"
        layout="@layout/app_bar" />
</LinearLayout>

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:elevation="3dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="?android:attr/actionBarSize"
        android:background="#ffffff"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:layout_marginTop="15dp"
            android:src="@drawable/logo" />


        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_name"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="@string/reg_name"
                android:singleLine="true" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_email"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_email"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="@string/reg_email"
                android:inputType="textEmailAddress" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_password"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="@string/reg_password"
                android:inputType="textPassword" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_cpassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_cpassword"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="Confirm Password"
                android:inputType="textPassword" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_mobile"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_mobile"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="Mobile No"
                android:inputType="number" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_dob"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_dob"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="Date of Birth" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_address"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_address"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Permanent Address" />
        </android.support.design.widget.TextInputLayout>

        <Button
            android:id="@+id/btn_signup"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="25dp"
            android:background="@color/colorPrimary"
            android:text="@string/btn_sign_up"
            android:textColor="@android:color/white" />

        <TextView
            android:id="@+id/link_login"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="150dp"
            android:layout_marginTop="15dp"
            android:gravity="center"
            android:text="@string/req_login"
            android:textSize="16dp" />

    </LinearLayout>
</ScrollView>

Upvotes: 4

Answers (4)

OrhanC1

Reputation: 1410

You should structure your XML so that it's like this:

Relative layout
|-->Toolbar    (android:id="@+id/toolbar")
|-->ScrollView (android:layout_below="@id/toolbar")
    |-->ViewGroup(For example, CoordinatorLayout)
        |-->Child
        |-->Child
        |-->Child

Example code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.v7.widget.Toolbar
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:theme="@style/WelcomeActivityTheme.Toolbar"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        />
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/toolbar">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
        />
    </ScrollView>
</RelativeLayout>

Upvotes: 16

Anuraag Patil

Reputation: 171

I tried many ways to keep the toolbar fixed, while not resizing or compressing the layout by android:windowSoftInputMode="adjustResize", that is not a proper.

That is only possible by Coordinator layout:

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

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar 
           xmlns:android="http://schemas.android.com/apk/res/android"
           xmlns:ripple="http://schemas.android.com/apk/res-auto"
           android:id="@+id/tv_toolbar"
           android:layout_width="match_parent"
           android:layout_height="50dp"
           android:background="#fff"
           ripple:contentInsetStart="0dp">
        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

<ScrollView
    android:id="@+id/coordinate_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:marginTop="56dp">
</ScrollView>

Keep the structure as

   Coordinator layout
  |-->Toolbar    (android:id="@+id/toolbar")
  |-->ScrollView (android:layout_below="@id/toolbar")
   |-->Child
   |-->Child
   |-->Child

Upvotes: 0

Vishavjeet Singh

Reputation: 1385

Given Root view is RelativeLayout in your xml You should set in scrollview xml

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_below="@+id/container_toolbar"
    android:elevation="3dp">

and remove margin_top from linear layout below scrollview tag.

Upvotes: 0

Naveed

Reputation: 3212

Your posted layout does not seem to have a root view.

However to fix the scrolling problem you need to move your scroll view under the same parent as follows:

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

    <include
        android:id="@+id/toolbar_reg"
        layout="@layout/app_bar" />

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:elevation="3dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="?android:attr/actionBarSize"
        android:background="#ffffff"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:layout_marginTop="15dp"
            android:src="@drawable/logo" />


        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_name"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="@string/reg_name"
                android:singleLine="true" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_email"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_email"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="@string/reg_email"
                android:inputType="textEmailAddress" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_password"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="@string/reg_password"
                android:inputType="textPassword" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_cpassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_cpassword"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="Confirm Password"
                android:inputType="textPassword" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_mobile"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_mobile"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="Mobile No"
                android:inputType="number" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_dob"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_dob"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:hint="Date of Birth" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:id="@+id/input_layout_address"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="5dp">

            <EditText
                android:id="@+id/input_address"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Permanent Address" />
        </android.support.design.widget.TextInputLayout>

        <Button
            android:id="@+id/btn_signup"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15dp"
            android:layout_marginRight="15dp"
            android:layout_marginTop="25dp"
            android:background="@color/colorPrimary"
            android:text="@string/btn_sign_up"
            android:textColor="@android:color/white" />

        <TextView
            android:id="@+id/link_login"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="150dp"
            android:layout_marginTop="15dp"
            android:gravity="center"
            android:text="@string/req_login"
            android:textSize="16dp" />

    </LinearLayout>
</ScrollView>
</LinearLayout>

Upvotes: 0

How to set my toolbar fixed while scrolling android

Answers (4)

Related Questions