2016-05-20 2 views
0

У меня есть макет, который использует расположение координатора и прокручиваемое изображение параллакса. Все работает так, как я хочу, когда я прокручиваю довольно медленно, но если я прокручусь быстро или щелкнув по экрану, чтобы прокрутить, изображение появится поверх строки заголовка. Затем я могу выполнить прокрутку назад, и она появится из-под изображения и снова вернется наверх.Переупорядочение слоев при быстрой прокрутке

Я сделал запись экрана, что я имею в виду, который вы должны иметь возможность просматривать здесь: link

Вот XML для макета:

<?xml version="1.0" encoding="utf-8"?> 
    <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/detail_coordinator_layout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:context="app.com.example.android.bulletpoints.ui.DetailActivityFragment"> 

    <android.support.design.widget.AppBarLayout 
     android:id="@+id/app_bar_layout" 
     android:layout_width="match_parent" 
     android:background="@color/white" 
     android:layout_height="@dimen/detail_photo_height"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_scrollFlags="scroll|enterAlways"> 

      <ImageView 
       android:id="@+id/article_photo" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="?actionBarSize" 
       android:scaleType="centerCrop" 
       app:layout_collapseMode="parallax" /> 

     </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" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 

      <LinearLayout 
       android:id="@+id/title_bar" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:background="@color/colorPrimary" 
       android:elevation="@dimen/bulletpoint_elevation" 
       android:orientation="vertical"> 

       <TextView 
        android:id="@+id/detail_title" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:paddingEnd="@dimen/detail_bar_text_margin" 
        android:paddingLeft="@dimen/detail_bar_text_margin" 
        android:paddingRight="@dimen/detail_bar_text_margin" 
        android:paddingStart="@dimen/detail_bar_text_margin" 
        android:paddingTop="@dimen/detail_bar_title_top" 
        android:textColor="@color/white" 
        android:textSize="@dimen/detail_title_text_size" /> 

       <TextView 
        android:id="@+id/detail_subtitle" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:paddingBottom="@dimen/detail_bar_subtitle_bottom" 
        android:paddingEnd="@dimen/detail_bar_text_margin" 
        android:paddingLeft="@dimen/detail_bar_text_margin" 
        android:paddingRight="@dimen/detail_bar_text_margin" 
        android:paddingStart="@dimen/detail_bar_text_margin" 
        android:textColor="@color/white" 
        android:textSize="@dimen/detail_subtitle_text_size" /> 
      </LinearLayout> 

      <FrameLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:background="@color/white"> 

       <LinearLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:layout_marginBottom="@dimen/bulletpoint_block_bottom" 
        android:layout_marginEnd="@dimen/bulletpoint_margin" 
        android:layout_marginLeft="@dimen/bulletpoint_margin" 
        android:layout_marginRight="@dimen/bulletpoint_margin" 
        android:layout_marginStart="@dimen/bulletpoint_margin" 
        android:background="@color/white" 
        android:elevation="@dimen/bulletpoint_elevation" 
        android:orientation="vertical"> 

        <include 
         android:id="@+id/bulletpoint_1" 
         layout="@layout/bulletpoint_item" /> 

        <include layout="@layout/divider" /> 

        <include 
         android:id="@+id/bulletpoint_2" 
         layout="@layout/bulletpoint_item" /> 

        <include layout="@layout/divider" /> 

        <include 
         android:id="@+id/bulletpoint_3" 
         layout="@layout/bulletpoint_item" /> 

        <include layout="@layout/divider" /> 

        <include 
         android:id="@+id/bulletpoint_4" 
         layout="@layout/bulletpoint_item" /> 

        <include layout="@layout/divider" /> 

        <include 
         android:id="@+id/bulletpoint_5" 
         layout="@layout/bulletpoint_item" /> 

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

    <include layout="@layout/ad_fab" /> 

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

ли кто-нибудь может увидеть, где Я ошибся в своем макете? Любая помощь будет принята с благодарностью.

Изменить: Я пропустил от верхнего уровня файла XML, так что я добавил его обратно в

ответ

0

Потребовалось много движущихся вещей о, но я решил, что таким образом я подумал я. 'd вывести решение в случае, если кто-то другой имел аналогичную проблему.

Мне пришло в голову неправильно подумать о группировке. Я не уверен, почему он будет прокручивать панель под изображением, но я думаю, что это имеет какое-то отношение к NestedScrollView (, если у кого есть представление о том, почему это, пожалуйста, прокомментируйте).

Чтобы исправить это, я поднял планку в CollapsingToolbarLayout и поместил ее внутри FrameLayout под Imageview.

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/detail_coordinator_layout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:context="app.com.example.android.bulletpoints.ui.DetailActivityFragment"> 

    <android.support.design.widget.AppBarLayout 
     android:id="@+id/app_bar_layout" 
     android:layout_width="match_parent" 
     android:layout_height="@dimen/detail_photo_height"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_scrollFlags="scroll|enterAlways"> 

      <ImageView 
       android:id="@+id/article_photo" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:layout_marginTop="?actionBarSize" 
       android:scaleType="centerCrop" 
       app:layout_collapseMode="parallax"/> 

      <FrameLayout 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:orientation="vertical" > 

       <LinearLayout 
        android:id="@+id/title_bar" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:background="@color/colorPrimary" 
        android:elevation="@dimen/bulletpoint_elevation" 
        android:layout_gravity="bottom" 
        android:orientation="vertical"> 

        <TextView 
         android:id="@+id/detail_title" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:paddingEnd="@dimen/detail_bar_text_margin" 
         android:paddingLeft="@dimen/detail_bar_text_margin" 
         android:paddingRight="@dimen/detail_bar_text_margin" 
         android:paddingStart="@dimen/detail_bar_text_margin" 
         android:paddingTop="@dimen/detail_bar_title_top" 
         android:textColor="@color/white" 
         android:textSize="@dimen/detail_title_text_size" /> 

        <TextView 
         android:id="@+id/detail_subtitle" 
         android:layout_width="wrap_content" 
         android:layout_height="wrap_content" 
         android:paddingBottom="@dimen/detail_bar_subtitle_bottom" 
         android:paddingEnd="@dimen/detail_bar_text_margin" 
         android:paddingLeft="@dimen/detail_bar_text_margin" 
         android:paddingRight="@dimen/detail_bar_text_margin" 
         android:paddingStart="@dimen/detail_bar_text_margin" 
         android:textColor="@color/white" 
         android:textSize="@dimen/detail_subtitle_text_size" /> 
       </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" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

     <FrameLayout 
      android:id="@+id/bulletpoint_block" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:background="@color/white"> 

      <LinearLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_marginBottom="@dimen/bulletpoint_block_bottom" 
       android:layout_marginEnd="@dimen/bulletpoint_margin" 
       android:layout_marginLeft="@dimen/bulletpoint_margin" 
       android:layout_marginRight="@dimen/bulletpoint_margin" 
       android:layout_marginStart="@dimen/bulletpoint_margin" 
       android:background="@color/white" 
       android:elevation="@dimen/bulletpoint_elevation" 
       android:orientation="vertical"> 

       <include 
        android:id="@+id/bulletpoint_1" 
        layout="@layout/bulletpoint_item" /> 

       <include layout="@layout/divider" /> 

       <include 
        android:id="@+id/bulletpoint_2" 
        layout="@layout/bulletpoint_item" /> 

       <include layout="@layout/divider" /> 

       <include 
        android:id="@+id/bulletpoint_3" 
        layout="@layout/bulletpoint_item" /> 

       <include layout="@layout/divider" /> 

       <include 
        android:id="@+id/bulletpoint_4" 
        layout="@layout/bulletpoint_item" /> 

       <include layout="@layout/divider" /> 

       <include 
        android:id="@+id/bulletpoint_5" 
        layout="@layout/bulletpoint_item" /> 

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

    <include layout="@layout/ad_fab" /> 

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