Viewpager被推出屏幕[CoordinatorLayout] [設計庫]

我有一個包含3個片段的viewpager的簡單應用程序。在其中一個片段中，我有Recyclerview列表。向下滾動時，工具欄將摺疊並顯示向上滾動。我的問題是，當工具欄被摺疊，我向左/向右滾動我正在以編程方式擴展它，它推動ViewPager下來，而不是重疊它。這導致屏幕視圖的位移不令人滿意。我如何讓工具欄與我的viewpager重疊，而不是在展開時將其推下？我對這一問題進行簡短記錄click Viewpager被推出屏幕[CoordinatorLayout] [設計庫]

這是我main_layout：

<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:fab="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=".UI.MainActivity"> 

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

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      app:popupTheme="@style/AppTheme.PopupOverlay" 
      app:layout_scrollFlags="scroll|enterAlways" /> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/sliding_tabs" 
      android:layout_width="match_parent" 
      android:layout_height="@dimen/tabsHeight" 
      style="@style/NavigationTab"/> 


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

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"/> 


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

    <com.getbase.floatingactionbutton.FloatingActionsMenu 
     android:id="@+id/floatingActionMenu" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentEnd="true" 
     fab:fab_addButtonColorNormal="@color/blood_orange" 
     fab:fab_addButtonColorPressed="@color/dirtyWhite" 
     fab:fab_addButtonPlusIconColor="@color/dirtyWhite" 
     fab:fab_addButtonSize = "normal" 
     fab:fab_labelStyle="@style/menu_labels_style" 
     fab:fab_labelsPosition="left" 
     app:layout_anchor="@id/viewpager" 
     app:layout_anchorGravity="bottom|end"> 

     <com.getbase.floatingactionbutton.FloatingActionButton 
      android:id="@+id/createPlanBtn" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      fab:fab_colorNormal="@color/blood_orange" 
      fab:fab_title="Create a plan" 
      fab:fab_size="normal" 
      app:fab_icon="@drawable/ic_event_white_48dp" 
      fab:fab_colorPressed="@color/dirtyWhite"/> 

     <com.getbase.floatingactionbutton.FloatingActionButton 
      android:id="@+id/changeStatusBtn" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      fab:fab_colorNormal="@color/blood_orange" 
      fab:fab_size="normal" 
      app:fab_icon="@drawable/ic_textsms_white_48dp" 
      fab:fab_title="Change status" 
      fab:fab_colorPressed="@color/dirtyWhite"/> 

    </com.getbase.floatingactionbutton.FloatingActionsMenu> 

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

這是我的片段包含recyclerview佈局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:orientation="vertical" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:background="@color/tab_bg"> 

<android.support.v7.widget.RecyclerView 
    android:id="@+id/feedCardViewList" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:clipToPadding="true" 
    xmlns:android="http://schemas.android.com/apk/res/android"/> 

</RelativeLayout>

content_main佈局：

<RelativeLayout 
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:paddingBottom="@dimen/activity_vertical_margin" 
android:paddingLeft="@dimen/activity_horizontal_margin" 
android:paddingRight="@dimen/activity_horizontal_margin" 
android:paddingTop="@dimen/activity_vertical_margin" 
tools:context=".UI.MainActivity" 
tools:showIn="@layout/activity_main" 
app:layout_behavior="@string/appbar_scrolling_view_behavior"> 


</RelativeLayout>

來源

2016-02-12 Georgi Koemdzhiev

這是否會發生，如果您刪除應用程序：layout_scrollFlags =「scroll | enterAlways」？ – Blackbelt

@Blackbelt不，它沒有。只有當工具欄被摺疊並且我滾動出這個片段時（工具欄被展開在viewpager的PageChanged上） –

@Blackbelt - AFAIK，這個標誌與'ViewPager'沒有關係，我可以記住許多重複的問題，但是他們都沒有答案 – Mohsen

今天就遇到這個問題。我不確定我是否錯過了某些東西，並且錯誤地實施了CoordinatorLayout，或者它是一個錯誤。但是，如果有人仍然有這個問題，我通過基於應用欄的高度調整工具欄下方的內容邊距，以編程方式解決它。那就是：

佈局XML：

<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.design.widget.AppBarLayout 
     android:id="@+id/app_bar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

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

      ...collapsing toolbar content... 

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

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

    <FrameLayout 
     android:id="@+id/content" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

     ...content beneath toolbar... 

    </FrameLayout> 

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

代碼（充氣佈局後）：

AppBarLayout appBarLayout = (AppBarLayout) findViewById(R.id.app_bar); 
CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar); 
FrameLayout contentLayout = (FrameLayout) view.findViewById(R.id.content); 
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() { 

    @Override 
    public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) { 
     ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) contentLayout.getLayoutParams(); 
     layoutParams.setMargins(0, 0, 0, appBarLayout.getMeasuredHeight() + verticalOffset); 
     contentLayout.requestLayout(); 
    } 

});

來源

2017-02-07 03:08:56 user1203585

謝謝你分享你的答案！我沒有測試過，但我會接受你的答案，因爲它是最詳細的答案，它也可以幫助其他人。 –

它的工作原理。幫了很多！ –

-2

在您的viewpager標記中嘗試使用Android:MarginBottom = "5dp"，這裏您將鋪貼高度用作「Match_Parent」，因此它覆蓋底部區域。

來源

2016-02-12 08:53:40 Newbiee

這是SupportLibrary的默認配置或默認設計，因此，OP不需要更改任何內容。 – Mohsen

我試過了，這是一個解決問題的方法，它只是破壞了我的佈局。 –

我有同樣的問題，所以暫時我把一個55dp的底部邊距android：layout_marginBottom =「55dp」，看起來不錯，我希望這個問題很快就會得到解決。

來源

2016-03-18 16:50:33 Talu

的this

可能重複你可以嘗試改變工具欄的app:layout_scrollFlags="scroll|enterAlways"屬性app:layout_scrollFlags="enterAlways"。

來源

2016-10-12 13:34:59 Williem

這個爲我修好了。豎起大拇指^^ – pixelsize

大家

我也面臨着同樣的問題。 |從你的工具條碼

在你XMLFILE layout_scrollFlags = 「enterAlways長卷」：

這個問題可以通過簡單地刪除

應用程序可以輕鬆解決。

我也遇到同樣的問題，但很快刪除此 viewpager後本身佈置在屏幕內（沒有穿過屏幕限制）

這是默認代碼

<android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="?attr/colorPrimary" 
     app:layout_scrollFlags="scroll|enterAlways" 
     app:popupTheme="@style/AppTheme.PopupOverlay">

這種變化

<android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="?attr/colorPrimary" 

     app:popupTheme="@style/AppTheme.PopupOverlay">

底部的第二行。

來源

2017-08-04 14:08:38

Viewpager被推出屏幕[CoordinatorLayout] [設計庫]

回答

相關問題