SlidingTabLayout to fit the screen

Question

I am using Google\'s SlidingTabLayout. As i only have 3 tabs to be displayed, I am seeing empty space after last tab. Please screenshot below.

Answer 1

Changing the SlidingTabLayout.java file may help. However, the solution may not seem very much generic. In the SlidingTabLayout.java file, search for the method

protected TextView createDefaultTabView(Context context)

Underneath the TextView 'set' methods, type in the following code.

textView.setLayoutParams(new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.WRAP_CONTENT, 1f));

Each tab strip is merely a customized LinearLayout.

Answer 2

You can create a custom tab layout and assign it to your SlidingTabLayout to inflate.

custom_tab.xml:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:id="@+id/customTab">
  <TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/customText"/>
</FrameLayout>

In your code:

    viewPager = (ViewPager) rootView.findViewById(R.id.viewPager);
    viewPager.setAdapter(new SampleAdapter(getChildFragmentManager()));
    SlidingTabLayout tabLayout = (SlidingTabLayout)rootView.findViewById(R.id.slidingTab);
    tabLayout.setCustomTabView(R.layout.custom_tab,R.id.customText);
    tabLayout.setViewPager(viewPager);

By keeping the width to 0 dp and the weight as 1 (the number is arbitrary), the layout should take care of giving all your tabs equal screen space. This should also work for any number of tabs. You shouldn't need to modify your SlidingTabLayout.java.

Answer 3

more dynamic approach is

Edit SlidingTabLayout.java

locate private void populateTabStrip() method and replace

mTabStrip.addView(tabView);

with

 // get dimension of current layout
 DisplayMetrics display = this.getResources().getDisplayMetrics();
   int width = display.widthPixels;
        //your tab names here
        String[] tabTitles = {"tab1", "tab2", "tab3"}
        // compare max width and number of tabs's length 
        //will not fit to the maxwidth it will distribute the tabs evenly
        if(width%(width/tabTitles.length) == 0){
            mTabStrip.addView(tabView,
                    new LinearLayout.LayoutParams(width/tabTitles.length, ViewGroup.LayoutParams.WRAP_CONTENT));
        } else {
            mTabStrip.addView(tabView);
        }

Answer 4

In SlidingTabLayout.java, find

protected TextView createDefaultTabView(Context context)

and add these lines to that method:

WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display display = wm.getDefaultDisplay();
Point size = new Point();
display.getSize(size);
textView.setWidth(size.x / 3);

That fixed it for me. Basically, you're getting the width of your screen and dividing by 3 (the number of tabs) and setting that as the width for the TextField that makes up your tab.

UPDATE:

In the current source, google added a setDistributeEvenly(Boolean); method, so you can use slidingTabs.setDistributeEvenly(true); instead. When using the older source code, either use my solution above, or update to the newest source (latter is recommended).

Answer 5

Use this before setViewPager():

slidingTabs.setDistributeEvenly(true);

If you got this error Cannot resolve method 'setDistributeEvenly(boolean)', you should update your SlidingTabLayout.java and SlidingTabStrip.java from Google I/O source code:

SlidingTabLayout.java

SlidingTabStrip.java

Answer 6

in SlidingTabLayout.java under the following method, just before the return statement:

protected TextView createDefaultTabView(Context context)

I added these lines to that method:

final PagerAdapter adapter = mViewPager.getAdapter();
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT, 1.0f / adapter.getCount());
textView.setLayoutParams(param);

that is very close to the answer marked as the solution for the question, however I did not have to use the window manager.