ViewPagerIndicator - TabPageIndicator page titles randomly get split into 2 lines

Question

Sometimes the page title in TabPageIndicator is split into 2 lines, sometimes as whole words and sometimes as broken words. Here are some screen shots

1) Split into 2 lines - broken words

2) Split into 2 lines - whole words

3) Not split into 2 lines

Here is my layout code:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.viewpagerindicator.TabPageIndicator
        android:layout_width="fill_parent"
        android:layout_height="45dp"
        android:layout_gravity="top"
        android:paddingTop="2dp"
        android:layout_marginBottom="2dp" />

    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="fill_parent">
    </android.support.v4.view.ViewPager>
</LinearLayout>

Here is my style code:

<style name="CustomTabPageIndicator">
    <item name="footerColor">@color/brand</item>
    <item name="android:colorBackground">@color/white</item>
    <item name="footerLineHeight">1dp</item>
    <item name="footerIndicatorHeight">3dp</item>
    <item name="android:textColor">#FF555555</item>
    <item name="android:textSize">13sp</item>
    <item name="android:dividerPadding">5dp</item>
    <item name="android:layerType">software</item>
    <item name="android:showDividers">none</item>
    <item name="android:fadingEdge">horizontal</item>
    <item name="android:fadingEdgeLength">8dp</item>
    <item name="selectedColor">#FF000000</item>
    <item name="selectedBold">true</item>
    <item name="android:gravity">center</item>
    <item name="android:typeface">normal</item>
    <item name="android:background">@drawable/custom_tab_indicator</item>
    <item name="android:paddingLeft">10dip</item>
    <item name="android:paddingRight">10dip</item>
    <item name="android:paddingTop">4dp</item>
    <item name="android:paddingBottom">4dp</item>
</style>

Can anyone tell me whats wrong here which causes the page titles to randomly split into 2 lines and sometimes not?

Answer 1

Try adding this line in your style code...

  <item name="android:maxLines">1</item>

Or

UPDATE

have you tried addingsingleLine=true" in styles ?

Answer 2

In TabPageIndicator.java file

 mTabLayout.addView(tabView, new LinearLayout.LayoutParams(0, MATCH_PARENT, 1));

Instead of above add this line of code and it will make text wrap

mTabLayout.addView(tabView, new LinearLayout.LayoutParams(WRAP_CONTENT, MATCH_PARENT, 1));