Home » Android » Android Tab Layout not taking up full width with custom view

Android Tab Layout not taking up full width with custom view

Posted by: admin June 15, 2020 Leave a comment

Questions:

Android TabLayout tabPaddingTop and tabPaddingBottom not being removed

Please refer to the above issue as well.

Even since i updated my design library to “23.2.0”, Tab layout is all messed up.

The below image is my Tab Layout.

Xml Part :-

<android.support.design.widget.TabLayout
    android:id="@+id/sliding_tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabIndicatorColor="@android:color/white"
    app:tabIndicatorHeight="@dimen/dp2"
    app:tabMode="fixed"
    app:tabSelectedTextColor="@android:color/white"
    app:tabTextAppearance="@style/MyCustomTabTextAppearance" />

styles xml :-

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/color_156084</item>
</style>

<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">@dimen/sp14</item>
    <item name="android:textColor">@android:color/white</item>
    <item name="textAllCaps">false</item>
</style>

I have set padding to -1dp and even did tabGravity to fill but nothing is working.

This code used to work in earlier versions but now if i am downgrading it, i am getting a no class def found error on TintManager.

enter image description here

How to&Answers:

Setting different values or layout params did not work, so the only solution I got was to add the following, after you add the tabs to your tab layout,

final ViewGroup test = (ViewGroup)(tabs.getChildAt(0));//tabs is your Tablayout
int tabLen = test.getChildCount();

for (int i = 0; i < tabLen; i++) {
            View v = test.getChildAt(i);
            v.setPadding(0, 0, 0, 0);
        }

Answer:

Try adding below attributes to TabLayout:

app:tabPaddingStart="-1dp"
app:tabPaddingEnd="-1dp"

Hope it’ll work.

Answer:

Instead of dealing with TabLayout subviews, you can access TabLayout.Tab view directly and set the padding to 0 just like the code below.

for (int i = 0; i < tabLayout.getTabCount(); i++) {
    View tabView = tabLayout.getTabAt(i).view;
    tabView.setPadding(0, 0, 0, 0);
}

I’m doing this in the onCreateView callback and it works perfectly.

Answer:

Try adding TabLayout in LinearLayout like:

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.design.widget.TabLayout
        android:id="@+id/sliding_tabs"
        style="@style/MyCustomTabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#FFF" />
</LinearLayout>

In Styles.xml add:

 <style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabTextAppearance">@style/MyCustomTextAppearance</item>
</style>

<style name="MyCustomTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="textAllCaps">false</item>
</style>

Answer:

Just pass your tabLayout to this method and it’s done!

private void setTabLayoutMatchParent(TabLayout tabLayout) {
    final ViewGroup tabLayoutChild = (ViewGroup)(tabLayout.getChildAt(0));
    int tabLen = tabLayoutChild.getChildCount();

    for (int j = 0; j < tabLen; j++) {
        View v = tabLayoutChild.getChildAt(j);
        v.setPadding(0, 0, 0, 0);
    }
}

Answer:

In my case the problem was giving fixed height to the custom layout that i use for tabs.
Using match_parent fixed my issue.

Answer:

I was stuck for hours until I found the method tab.setCustomView(idRes). Changing from inflated to this worked for me. Alernatively, if you are inflating you can use TabLayout.TabView as root viewgroup.

Apart from this, I am not sure if it is helpful but I used minWidth to the custom view layout.

This is what I wanted