How to create a slider on the image

Question

This is what I'm trying to achieve.

The black rectangle is the image object that I need to move left and right to the corresponding touch / drag events

Being relatively new to Android, I find it difficult to implement.

So I was hoping I could get some tips, guides, examples, if any.

EDIT: I tried viewflipper, but that’s not what I need here, I tried to make the slider like a search bar, but it didn’t work.

Someone suggested that I use framelayout above the main image for the slide, but I don't know how to do it.

So any help that helps me here is appreciated

Answer 1

Use SeekBar because it fully meets your needs.

First create a shortcut to the xml file named "rect_border.xml" in the res / drawable folder with this content:

// **EDITED** <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <stroke android:color="#000000" android:width="5dp" /> // change the width to any value that suits your needs. // set the height property greater than your image height <size android:width="50dp" android:height="360px" /> </shape> 

Then in your layout:

 // **EDITED** <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <ImageView android:layout_width="match_parent" android:layout_height="300px" android:layout_centerVertical="true" android:scaleType="fitXY" android:src="@drawable/your_image" /> <SeekBar android:layout_width="match_parent" android:layout_height="wrap_content" android:thumb="@drawable/rect_border" android:progressDrawable="@android:color/transparent" /> </RelativeLayout> 

I tested it and I am sure that this is actually what you want (as described). So what is the problem with the SeekBar?