CollapsingToolbarLayout not collapsing when EditTe

2020-06-01 04:29发布

问题:

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>

回答1:

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.



回答2:

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.



回答3:

I think after all researches this is the best solution

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