web-dev-qa-db-ja.com

BottomNavigationViewでカバーされるRecyclerview

FragmentsにFramelayoutを使用してGoogleサポートライブラリBottomNavigationViewを試しました。

これが私のコードです

<?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をFragment内に配置すると、そのコンテンツはBottomNavigationViewによって隠されてしまいます。

enter image description here

なぜこれが起こるのか私にはわかりません。私は他の人のチュートリアルを調べましたが、うまくいきます。

[〜＃〜] edit [〜＃〜]これが私の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>
androidandroid-support-librarybottomnavigationview
19
EggRollMan

ここで私の解決策は私のために働いています。

レイアウトはほぼ同じです。アニメーションは必要ないため、BottomNavigationViewをCoordinatorLayoutから移動しました。 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>
_
22
chet

CoordinatorLayoutの最も便利な機能の1つは、ビューの覆い焼きです。

CoordinatorLayoutの子ビューは、エッジの「インセット」として割り当てることができます。同じエッジを回避するように割り当てた他のすべての子ビューは、それに合わせて調整されます。

あなたの場合、あなたは次のようなことをするでしょう：

<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>
5
Sound Conception

RecyclerViewとBottomNavigationViewをLinearLayoutに配置してから、LinearLayoutをCoordinatorLayoutに配置できます。 RecyclerViewの属性をlayout_height="0dp"layout_weight="1"として設定し、BottomnavigationViewの属性をlayout_height="wrap_content"layout_gravity="bottom"として設定します。

これは私のコードの一部です、あなたを助けたいと思います。

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

リサイクルビューまたはそのビューを高さ0dp、重み1に設定します。これにより、使用可能なスペースがすべて残ります。

1
nebuchadnezzar I

いくつかのパディングを追加するリサイクラービューにItemDecoratorを追加できます。 Javaの代わりにKotlinを使用していますが、一般的な考え方は次のとおりです。

 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
            }
        }
    })
1
reacuna

私は単純な解決策を持っていますが、最善ではないかもしれませんが、それでうまくいきます。actionBarSizeを使用してappBar（ツールバー）の高さと同じ高さのビューを作成し、appbarとbottomnavの高さは同じなので、recyclerviewをこのビューの上部に制限できます。これを行うと、bottomnavでカバーされません。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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.pedidos.PedidoFragment">

    <androidx.recyclerview.widget.RecyclerView
        Android:id="@+id/recyclerView"
        Android:layout_width="match_parent"
        Android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/view3"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <View
        Android:id="@+id/view3"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

enter image description here

0
Gastón Saillén

親レイアウト、つまりコーディネーターレイアウトがフレームレイアウトを拡張するため、wrap_contentではなくBottomNavigationViewのdpに静的な高さを指定します。デフォルトの動作では、フレームビューが子ビューを上下に配置します。それはあなたのフラグメントコンテナがbotomnavigationviewで覆われていることです。

0
sohan shetty

レイアウトに含まれるメインコンテンツ。マージンの下部をリサイクル業者のビューに割り当てます。リサイクラービューが下部ナビゲーションビューの後ろに隠れているため

0
Gaurav sappal
  1. BottomNavigationViewをcontent_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
Ferdous Ahamed