How to put button on top of a Recycler View?

user_13315495 0
Viewed 846

I'm developing an android app with Android Studio and I'm having problems using a floating button on top of a recycler view. What I want to achive is to have a floating button on top of my recycler view and when I scroll to the bottom of the recycler view the button should not cover the last item on my list.

If I add padding or margin to my recycler view this is what i get:

With padding or margin

And without padding nor margin this is the result:

Without padding nor margin

My goal is to get this when scrolling to the last item:

Goal seeing last item

And this when I am not in the last item:

Goal not seeing last item

This is the code I currently have:

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        tools:context=".frontend.MainActivity">

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/activityList"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:animationCache="true"
            android:background="@color/white"
            android:layout_marginTop="10dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/addRoutine"
            style="@style/Widget.AppCompat.Button"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:background="@drawable/round_button"
            app:iconPadding="0dp"
            android:layout_marginBottom="10dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>

I would really appreciate if someone could tell how this is achived.

Thank you!

android-recyclerview android-layout android xml
3 Answers

Simply attach ItemDecoration with the recycler view to achieve this.

Step 1: Add this Item Decoration class

class BottomItemDecoration : RecyclerView.ItemDecoration() {

override fun getItemOffsets(outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State) {
    super.getItemOffsets(outRect, view, parent, state)
    if(parent.getChildAdapterPosition(view) == state.itemCount - 1) // Check if it's the last item
        outRect.bottom = 80 // Space(in pixels) to give after the last item for that floating button
}

}

Step 2: Attach BottomItemDecoration with the recycler view

recyclerView.addItemDecoration(BottomItemDecoration())

No change is required in the layout XML file.

user_18908490

I think you can create 2 ViewType in your RecyclerView's Adapter with one is the actual content, the another is a blank one. In the Adapter, you override the method getItemViewType(int position) (This method is used to decide which view holder to use). Note that: in this method, we only return the second view holder (the blank one) when the Recycler view scrolls to the last item (position == yourList.size() -1). Here an example:

    @Override
    public int getItemViewType(int position) {
        if (position == yourList.size() - 1)
            return CONTENT_VIEW_TYPE; //the actual content View Holder
        else return BLANK_VIEW_TYPE; //the blank View Holder
    }
user_121652420
user_90760560
Related