2016-12-17 60 views
7

我嘗試了谷歌支持庫BottomNavigationView和我的片段的Framelayout。BottomNavigationView覆蓋的Recyclerview

這裏是我的代碼

<?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="com.bottombarnavigation.MainActivity"> 

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

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

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

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

<android.support.design.widget.BottomNavigationView 
    android:background="#fcfcfc" 
    android:id="@+id/bottom_navigation" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="bottom|end" 
    app:menu="@menu/bottom_navigation" /> 

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

當我填充我的片段裏面Recyclerview,它的內容得到了由BottomNavigationView掩蓋。

enter image description here

我不知道爲什麼會這樣。我通過其他人教程看,它工作正常。

編輯 這裏是我的content_main.xml文件

<?xml version="1.0" encoding="utf-8"?> 
    <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:background="@android:color/white" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="com.bottombarnavigation.MainActivity" 
    tools:showIn="@layout/activity_main"> 


<FrameLayout 
    android:id="@+id/container" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"></FrameLayout> 
</RelativeLayout> 
+0

試試這個[鏈接](http://stackoverflow.com/a/40153446/2891686)。我認爲屬性app:layout_anchor和app:layout_anchorGravity被忽略。 –

+0

@DmitriyKaluzhin我只是試了一下,結果是一樣的。 recyclerview內容仍然落後bottomnavigationview –

+0

你是否找到了這個問題的答案? –

回答

0

給在DP一些靜態的高度BottomNavigationView,而不是因爲WRAP_CONTENT你的父母佈局I,E協調佈局擴展的FrameLayout其中它的默認行爲是將它的孩子一個在另一個之上。這就是你的碎片容器被botomnavigationview所掩蓋。

+0

它不工作之一:X –

+0

或給靜態高度片段容器 –

+0

或刪除您的協調佈局替換相對佈局和規則添加到其子視圖實現自己的UI –

0

設置回收視圖或任何視圖的高度爲0dp和重量1.這將使其佔用所有可用空間。

+0

我剛纔試過這個方法了。它不起作用。 –

+0

你可以放置content_main佈局嗎? –

+1

在包括輪廓線,使之0dp和重量1.如果不工作,然後嘗試做它的框架佈局/相對佈局 –

4

在這裏我的解決方案,爲我工作。

我幾乎相同的佈局,你,我感動BottomNavigationViewCoordinatorLayout,因爲我並不需要它的任何動畫。 我已將BottomNavigationView對齊到父項的底部,並將layout_above添加到CoordinatorLayout以使其高於BottomNavigationView,但填滿了所有屏幕。

有了這個配置我解決了重疊的問題,我希望這會幫助你。

在這裏你有我的佈局。

<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" 
      tools:context=".ui.activities.MainActivity"> 

     <android.support.design.widget.CoordinatorLayout 
       android:id="@+id/main_coordinator" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:fitsSystemWindows="true" 
       android:layout_above="@+id/dashboard_navigation"> 

      <android.support.design.widget.AppBarLayout 
        android:id="@+id/main_appbar" 
        android:layout_width="match_parent" 
        android:layout_height="?attr/actionBarSize" 
        android:elevation="16dp"> 

        <android.support.v7.widget.Toolbar 
         android:id="@+id/dashboard_toolbar" 
         android:layout_width="match_parent" 
         android:layout_height="?attr/actionBarSize" 
         android:background="@color/colorPrimary"/> 
      </android.support.design.widget.AppBarLayout> 

      <FrameLayout 
        android:id="@+id/main_frame_layout" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent"/> 

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

     <android.support.design.widget.BottomNavigationView 
       android:id="@+id/dashboard_navigation" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:layout_alignParentBottom="true" 
       android:background="@color/colorPrimaryDark" 
       app:itemTextColor="@color/colorAccent" 
       app:menu="@menu/menu_main"/> 
    </RelativeLayout> 
0
  1. 將您BottomNavigationViewcontent_main.xml並把它裏面RelativeLayout
  2. 添加屬性android:layout_alignParentBottom="true"BottomNavigationView
  3. 添加屬性android:layout_above="@id/bottom_navigation"集裝箱FrameLayout

更新您的佈局XML的,如下:

activity_main.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="com.bottombarnavigation.MainActivity"> 

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

     <include layout="@layout/toolbar"/> 
    </android.support.design.widget.AppBarLayout> 

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

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

content_main.xml:

<?xml version="1.0" encoding="utf-8"?> 
<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:background="@android:color/white" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="com.bottombarnavigation.MainActivity" 
    tools:showIn="@layout/activity_main"> 

    <android.support.design.widget.BottomNavigationView 
     android:id="@+id/bottom_navigation" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:background="#fcfcfc" 
     app:menu="@menu/bottom_navigation" /> 

    <FrameLayout 
     android:id="@+id/container" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_above="@id/bottom_navigation" /> 
</RelativeLayout> 

希望這將有助於〜

0

您可以將ItemDecorator添加到您的回收觀點,增加了一些填充。我使用科特林而不是Java,但總體思路是:

recyclerView.addItemDecoration(object : RecyclerView.ItemDecoration() { 
     override fun getItemOffsets(outRect: Rect?, view: View?, parent: RecyclerView?, state: RecyclerView.State?) { 
      // Get the position of the view in the recycler view 
      val position = parent?.getChildAdapterPosition(view) 
      if (position == null || position == RecyclerView.NO_POSITION) { 
       return 
      } 

      if (position == parent.adapter.itemCount - 1) { 
       // Add padding to the last item. You should probably use a @dimen resource. 
       outRect?.bottom = 200 
      } 
     } 
    }) 
2

你可以把RecyclerView和BottomNavigationView在LinearLayout中,然後把LinearLayout中的CoordinatorLayout。設置RecyclerView的屬性作爲layout_height="0dp"layout_weight="1",並且layout_height="wrap_content"layout_gravity="bottom"的BottomnavigationView的屬性。

這裏是我的代碼部分,希望能幫助你。

<android.support.design.widget.CoordinatorLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.design.widget.AppBarLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/manager_main_toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 

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

    <LinearLayout 
     android:orientation="vertical" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

     <android.support.v4.widget.SwipeRefreshLayout 
      android:id="@+id/swipe_refresh" 
      android:layout_width="match_parent" 
      android:layout_height="0dp" 
      android:layout_weight="1"> 

      <android.support.v7.widget.RecyclerView 
       android:id="@+id/recycler_view" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" /> 

     </android.support.v4.widget.SwipeRefreshLayout> 

     <android.support.design.widget.BottomNavigationView 
      android:id="@+id/bottom_nav" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom" 
      android:background="?android:attr/windowBackground" /> 

    </LinearLayout> 

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

在您的佈局中包含的主要內容。將保證金底部留給回收商視圖。 由於回收者視圖隱藏在底部導航視圖後面

0

CoordinatorLayout最有用的功能之一是視圖躲避。

CoordinatorLayout的子視圖可以被指定爲「insetting」的邊緣。 您指定爲躲避同邊將被調整,以適應任何其他子視圖。

在你的情況,你會做類似如下:

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

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

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

<include 
    layout="@layout/content_main" 
    app:layout_dodgeInsetEdges="bottom" /> <-- Specifies this view dodges any views that inset the bottom edge 

<android.support.design.widget.BottomNavigationView 
    android:background="#fcfcfc" 
    android:id="@+id/bottom_navigation" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_gravity="bottom|end" 
    app:menu="@menu/bottom_navigation" 
    app:layout_insetEdge="bottom" />  <-- Specifies that this view insets the bottom edge 

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