TabLayout: set tabwidth depends on text size individual tabs

Question

I'm trying to implement the tablayout, I would like to set width of the tab depending on text content in individual tabs, right now it is set equally, which results on small text, tab width feels higher.

Answer 1

Try this:

public void wrapTabIndicatorToTitle(TabLayout tabLayout, int externalMargin, int internalMargin) {
    View tabStrip = tabLayout.getChildAt(0);
    if (tabStrip instanceof ViewGroup) {
        ViewGroup tabStripGroup = (ViewGroup) tabStrip;
        int childCount = ((ViewGroup) tabStrip).getChildCount();
        for (int i = 0; i < childCount; i++) {
            View tabView = tabStripGroup.getChildAt(i);
            //set minimum width to 0 for instead for small texts, indicator is not wrapped as expected
            tabView.setMinimumWidth(0);
            // set padding to 0 for wrapping indicator as title
            tabView.setPadding(0, tabView.getPaddingTop(), 0, tabView.getPaddingBottom());
            // setting custom margin between tabs
            if (tabView.getLayoutParams() instanceof ViewGroup.MarginLayoutParams) {
                ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) tabView.getLayoutParams();
                if (i == 0) {
                    // left
                    settingMargin(layoutParams, externalMargin, internalMargin);
                } else if (i == childCount - 1) {
                    // right
                    settingMargin(layoutParams, internalMargin, externalMargin);
                } else {
                    // internal
                    settingMargin(layoutParams, internalMargin, internalMargin);
                }
            }
        }


        tabLayout.requestLayout();
    }
}

private void settingMargin(ViewGroup.MarginLayoutParams layoutParams, int start, int end) {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
        layoutParams.setMarginStart(start);
        layoutParams.setMarginEnd(end);
    } else {
        layoutParams.leftMargin = start;
        layoutParams.rightMargin = end;
    }
}

After setting the view pager in java file add :

wrapTabIndicatorToTitle(tabLayout,60,60);

Answer 2

Try this! It will reduce your efforts.

<android.support.design.widget.TabLayout
        android:id="@+id/tblHome"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        app:tabMode="scrollable">

Answer 3

Put this below XML code for TabLayout

<android.support.design.widget.TabLayout
        android:id="@+id/tab_Layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        app:tabGravity="fill"
        app:tabMode="scrollable"
        />