web-dev-qa-db-fra.com

BottomSheet Android: se cache sous la barre d'outils

J'ai essayé d'utiliser la nouvelle feuille de fond de la bibliothèque de support 23.2.0 pour agrandir une feuille de fond en plein écran, comme le suggère le consignes de conception }.

Cela fonctionne très bien mais la feuille du bas va sous mon ActionBar et sous mes onglets.

Comment est-il possible de laisser la feuille inférieure passer au-dessus de la barre d’outils? Mon menu est structuré comme ceci:

 

    <Android.support.design.widget.AppBarLayout
        Android:id="@+id/appbar"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:paddingTop="@dimen/appbar_padding_top">

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

        <Android.support.design.widget.TabLayout
            Android:id="@+id/tabs"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"/>

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

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

    <include
        Android:id="@+id/playerLayout"
        layout="@layout/player_main"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        app:behavior_peekHeight="?attr/actionBarSize"
        app:layout_behavior="@string/bottom_sheet_behavior"
        app:model="@{model}"/>

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

enter image description here

androidmaterial-designandroid-support-libraryandroiddesignsupport
12
Paul Woitaschek

La AppBarLayout a une élévation par défaut de 4dp (la valeur de ressource de dimension design_appbar_elevation).

Par défaut, CoordinatorLayout, comme toute FrameLayout, mettra en forme les éléments dont l'élévation est plus élevée avant l'élévation inférieure sur les périphériques API 21 et supérieurs.

Essayez d’ajouter Android:elevation="@dimen/design_appbar_elevation" à votre mise en page.

Notez que l'altitude d'une feuille de fond modale est @dimen/design_bottom_sheet_modal_elevation == 16dp

43
ianhanniballake

Si la réponse ci-dessus ne vous aide pas, essayez de définir votre BottomSheet:

Android:elevation="@dimen/design_appbar_elevation" Android:fitsSystemWindows="true"

et créez votre fragment de la manière suivante:

videoFragment = VideoFragment.newInstance(); getSupportFragmentManager().beginTransaction() .replace(R.id.video_fragment, videoFragment) .commit();
pas comme ça: videoFragment = (VideoFragment) getSupportFragmentManager().findFragmentById(R.id.video_fragment);

Par exemple, j'ai une telle disposition:

<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:background="@color/activity_background">

<Android.support.design.widget.AppBarLayout
    Android:id="@+id/appBar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:theme="@style/ThemeOverlay.AppCompat.ActionBar">

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

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

<Android.support.v7.widget.RecyclerView
    Android:id="@+id/recycler_view"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

<Android.support.design.widget.BottomNavigationView
    Android:id="@+id/bottom_navigation"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_gravity="bottom"
    app:itemBackground="@color/white"
    app:menu="@menu/bottom_navigation_main"/>

<FrameLayout
    Android:id="@+id/video_fragment"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:elevation="@dimen/design_appbar_elevation"
    Android:fitsSystemWindows="true"
    app:behavior_hideable="true"
    app:behavior_peekHeight="0dp"
    app:layout_behavior="Android.support.design.widget.BottomSheetBehavior"/>


et cela ne fonctionne pas sans des choses spécifiées

1
Grigory Azaryan