Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CollapsingToolbarLayout not collapsing when EditText get focused

I am using CollapsingToolBar inside CoordinatorLayout and I've NestScrollView containing some EditText as child views. What i am facing is when edittext get focused and keybaoard appear my complete view doesn't scroll up.

Below is the code and image as output of that layout.

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/app_bar_height"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:expandedTitleMarginEnd="64dp"
        app:expandedTitleMarginStart="48dp"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">


        <ImageView
            android:id="@+id/ivProductImage"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:src="@drawable/stub_image"
            app:layout_collapseParallaxMultiplier="0.7"
            app:layout_collapseMode="parallax" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

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

<android.support.v4.widget.NestedScrollView
    android:id="@+id/nested_scroll_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:id="@+id/containerLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="10dp">

            <EditText
                android:id="@+id/etProductTitle"
                style="@style/EditTextStyle"
                android:hint="@string/lbl_product_title"
                android:inputType="text"
                android:textSize="24dp" />
        </android.support.design.widget.TextInputLayout>

        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp">

            <EditText
                android:id="@+id/etProductDescription"
                style="@style/EditTextStyle"
                android:hint="@string/lbl_description"
                android:inputType="text" />
        </android.support.design.widget.TextInputLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <android.support.design.widget.TextInputLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="0.5">

                <EditText
                    android:id="@+id/etDeposit"
                    style="@style/EditTextStyle"
                    android:hint="@string/lbl_deposit"
                    android:inputType="number" />
            </android.support.design.widget.TextInputLayout>

            <android.support.design.widget.TextInputLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:layout_weight="0.5">

                <EditText
                    android:id="@+id/etPricePerDay"
                    style="@style/EditTextStyle"
                    android:hint="@string/lbl_price_per_day"
                    android:inputType="number" />
            </android.support.design.widget.TextInputLayout>
        </LinearLayout>

        <android.support.design.widget.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp">

            <EditText
                android:id="@+id/etLocation"
                style="@style/EditTextStyle"
                android:hint="@string/lbl_add_location"
                android:inputType="text" />
        </android.support.design.widget.TextInputLayout>

        <TextView
            style="@style/SubHeading"
            android:layout_margin="10dp"
            android:text="@string/lbl_categories"
            android:textColor="@color/color_primary" />

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="315dp"
            android:layout_marginLeft="10dp"
            android:isScrollContainer="false"
            android:layout_marginRight="10dp"
            android:scrollbars="none" />

    </LinearLayout>
</android.support.v4.widget.NestedScrollView>

enter image description here

like image 625
Nauman Zubair Avatar asked Oct 21 '15 09:10

Nauman Zubair


Video Answer


2 Answers

I've resolved this by adding OnFocusChangeListener to EditText and if it has focus - just collapse view with setExpanded method:

editText.setOnFocusChangeListener(new View.OnFocusChangeListener() {
    @Override
    public void onFocusChange(final View v, boolean hasFocus) {
        if (hasFocus) {
           mAppBarLayout.setExpanded(false, true);
        }
    }
});

If you want your CollapsingToolbarLayout be collapsed every time when your other EditText's from your layout get focused, then you should set the same OnFocusChangeListener to each of them.

like image 96
romtsn Avatar answered Oct 16 '22 07:10

romtsn


RecyclerView is a scrollable widget which means, these scrollable widgets won't work with eachother.(But, RecyclerView is a child from NestedScrollingChild)

Check this question for more explanation:

How to use RecyclerView inside NestedScrollView?

But, you can use it with custom LinearLayoutManager

https://stackoverflow.com/a/32736113/4409113


By the way,

You could use that RecyclerView inside the CoordinatorLayout and outside the NestedScrollView.

Hope that helps.

like image 2
ʍѳђઽ૯ท Avatar answered Oct 16 '22 07:10

ʍѳђઽ૯ท