by bhargavms

bhargavms / PodSLider

A UI slider widget for android

127 Stars 29 Forks Last release: over 4 years ago (1.2.0) 60 Commits 9 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:


Android Arsenal Release Awesome


Sample Gif Sample Gif

A slider view.

This project is an attempt to port the svg pod slider created by Chris Gannon to android. see CodePen

version 1.2.0 Update:

  • Major enhancements in how animations are done.
  • Added a ease out elastic effect(a wobble effect just before the circles stop).


Add it to your project build.gradle with:

allprojects {
    repositories {
        maven { url "https://jitpack.io" }

and to your module's build.gradle dependencies block add the dependency to the library:

P.S Check Jitpack badge at the top of the readme for the latest version name.

dependencies {
    compile 'com.github.bhargavms:PodSLider:X.X.X'


Xml Attributes


Setting a click listener

PodSlider podSlider = (PodSlider) findViewById(R.id.pod_slider);
podSlider.setPodClickListener(new OnPodClickListener() {
    public void onPodClick(int position) {
        Log.d("PodPosition", "position = " + position);

To set Currently selected Pod

// if you want to change selected pod and also animate
// then use the below method, But please remember to use this only after
// the view has been rendered (i.e donot use this in onCreate()/onCreateView()
// this will cause the large and medium circle to be drawn at (0, height/2)

To set up with a ViewPager

By default, the widget uses the String returned by the viewpager adapter's

method, to disable it just set
as false, before setting up with viewPager
ViewPager pager = (ViewPager) findViewById(R.id.pager);
PodSlider pagerSlider = (PodSlider) findViewById(R.id.pager_slider);
PodPagerAdapter adapter = new PodPagerAdapter(getSupportFragmentManager());

To change the number of pods programatically


To set custom text

// Use this after setting number of pods and make sure the length of texts 
// array is equal to or greater than `numberOfPods` that you set using `setNumberOfPods()`
podSlider.setPodTexts(new String[]{"A", "B", "C", "D", "E", "F", "G", "H", "I", "J"});

(ideally use single character don't ever have texts with more than 1 char looks ugly)

To set Drawables

Drawable access = getResources().getDrawable(R.drawable.ic_accessibility_black_24dp);
Drawable account = getResources().getDrawable(R.drawable.ic_account_circle_black_24dp);
Drawable car = getResources().getDrawable(R.drawable.ic_directions_car_black_24dp);
// Use this after setting number of pods and make sure the length 
// of drawables array is equal to or greater than `numberOfPods`
// that you set using `setNumberOfPods()`
        new Drawable[]{
                access, account, car,
                access, account, car,
                access, account, car,
        }, PodSlider.DrawableSize.FIT_POD_CIRCLE

I have not added (and do not plan to in the near future) support for passing in drawable resource Ids, loading the drawable from resource/creating it from bitmaps or whatever is left to you, if you want further customization on deciding the size of the drawable please open an issue, based on the amount of traction it receives I might decide to implement it.

LICENSE: (Apache 2.0)

Copyright [2016] [Bhargav M S]

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at


Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.