Skip to content Skip to sidebar Skip to footer

Seekbar On Top Of View

I am trying to implement a seekbar on top of a view like in Google Play Music app. I couldn't find answer for this anywhere.I tried negative marginBottom but the thumb was getting

Solution 1:

I've quickly knocked up a layout to give you an idea how to do it. I've used a simple View with a background colour at the top and at the bottom of the layout so you can clearly see it works, and the SeekBar overlaps them both. You can then replace the View at the top with your ViewPager and the one at the bottom with whatever you want at the bottom of the screen. Note that the layout_height on the inner FrameLayout is double the negative layout_marginBottom. These values don't matter too much as long as they are big enough to fit your contents and the negative margin is half your layout_height (e.g. you could just as well set layout_height="50dp" and layout_marginBottom="-25dp". on the FrameLayout` and it will still look right, although you don't want them much bigger than necessary as that would create unnecessary overdrawing of the overlapping views).

<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MyActivity"><Viewandroid:id="@+id/album_art_viewpager"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_above="@id/bottomView"android:background="#f00"/><Viewandroid:id="@+id/bottomView"android:layout_width="match_parent"android:layout_height="60dp"android:layout_alignParentBottom="true"android:background="#00f"/><FrameLayoutandroid:layout_width="match_parent"android:layout_height="40dp"android:layout_above="@id/bottomView"android:layout_alignBottom="@id/album_art_viewpager"android:layout_marginBottom="-20dp"><SeekBarandroid:id="@+id/songProgressBar1"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_gravity="center_vertical"
            /></FrameLayout></RelativeLayout>

Here's a screenshot to show you how it looks: Screen Shot

Post a Comment for "Seekbar On Top Of View"