How to make segmented seekbar/slider look like following?

Question

I was wondering if anyone can provide hint or source to achieve following slider widget used in \"Circle – Who\'s Around?\" This is the first time I have ever came across th

Answer 1

Following @Milanix answer using the library at https://github.com/karabaralex/android-comboseekbar here it is a minimum example code that worked for me:

<com.infteh.comboseekbar.ComboSeekBar
        android:id="@+id/seekbar" 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        custom:color="#000"
        custom:textSize="12sp"
        custom:multiline="false"
        />

Then in the Activity

private ComboSeekBar mSeekBar;
List<String> seekBarStep = Arrays.asList("All","1","5","10","20");
mDistanceSeekBar.setAdapter(seekBarStep);

This will create a black segmented seekbar using default drawables. If you need to add some customization have a look at ComboSeekBar.onDraw(), CustomDrawable.draw() and CustomThumbDrawable.draw().

This project is all but finished but still a solid starting point.

Answer 2

@Giulio thank you for your post, I have the same problem as Ron Eskinder. I heve fixed it by removing :"custom:color" , "custom:textsize" and "custom:multiline" in xml file. then in Java I put this:

mSeekBar =  (ComboSeekBar) findViewById(R.id.seekbar);
List<String> seekBarStep = Arrays.asList("All","1","5","10","20");
mSeekBar.setAdapter(seekBarStep);

Hope this will help

Answer 3

This is just a seekbar with a custom thumb and background. You could use a 9patch for the background so it fills nicely and just set them in your styles