How to make a dot for highlighted title in PagerTitleStrip in android

Question

I am using PagerTitleStrip for swiping Fragment, I need to make a dot for selected item or Highlighted title. My XML Code :

<android.support.v4.view.PagerTitleStrip
            android:id="@+id/pager_title_strip"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:background="#fff"
            android:paddingBottom="6dp"
            android:paddingTop="6dp"
            android:textColor="@color/blueColorSwipeText" />

I also need to change the highlighted title color. Please help me out. Thanks Suggestions appreciated.

Answer 1

Use the textColor attribute; Create a new style in res/values/styles.xml:

<style name="Pager">
    <item name="android:textColor">#4DB849</item>
    <item name="android:indicatorColor">#E95044</item>
</style>

You will get a green title and a red indicator.

You may want to see ViewPagerIndicator

To change the indicator you have to change onDraw(Canvas canvas) method.
Here is the source code PagerTabStrip.java.

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    final int height = getHeight();
    final int bottom = height;
    final int left = mCurrText.getLeft() - mTabPadding;
    final int right = mCurrText.getRight() + mTabPadding;
    final int top = bottom - mIndicatorHeight;

    mTabPaint.setColor(mTabAlpha << 24 | (mIndicatorColor & 0xFFFFFF));
    canvas.drawRect(left, top, right, bottom, mTabPaint);

    if (mDrawFullUnderline) {
        mTabPaint.setColor(0xFF << 24 | (mIndicatorColor & 0xFFFFFF));
        canvas.drawRect(getPaddingLeft(), height - mFullUnderlineHeight,
                getWidth() - getPaddingRight(), height, mTabPaint);
    }
}

You have to change this line:

canvas.drawRect(left, top, right, bottom, mTabPaint);

Test if you get a dot when replacing with:

canvas.drawCircle(left, top, 15, mTabPaint);

For drawing custom views check out the Android documentation.

Custom Drawing