Custom Indicators

Basic Usage

Add the following xml to your layout:

<com.daimajia.slider.library.Indicators.PagerIndicator
		android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
/>

Customizable Properties

Property	Description
shape	oval | rect
visibility	visible | invisible
selected_drawable unselected_drawable	You can use an image or custom drawable as the indicator. If you decide to use your own drawable, then the built-in drawable and the properties associated with the built-in drawable will not work.
selected_color unselected_color	the color of the indicator
selected_width unselected_width	the width of the shape
selected_height unselected_height	the height of the shape
selected_padding_left unselected_padding_left selected_padding_right unselected_padding_right selected_padding_top unselected_padding_top selected_padding_bottom unselected_padding_bottom	the padding of the indicator

Examples

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        custom:selected_color="#555555"
        custom:unselected_color="#55555555"
        custom:shape="oval"
        custom:selected_padding_left="3dp"
        custom:selected_padding_right="3dp"
        custom:unselected_padding_left="3dp"
        custom:unselected_padding_right="3dp"
        custom:selected_width="8dp"
        custom:selected_height="8dp"
        custom:unselected_width="4dp"
        custom:unselected_height="4dp"
        />

---

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        custom:selected_color="#FF5500"
        custom:unselected_color="#55333333"
        custom:shape="rect"
        custom:selected_padding_left="2dp"
        custom:selected_padding_right="2dp"
        custom:unselected_padding_left="2dp"
        custom:unselected_padding_right="2dp"
        custom:selected_width="16dp"
        custom:selected_height="3dp"
        custom:unselected_width="16dp"
        custom:unselected_height="3dp"
        />

---

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        custom:selected_color="#0095BF"
        custom:unselected_color="#55333333"
        custom:shape="rect"
        custom:selected_padding_left="2dp"
        custom:selected_padding_right="2dp"
        custom:unselected_padding_left="2dp"
        custom:unselected_padding_right="2dp"
        custom:selected_width="6dp"
        custom:selected_height="6dp"
        custom:unselected_width="6dp"
        custom:unselected_height="6dp"
        />

---

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        custom:selected_color="#0095BF" 
        custom:unselected_color="#55333333"
        custom:selected_drawable="@drawable/bird"
        custom:shape="oval"
        custom:selected_padding_left="6dp"
        custom:selected_padding_right="6dp"
        custom:unselected_padding_left="2dp"
        custom:unselected_padding_right="2dp"
        custom:selected_width="6dp"
        custom:selected_height="6dp"
        custom:unselected_width="6dp"
        custom:unselected_height="6dp"
        />

NOTE: Because a custom image is used for the indicator, following properties will not work:

• custom:selected_color
• custom:selected_width
• custom:selected_height
• custom:shape
• custom:color
• custom:width
• custom:height

Preset Styles

Source is here.

Preset-1:

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        style="@style/AndroidImageSlider_Magnifier_Oval_Black"
        />

---

Preset-2:

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        style="@style/AndroidImageSlider_Attractive_Rect_Blue"
        />

---

Preset-3:

    <com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        style="@style/AndroidImageSlider_Corner_Oval_Orange"
        />

Using the View

Bind it with a SliderLayout instance.

slider.setCustomIndicator((PagerIndicator) findViewById(R.id.custom_indicator));

If you have a better indicator idea, please feel free to email me, or submit a issue. :-D