天天看點

Android TabLayout加強版SlidingTabLayout

衆所周知TabLayout純在很多問題和不足,是以各路神仙對其各種修改,在GitHub上比較被肯定三個TabLayout其中一個就是

SlidingTabLayout,接下來我簡單介紹一下使用:

首先:依賴和XML配置

//FlycoTabLayout //進階tablayout 
    compile 'com.flyco.tablayout:FlycoTabLayout_Lib:[email protected]'
           
<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/theme_color"
        android:orientation="vertical"
        android:paddingBottom="20px">

        <com.flyco.tablayout.SlidingTabLayout
            android:id="@+id/fragment_discover_tablayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/theme_color"
            android:paddingBottom="20px"
            android:paddingLeft="20px"
            android:paddingRight="20px"
            android:paddingTop="10px"

            app:tl_indicator_color="@color/white"
            app:tl_indicator_corner_radius="6px"
            app:tl_indicator_height="6px"
            app:tl_indicator_width_equal_title="true"
            app:tl_tab_padding="20px"
            app:tl_textSelectColor="@color/white"
            app:tl_textUnselectColor="@color/white"
            app:tl_textsize="17sp"


            />

    </LinearLayout>
    
    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="1px"
        android:id="@+id/fragment_discover_vp"/>
           

tablayout高度寫死可以拉開橫條和字的距離

這邊注意了   一個1像素的ViewPager,  這是SlidingTabLayout必須要有的 GitHub上有說明.

我用不到ViewPager但是為了不讓它報錯,這邊寫了一個一像素高的ViewPager;

你如果問我,SlidingTabLayout這麼麻煩,為什麼還要使用它? !      是因為訓示器!!! 弧度! 長短! 距離!   原生的能行嗎?!!!

定義和配置:

private SlidingTabLayout mTabLayout;
private ViewPager viewPager;
           
mTabLayout = view.findViewById(R.id.fragment_discover_tablayout);
//1像素高的ViewPager 意圖适配SlidingTabLayout
viewPager = view.findViewById(R.id.fragment_discover_vp); 
viewPager.setAdapter(new FragmentPagerAdapter(getActivity().getSupportFragmentManager()) {

                    @Override
                    public Fragment getItem(int position) {
                        return new mFragment_user();
                    }

                    @Override
                    public int getCount() {
                        return mTitles.size();
                    }

                    //ViewPager與TabLayout綁定後,這裡擷取到PageTitle就是Tab的Text
                    @Override
                    public CharSequence getPageTitle(int position) {
                        return mTitles.get(position).getCategory();
                    }

                });
                mTabLayout.setViewPager(viewPager);
                if (mTitles.size() > 1) {
                    mTabLayout.setCurrentTab(1);// todo  預設選中 //第一次加載設定預設
                }
           

這樣就完事了,監聽什麼的就不說了.

源碼位址:https://github.com/H07000223/FlycoTabLayout