web-dev-qa-db-fra.com

Défilement fluide et Fling avec NestedScrollView, AppBarLayout et CoordinatorLayout

Je travaille sur une application où j'utilise AppBarLayout avec CollapsingToolbarLayout et NestedScrollView. J'ai réussi à mettre en œuvre cela et cela fonctionne bien.

Maintenant, ce que j'essaie de faire, c'est qu'en jetant (balayage rapide vers le haut) sur le Nestedscrollview, il devrait défiler complètement vers le haut. De même, en jetant (balayage rapide vers le bas) vers le bas de l'écran, il doit défiler en douceur vers le bas. Cependant, maintenant, il ne reste coincé qu'entre les deux, ce qui le rend laid. J'ai essayé de nombreuses solutions disponibles ici, mais rien n'a fonctionné pour moi. Ma configuration actuelle est ci-dessous.

    <Android.support.design.widget.CoordinatorLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:app="http://schemas.Android.com/apk/res-auto"
xmlns:card_view="http://schemas.Android.com/apk/res-auto"
xmlns:tools="http://schemas.Android.com/tools"
xmlns:zhy="http://schemas.Android.com/apk/res-auto"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
tools:ignore="RtlHardcoded">

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

    <Android.support.design.widget.CollapsingToolbarLayout
        Android:id="@+id/main.collapsing"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            Android:id="@+id/placeholder"
            Android:layout_width="match_parent"
            Android:layout_height="246dp"
            Android:scaleType="fitXY"
            Android:tint="#11000000"
            app:layout_collapseMode="parallax"
            app:layout_collapseParallaxMultiplier="0.9" />


        <FrameLayout
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:layout_gravity="top"
            Android:padding="10dp">


            <FrameLayout
                Android:id="@+id/back_frame"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_gravity="left|center_vertical"
                Android:paddingBottom="5dp"
                Android:paddingLeft="5dp"
                Android:paddingRight="10dp"
                Android:paddingTop="5dp">

                <ImageView
                    Android:id="@+id/back_image"
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:layout_gravity="center"
                    Android:src="@drawable/abc_ic_ab_back_mtrl_am_alpha" />
            </FrameLayout>


            <FrameLayout
                Android:id="@+id/frameLayoutheart"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"

                Android:layout_gravity="right|center_vertical"
                Android:paddingBottom="5dp"
                Android:paddingLeft="10dp"
                Android:paddingRight="5dp"
                Android:paddingTop="5dp">

                <ImageView
                    Android:id="@+id/favbtnicon"
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:layout_gravity="center"
                    Android:src="@drawable/heart_profile" />
            </FrameLayout>


        </FrameLayout>

        <FrameLayout
            Android:id="@+id/main.framelayout.title"
            Android:layout_width="match_parent"
            Android:layout_height="100dp"
            Android:layout_gravity="bottom|center_horizontal"
            Android:orientation="vertical"

            app:layout_collapseMode="parallax"
            app:layout_collapseParallaxMultiplier="0.3">

            <LinearLayout
                Android:id="@+id/main.linearlayout.title"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_gravity="center"
                Android:gravity="top"
                Android:orientation="vertical">


                <LinearLayout
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:layout_gravity="center_horizontal"

                    Android:orientation="horizontal">

                    <TextView
                        Android:id="@+id/profileName"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="25dp"
                        Android:inputType="textNoSuggestions"
                        Android:singleLine="true"
                        Android:text="Ankita arora"
                        Android:textColor="@Android:color/white"
                        Android:textSize="25sp"
                        Android:textStyle="bold" />


                    <ImageView
                        Android:id="@+id/onlinestatus"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="29dp"
                        Android:src="@drawable/online"
                        Android:visibility="visible" />
                </LinearLayout>


                <LinearLayout
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:layout_gravity="center_horizontal"
                    Android:orientation="horizontal">

                    <TextView
                        Android:id="@+id/age"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_gravity="center_horizontal"
                        Android:inputType="textCapSentences"
                        Android:text="asdas"
                        Android:textColor="@Android:color/white"
                        Android:textSize="13sp" />


                    <TextView
                        Android:layout_width="4dp"
                        Android:layout_height="4dp"
                        Android:layout_gravity="center"

                        Android:layout_marginLeft="4dp"
                        Android:layout_marginRight="4dp"
                        Android:background="@drawable/white_dot" />

                    <TextView
                        Android:id="@+id/sex"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_gravity="center_horizontal"
                        Android:inputType="textCapSentences"
                        Android:text="asdas"
                        Android:textColor="@Android:color/white"
                        Android:textSize="13sp" />


                    <TextView
                        Android:id="@+id/loc_point"
                        Android:layout_width="4dp"
                        Android:layout_height="4dp"
                        Android:layout_gravity="center"

                        Android:layout_marginLeft="4dp"
                        Android:layout_marginRight="4dp"
                        Android:background="@drawable/white_dot" />


                    <TextView
                        Android:id="@+id/loc"
                        Android:layout_width="wrap_content"
                        Android:layout_height="wrap_content"
                        Android:layout_gravity="center_horizontal"
                        Android:inputType="textCapSentences"
                        Android:text="asdas"
                        Android:textColor="@Android:color/white"
                        Android:textSize="13sp" />

                </LinearLayout>


            </LinearLayout>
        </FrameLayout>
    </Android.support.design.widget.CollapsingToolbarLayout>
</Android.support.design.widget.AppBarLayout>


<Android.support.v4.widget.NestedScrollView
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:scrollbars="none"
    app:behavior_overlapTop="10dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"

    >

    ------content--------------


     </Android.support.v4.widget.NestedScrollView>


<Android.support.v7.widget.Toolbar
    Android:id="@+id/main.toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    Android:background="@color/pinkColor"
    Android:visibility="invisible"
    app:contentInsetEnd="0dp"
    app:contentInsetStart="0dp"
    app:layout_anchor="@id/main.framelayout.title"
    app:theme="@style/ThemeOverlay.AppCompat.Dark"
    app:title="">

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

        <ImageView
            Android:id="@+id/back"
            Android:layout_width="25dp"
            Android:layout_height="25dp"
            Android:layout_gravity="left|center_vertical"
            Android:layout_marginLeft="4dp"
            Android:src="@drawable/abc_ic_ab_back_mtrl_am_alpha"
            Android:visibility="invisible" />

        <Space
            Android:layout_width="@dimen/image_final_width"
            Android:layout_height="@dimen/image_final_width" />


        <LinearLayout
            Android:layout_width="wrap_content"
            Android:layout_height="match_parent"
            Android:layout_marginLeft="8dp"
            Android:gravity="center"
            Android:orientation="vertical">

            <TextView
                Android:id="@+id/main.textview.title"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"

                Android:layout_gravity="left"
                Android:text="@string/quila_name2"
                Android:textColor="@Android:color/white"
                Android:textSize="20sp" />

            <TextView
                Android:id="@+id/status"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_gravity="left"
                Android:layout_marginTop="-4dp"
                Android:text="@string/quila_name2"
                Android:textColor="@Android:color/white"
                Android:textSize="12sp" />


        </LinearLayout>

    </LinearLayout>
</Android.support.v7.widget.Toolbar>

<de.hdodenhof.circleimageview.CircleImageView
    Android:id="@+id/profileimg"
    Android:layout_width="@dimen/image_width"
    Android:layout_height="@dimen/image_width"
    Android:layout_gravity="center_horizontal"

    app:border_color="@Android:color/white"
    app:border_width="2dp"
    app:finalHeight="@dimen/image_final_width"
    app:finalYPosition="2dp"
    app:layout_behavior="com.sdl.apps.yaarri.views.AvatarImageBehavior"
    app:startHeight="2dp"
    app:startToolbarPosition="2dp"
    app:startXPosition="2dp" />

L'une des réponses les plus acceptées, présentée ci-dessous, n'a pas fonctionné pour moi non plus.

Impossible de faire défiler AppBarLayout et de réduire la barre d'outils avec NestedScrollView en douceur

17
Harry Sharma

Quand je brûlais mon huile de minuit, cette bibliothèque est venue comme Batman

https://github.com/henrytao-me/smooth-app-bar-layout

Selon lequel le comportement peut être amélioré en suivant ces étapes:

1.Changer

 Android.support.design.widget.AppBarLayout

à

 me.henrytao.smoothappbarlayout.SmoothAppBarLayout and set Android:id

2. retirer

 app:layout_behavior="@string/appbar_scrolling_view_behavior"

3.Ajouter un en-tête à votre NestedScrollView ou RecyclerView

Ce qui en fait a fait fonctionner comme un charme.

La configuration finale ressemble à

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

                  <Android.support.v4.widget.NestedScrollView
                    Android:id="@+id/nested_scroll_view"
                    Android:layout_width="match_parent"
                    Android:layout_height="match_parent">

                    <LinearLayout
                      Android:layout_width="match_parent"
                      Android:layout_height="wrap_content"
                      Android:orientation="vertical"
                      Android:paddingLeft="16dp"
                      Android:paddingRight="16dp"
                      Android:paddingTop="@dimen/app_bar_height">

                      <TextView
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginBottom="16dp"
                        Android:layout_marginTop="16dp"
                        Android:text="@string/text_short" />

                      <TextView
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginBottom="16dp"
                        Android:text="@string/text_long" />
                    </LinearLayout>
                  </Android.support.v4.widget.NestedScrollView>

                  <me.henrytao.smoothappbarlayout.SmoothAppBarLayout
                    Android:id="@+id/smooth_app_bar_layout"
                    Android:layout_width="match_parent"
                    Android:layout_height="@dimen/app_bar_height">

                    <Android.support.design.widget.CollapsingToolbarLayout
                      Android:id="@+id/collapsing_toolbar_layout"
                      Android:layout_width="match_parent"
                      Android:layout_height="match_parent"
                      app:layout_scrollFlags="scroll|exitUntilCollapsed">

                      <Android.support.v7.widget.Toolbar
                        Android:id="@+id/toolbar"
                        app:layout_collapseMode="pin"
                        app:navigationIcon="@drawable/ic_menu_arrow_back"
                        style="@style/AppStyle.MdToolbar" />
                    </Android.support.design.widget.CollapsingToolbarLayout>
                  </me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
                </Android.support.design.widget.CoordinatorLayout> 

Si vous rencontrez toujours des problèmes lors de la mise en œuvre de cette demande, j'aimerais aider et marquer cela si cette réponse aide.

10
Harry Sharma

Utilisez la version support-library 26.0.1.

Ce problème a été résolu par Google à partir de la bibliothèque de support après la version 26.0.0

https://developer.Android.com/topic/libraries/support-library/revisions.html#26-0-1

5
Eniz Bilgin