Make a view in recyclerview cell float above a previous cell

Question

I am using a RecyclerView to show a list of videos.

Each item in the list holds Video and SeekBar (and more stuff actually but not relevant here) in a RelativeLayout, as follows:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/performance"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <com.my.company.VideoView
        android:id="@+id/the_video"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:keepScreenOn="true"
        android:scaleType="fitCenter" />

    <SeekBar
        android:id="@+id/the_seekbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:alpha="1.0"
        android:maxHeight="@dimen/seekbar_height"
        android:minHeight="@dimen/seekbar_height"
        android:padding="0dp"
        android:progressDrawable="@drawable/my_progressbar"
        android:thumb="@drawable/my_progressbar_circle"
        android:translationY="-5dp" />
</RelativeLayout> 

As you can see I added a android:translationY property that brings the SeekBar up a little so it would be partially positioned on top of the previous cell, i.e. the previous Video.

However it remains partially hidden. I can only see the part that is in the RelativeLayout in which is it declared. I tried calling bringToFront() on the seekbar and on the RelativeLayout (performance) itself - but that did not help.

Probably the question is not relevant to RecyclerView only. Being somewhat new in android dev I am not sure if I can place a view that is declared inside a RelativeLayout to show up outside of its borders.

Hope I was clear, need your help. Tx.

Answer 1

By default, every view is clipped to its parent size.

You could try to disable this clipping, by adding this in your RelativeLayout XML attributes:

android:clipChildren="false"
android:clipToPadding="false"

or in code

viewGroup.setClipChildren(false);
viewGroup.setClipToPadding(false);

In your case, it seems that either RecyclerView or LinearLayoutManager consider that previous items should be displayed over following ones. One way could be to use RecycleView decoration to overlap :

    recyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
        private final static int vertOverlap = -10;// TODO : do not forget to convert dp in pixels

        @Override
        public void getItemOffsets (Rect outRect, View view, RecyclerView parent,       RecyclerView.State state) {

            outRect.set(0, vertOverlap, 0, 0);
        }
    });

So, you would not need to use translationY on your SeekBar, but rather to add some paddingTop to your VideoView :

android:paddingTop="5dp"

That way, I think you could hide the SeekBar if needed, and cell overlapping would not be visible.