Smooth Scroll und Fling mit NestedScrollView, AppBarLayout und CoordinatorLayout

Question

Ich arbeite an einer Anwendung, wo ich AppBarLayout mit CollapsingToolbarLayout und NestedScrollView verwende. Ich habe das erfolgreich implementiert und es funktioniert gut.

Nun, was ich versuche zu tun ist, dass auf Fling (schnell nach oben wischen) auf der NestedScrollview sollte es vollständig nach oben scrollen. Ähnliches gilt, wenn Sie beim Schleudern (schnelles Wischen nach unten) zum unteren Bildschirmrand rollen müssen. Aber jetzt bleibt es nur dazwischen stecken, was es hässlich aussehen lässt. Ich habe viele verfügbare Lösungen hier ausprobiert, aber nichts hat für mich funktioniert. Mein derzeitiges Setup ist unten.

<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" /> 

Eines der am meisten akzeptierten Antworten, unten entweder nicht für mich arbeiten.

Unable to scroll AppBarLayout and collapsing toolbar with NestedScrollView smoothly

Answer 1

Als ich diese Bibliothek meiner Mitternacht brennendes Öl kam wie batman

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

Nach dem das Verhalten mit dem folgenden Schritten verbessert werden:

1.Change

android.support.design.widget.AppBarLayout 

zu

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

2.Remove

app:layout_behavior="@string/appbar_scrolling_view_behavior" 

3.Add Header auf Ihre NestedScrollView oder RecyclerView

Welche tatsächlich machte es wie Charme zu arbeiten.

Die endgültige Setup sieht aus wie

   <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> 

Wenn Sie noch irgendeine Frage konfrontiert, während dies hier der Umsetzung frage ich dies zu helfen, und markieren Sie würde gerne, wenn diese Antwort hilft.

Answer 2

Verwenden Sie die Version support-library 26.0.1.

Dieses Problem wird von Google aus der Support-Bibliothek nach Version wurde 26.0.0

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

gelöst