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.

Yves Delerm · Accepted Answer · 2016-12-14T09:06:04.043

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.

edited Dec 14 '16 at 09:06

answered Dec 13 '16 at 16:59

Yves Delerm

785
4
10

This did not help. I tried adding it to the RelativeLayout, then to the seekbar itself as well and also to the enclosing recycler view and various combinations .The SeekBar is still partially hidden by the view above it. – drorsun Dec 14 '16 at 08:02
I guess you use LinearLayoutManager for your RecyclerView. For some reason, LinearLayoutManager considers that items at the beginning can overlap following items. I know that is not what you intended, but you could use OverlapDecoration to avoid that. – Yves Delerm Dec 14 '16 at 08:31
ok, I diverted my focus to other issues for while, but now came back to this and revisited this solution. It works! definitely I needed the decorator and it took some tweaking with seekbar in my layout - but it works. Thanks! – drorsun Jan 31 '17 at 12:19

score 0 · Answer 2 · edited May 23 '17 at 12:33

0

Follow this answer with same case only the difference is it is overlapping next item of Recycleview https://stackoverflow.com/a/40603773/3839498

edited May 23 '17 at 12:33

Community

1
1

answered Dec 13 '16 at 17:04

Nandan Singh

1,089
12
13

Thanks, AFAICS the change is using clipToPadding="false" - and that did not help. In that question he uses a OverlapDecorationwhich is not something I want to do as I need to make the seekbar appear only when I need to play video so constant overlap is not good for my case. Maybe I am still missing something from your answer to that answer? – drorsun Dec 14 '16 at 08:15
you can also change it runtime. please share a screenshot so that i can help better – Nandan Singh Dec 14 '16 at 09:14

Make a view in recyclerview cell float above a previous cell

2 Answers2