Question

I normally google and research things before asking questions, but this time I failed to find answer in a normal way, so I had to seek your assistance, fellow programmers.

I'm using ViewPagerIndicator, TabPageIndicator class in particular and want to achieve following without modification of library: removing test labels from tabs and horizontally centering icon. While first part is quite trivial (just return null from getPageTitle()), the second one left me baffled, as I'm unable to find presumably obvious way to position icons in the center apart from use of margin parameter, which is totally wrong and unacceptable, as you can imagine.

The most obvious, setting gravity in vpi_styles.xml, did not work:

<style name="Widget.TabPageIndicator" parent="Widget">
    <item name="android:gravity">center_horizontal|center_vertical</item>
    <item name="android:background">@drawable/vpi__tab_indicator</item>
    <item name="android:paddingLeft">22dip</item>
    <item name="android:paddingRight">22dip</item>
    <item name="android:paddingTop">12dp</item>
    <item name="android:paddingBottom">12dp</item>
    <item name="android:textAppearance">@style/TextAppearance.TabPageIndicator</item>
    <item name="android:textSize">12sp</item>
    <item name="android:maxLines">1</item>
    <item name="android:width">60dp</item>
    <item name="android:height">48dp</item>
    <item name="android:layout_marginLeft">40dp</item>
</style>

<style name="Widget.IconPageIndicator" parent="Widget">
    <item name="android:gravity">center_horizontal|center_vertical</item>
</style>
Was it helpful?

Solution 2

I have modified the ViewPagerIndicator Lib, and add support for IconsOnly tabs
https://github.com/JafarKhQ/Android-ViewPagerIndicator

OTHER TIPS

Unfortunately it seems like I haven't searched thoroughly enough: I used second answer from here and received needed effect by modifying TabPageIndicator.java file:

Changed

tabView.setCompoundDrawablesWithIntrinsicBounds(iconResId, 0, 0, 0);

to

tabView.setCompoundDrawablesWithIntrinsicBounds(0, iconResId, 0, 0);

and my icon got centered.

What I have done was create a copy of TabPageIndicator and make the necessary changes to represent only Icons and center in the cell.

To use this just copy IconCenterPageIndicator.java from this gist

https://gist.github.com/pedrolaranjeiro/2a0aac0723e44e54c621

to com.viewpagerindicator and follow the XML and the adapter examples to achieve what you are looking for.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top