1. 首頁
  2. 問答
  3. 在recyclerview中的最後一項（在nestedscrollview中）被剪切，橫向方向剪切viewpager

在recyclerview中的最後一項（在nestedscrollview中）被剪切，橫向方向剪切viewpager

2017-04-16 95 views
0

我在CoordinatorLayout中有一個滾動的AppBarLayout，並且在第一個包含NestedScrollView，RecyclerView和一些其他視圖的佈局中包含另一個佈局。在recyclerview中的最後一項（在nestedscrollview中）被剪切，橫向方向剪切viewpager

我在這個佈局中遇到了一些問題。

  1. 在活動中不平滑滾動，在RecyclerView裏面滾動 順利。

  2. RecyclerView中的最後一項從底部切下。

  3. 當我改變方向時，它完全切割底部的ViewPager。因爲我無法再滾動。

Item in the RecyclerView is cut

Orientation cuts the ViewPager

我還附上了主要佈局和下面的子佈局。

activity_detail.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:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:context=".DetailActivity"> 

    <android.support.design.widget.AppBarLayout 
     android:id="@+id/app_bar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:theme="@style/AppTheme.AppBarOverlay"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:fitsSystemWindows="true" 
      app:contentScrim="?attr/colorPrimary" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

      <ImageView 
       android:id="@+id/iv_movie_backdrop" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:contentDescription="@string/str_movie_backdrop_image" 
       android:scaleType="fitXY" /> 

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

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

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

    <android.support.design.widget.FloatingActionButton 
     android:id="@+id/fab" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_margin="@dimen/fab_margin" 
     app:layout_anchor="@id/app_bar" 
     app:layout_anchorGravity="bottom|end" 
     app:srcCompat="@drawable/ic_favorite_black_24dp" /> 

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

movie_details.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.NestedScrollView 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:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fillViewport="true" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

    <android.support.constraint.ConstraintLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <android.support.v7.widget.CardView 
      android:id="@+id/cv_poster_image" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginStart="10dp" 
      android:layout_marginTop="10dp" 
      android:elevation="@dimen/card_elevation" 
      app:cardCornerRadius="8dp" 
      app:cardUseCompatPadding="true" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintTop_toTopOf="parent"> 

      <ImageView 
       android:id="@+id/iv_movie_poster" 
       android:layout_width="150dp" 
       android:layout_height="200dp" 
       android:contentDescription="@string/str_movie_poster" 
       android:padding="@dimen/poster_padding" 
       android:scaleType="fitXY" 
       android:src="@drawable/not_found" /> 
     </android.support.v7.widget.CardView> 

     <TextView 
      android:id="@+id/tv_movie_title" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginEnd="70dp" 
      android:layout_marginStart="10dp" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceLarge" 
      android:textColor="@android:color/black" 
      android:textStyle="bold" 
      app:layout_constraintLeft_toRightOf="@+id/cv_poster_image" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toTopOf="@+id/cv_poster_image" 
      tools:text="Spider Man and Iron Man" /> 


     <TextView 
      android:id="@+id/tv_release_date" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="8dp" 
      android:drawablePadding="@dimen/poster_padding" 
      android:drawableStart="@drawable/ic_date_range_black_24dp" 
      android:gravity="start" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      app:layout_constraintLeft_toLeftOf="@+id/tv_movie_title" 
      app:layout_constraintTop_toBottomOf="@+id/tv_movie_title" 
      tools:text="March, 2017" /> 

     <TextView 
      android:id="@+id/tv_rating" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="8dp" 
      android:drawablePadding="@dimen/poster_padding" 
      android:drawableStart="@drawable/ic_star_black_24dp" 
      android:gravity="start" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      app:layout_constraintLeft_toLeftOf="@+id/tv_release_date" 
      app:layout_constraintTop_toBottomOf="@+id/tv_release_date" 
      tools:text="7.1" /> 

     <TextView 
      android:id="@+id/tv_genre" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="8dp" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      android:textStyle="italic" 
      app:layout_constraintLeft_toLeftOf="@+id/tv_rating" 
      app:layout_constraintTop_toBottomOf="@+id/tv_rating" 
      tools:text="Horror | Comedy | Drama" /> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/sliding_tabs" 
      style="@style/CategoryTab" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginEnd="10dp" 
      android:layout_marginStart="10dp" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toBottomOf="@+id/cv_poster_image" 
      app:tabGravity="fill" /> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/viewPager" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginEnd="10dp" 
      android:layout_marginStart="10dp" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toBottomOf="@+id/sliding_tabs" /> 

    </android.support.constraint.ConstraintLayout> 
</android.support.v4.widget.NestedScrollView>

裏面的movie_details.xml活動 「viewPager」 是我在哪裏加載RecyclerView。

它的一個簡單的RecyclerView我添加了適配器和RecyclerView下面的代碼。

movie_trailers_fragment.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/rv_movie_trailer_list" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" />

下面是在RecyclerView每個項目的佈局。

movie_trailer_item.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:elevation="@dimen/card_elevation" 
    card_view:cardCornerRadius="8dp" 
    card_view:cardUseCompatPadding="true"> 

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

     <ImageView 
      android:id="@+id/iv_trailer_poster" 
      android:layout_width="100dp" 
      android:layout_height="100dp" 
      android:contentDescription="@string/str_trailer_poster" 
      android:scaleType="fitXY" 
      android:src="@drawable/not_found" /> 

     <TextView 
      android:id="@+id/tv_trailer_name" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      android:padding="@dimen/detail_activity_text_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      tools:text="This Trailer Is Awesome" /> 

    </LinearLayout> 

</android.support.v7.widget.CardView>

下面是適配器類的代碼。

TrailerAdapter.java

public class MovieTrailersFragment extends Fragment { 
    public static final String MOVIE_TRAILERS_KEY = "trailer"; 

    public MovieTrailersFragment() { 
    } 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
    } 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 
     View view = inflater.inflate(R.layout.movie_trailers_fragment, container, false); 
     savedInstanceState = this.getArguments(); 
     List<MovieTrailer> movieTrailerList = (List<MovieTrailer>) savedInstanceState.getSerializable(MOVIE_TRAILERS_KEY); 
     RecyclerView recyclerView = (RecyclerView) view.findViewById(R.id.rv_movie_trailer_list); 
     TrailerAdapter trailerAdapter = new TrailerAdapter(view.getContext()); 
     LinearLayoutManager linearLayoutManager = new LinearLayoutManager(view.getContext(),LinearLayoutManager.VERTICAL,false); 
     recyclerView.setLayoutManager(linearLayoutManager); 
     recyclerView.setNestedScrollingEnabled(true); 
     recyclerView.setHasFixedSize(true); 
     recyclerView.setItemAnimator(new DefaultItemAnimator()); 
     recyclerView.setAdapter(trailerAdapter); 
     trailerAdapter.prepareMovieTrailers(movieTrailerList); 
     return view; 
    } 

}

來源

2017-04-16 Shrikanth Narayan

+0

你有沒有找到解決你的問題？我遇到了同樣的問題。 –

+0

是的，我必須在單獨的LinearLayout中分離出TabLayout和ViewPager，然後才能正常工作。 –

+0

在RecylearView上添加波紋管填充。然後它會顯示最後一個項目。 希望這會解決你的問題。 –

回答

0

我不得不分離出TabLayout和ViewPager在一個單獨的LinearLayout，然後一切正常。

下面是參考的修改的佈局：

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 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:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 

    <android.support.constraint.ConstraintLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <android.support.v7.widget.CardView 
      android:id="@+id/cv_poster_image" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginStart="10dp" 
      android:layout_marginTop="10dp" 
      android:elevation="@dimen/card_elevation" 
      app:cardCornerRadius="8dp" 
      app:cardUseCompatPadding="true" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintTop_toTopOf="parent"> 

      <ImageView 
       android:id="@+id/iv_movie_poster" 
       android:layout_width="150dp" 
       android:layout_height="200dp" 
       android:contentDescription="@string/str_movie_poster" 
       android:padding="@dimen/poster_padding" 
       android:scaleType="fitXY" 
       android:src="@drawable/not_found" /> 
     </android.support.v7.widget.CardView> 

     <TextView 
      android:id="@+id/tv_movie_title" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginEnd="60dp" 
      android:layout_marginStart="10dp" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceLarge" 
      android:textColor="@android:color/black" 
      android:textStyle="bold" 
      app:layout_constraintLeft_toRightOf="@+id/cv_poster_image" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toTopOf="@+id/cv_poster_image" 
      tools:text="Spider Man and Iron Man" /> 


     <TextView 
      android:id="@+id/tv_release_date" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="8dp" 
      android:drawablePadding="@dimen/poster_padding" 
      android:drawableStart="@drawable/ic_date_range_black_24dp" 
      android:gravity="start|center_vertical" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      app:layout_constraintLeft_toLeftOf="@+id/tv_movie_title" 
      app:layout_constraintTop_toBottomOf="@+id/tv_movie_title" 
      tools:text="March, 2017" /> 

     <TextView 
      android:id="@+id/tv_rating" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="8dp" 
      android:drawablePadding="@dimen/poster_padding" 
      android:drawableStart="@drawable/ic_star_black_24dp" 
      android:gravity="start|center_vertical" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      app:layout_constraintLeft_toLeftOf="@+id/tv_release_date" 
      app:layout_constraintTop_toBottomOf="@+id/tv_release_date" 
      tools:text="7.1" /> 

     <TextView 
      android:id="@+id/tv_genre" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="8dp" 
      android:padding="@dimen/poster_padding" 
      android:textAppearance="?android:textAppearanceSmall" 
      android:textColor="@android:color/black" 
      android:textStyle="italic" 
      app:layout_constraintLeft_toLeftOf="@+id/tv_rating" 
      app:layout_constraintTop_toBottomOf="@+id/tv_rating" 
      tools:text="Horror | Comedy | Drama" /> 

     <android.support.design.widget.FloatingActionButton 
      android:id="@+id/fab_tab_layout" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_margin="@dimen/fab_margin" 
      android:layout_marginRight="10dp" 
      app:layout_constraintBottom_toBottomOf="parent" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toTopOf="parent" 
      app:layout_constraintVertical_bias="0.0" 
      app:srcCompat="@drawable/ic_favorite_border_black_24dp" /> 

    </android.support.constraint.ConstraintLayout> 

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

     <android.support.design.widget.TabLayout 
      android:id="@+id/sliding_tabs" 
      style="@style/CategoryTab" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginEnd="10dp" 
      android:layout_marginStart="10dp" 
      android:layout_marginTop="10dp" 
      app:tabGravity="fill" /> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/viewPager" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginEnd="10dp" 
      android:layout_marginStart="10dp" 
      android:layout_marginTop="10dp" /> 

    </LinearLayout> 

</LinearLayout>

更新

我使用片段，上述佈局的佈局是包含NestedScrollView和只有一個的FrameLayout內顯示在平板電腦大屏幕設備的情況下使用。

在大屏幕上面片斷的容器：

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.NestedScrollView 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:fillViewport="true" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

    <FrameLayout 
     android:id="@+id/detail_container" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" /> 
</android.support.v4.widget.NestedScrollView>

來源

2017-05-24 20:43:22

+0

但是NestedScrollView在哪裏？你不再使用它了？ –

+0

我正在使用片段，因此用於平板電腦佈局，我不需要僅用於手機佈局的NestedScrollView。 –

0

我認爲你有問題，因爲導航欄重疊您的應用程序佈局。你需要設置你的導航欄，扔主要主題或活動風格

來源

2017-05-25 12:18:22 user8064960

+0

你能解釋一下嗎，如果我將viewpager和tablayout分開在一個線性佈局中，它可以工作。 –

+0

1.嘗試使用清晰的ScrollView，因爲我知道滾動視圖內的回收者工作得很好。 2.重疊問題取決於樣式，因爲應用程序窗口在導航欄下方。還不知道 – user8064960

+0

即使您在沒有底部導航欄的手機中運行該問題，該問題仍然存在，我使用的是註釋5.如果使用scrollView，我將無法獲得滾動的appbar效果。我的理解是，如果您在viewpager中使用回收視圖，NestedScrollView無法測量屏幕大小。這就是爲什麼我添加了一個線性佈局並分離了viewpager。就像我在下面回答。 –

相關問題

 相關問題