Android: How to fill tabs with scrolling in custom tabLayout?

Question

I have a tablayout with 6 tabs. Tabs are fixed in the display but their text does not show completely. I do the solutions in here so that I can summarize them in these lines:

<android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMaxWidth="0dp"
        app:tabGravity="fill"
        app:tabMode="fixed" />

But it did not solve my problem. I also use custom TabLayout in here and still I have the same problem.

Here are my codes:
I use a custom tablayout with this custom_tab.xml file:

   <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <ImageView
            android:layout_width="22dp"
            android:layout_height="22dp"
            android:layout_gravity="center"
            android:layout_marginTop="8dp"
            android:layout_centerHorizontal="true"
            android:id="@+id/tabIcon"/>

        <CustomViews.CustomTextView
            android:id="@+id/basket_badge"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="15dp"
            android:background="@drawable/notification_circle"
            android:padding="2dp"
            android:textColor="#ffffff"
            android:textSize="8sp" />
        <CustomViews.CustomTextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/tab_inactive"
            android:textSize="8sp"
            android:layout_centerHorizontal="true"
            android:layout_below="@id/tabIcon"
            android:layout_marginBottom="2dp"
            android:maxLines="1"
            android:id="@+id/tabTitle"/>

    </RelativeLayout>

The first ImageView shows the tab icon. The next ImageView is used for the badge and the CustomTextView is used for showing the tab title.
Here is my layout file include tablayout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical">

    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        app:tabMode="scrollable"
        app:tabMaxWidth="0dp"
        android:layoutDirection="rtl"
        android:id="@+id/avatar_tabLayout"
        app:tabIndicatorColor="@null"
        />    
</LinearLayout>

Is there a way to set up tab width with Maximum existence tab size? Or any other solutions?

Do you want your tab layouts to be scrollable or not scrollable? — Red M, Jun 06 '18 at 19:25

score 0 · Accepted Answer · answered Jun 09 '18 at 16:16

0

Try to get rid off

app:tabGravity="fill"
app:tabMode="fixed"

in your <android.support.design.widget.TabLayout

Replace it with app:tabMode="scrollable"

answered Jun 09 '18 at 16:16

Red M

2,163
3
20
40

Android: How to fill tabs with scrolling in custom tabLayout?

1 Answers1