Search code examples
androidandroid-coordinatorlayoutbottom-sheet

Android BottomSheet covers half of anchored ImageView


I have a CoordinatorLayout in which I have a BottomSheet and an ImageView.

This is my BottomSheett:

<include layout="@layout/bottom_sheet_layout"
    android:id="@+id/bottom_sheet"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:behavior_hideable="false"
    app:behavior_peekHeight="80dp"
    app:layout_behavior="@string/bottom_sheet_behavior"/>

And this my ImageView:

<androidx.appcompat.widget.AppCompatImageView
    android:id="@+id/image_location_crosshairs"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginEnd="20dp"
    android:layout_marginRight="20dp"
    app:layout_anchorGravity="top|end"
    app:layout_anchor="@id/bottom_sheet"
    app:srcCompat="@drawable/my_svg_icon"/>

Regardless of the view order in my XML layout, I always get the same result: my ImageView is nicely anchored to the bottomsheet, but the anchor takes place at the center of my image.

I would like to know how can I have my image bottom being anchored instead of its center. Trying to apply any kind of bottom margin will only have the bottomsheet slide until reaching center of image before making the image slides as well.

Thanks for the help !


Solution

  • You can create an empty View, with layout_height and layout_width set to wrap_content.

    <View
        android:id="@+id/view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
    

    And then link this empty View to the BottomSheet.