SmartTabLayout
先添加smarttablayout的依赖
dependencies {
compile 'com.ogaclejapan.smarttablayout:library:1.6.1@aar'
}
或者上maven下载aar包导入项目下的libs文件夹,添加以下代码到builde.gradle
android {
repositories {
flatDir {
dirs 'libs'
}
}
}
dependencies {
compile(name: '导入文件的名字', ext: 'aar')
}
<?xml version="1.0" encoding="utf-8"?> <com.ogaclejapan.smarttablayout.SmartTabLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:background="@android:color/white" android:layout_width="match_parent" android:layout_height="40dp" android:id="@+id/smart_tab" app:stl_customTabTextLayoutId="@layout/include_title_tab" app:stl_customTabTextViewId="@+id/text_4" app:stl_indicatorColor="@android:color/holo_red_dark" app:stl_indicatorInterpolation="linear" app:stl_indicatorThickness="3dp" app:stl_underlineThickness="1dp"> </com.ogaclejapan.smarttablayout.SmartTabLayout>
<?xml version="1.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/text_4" android:layout_width="wrap_content" android:layout_height="match_parent" android:gravity="center" android:paddingLeft="24dp" android:paddingRight="24dp" android:textColor="@color/tab_color" android:textSize="16sp" android:paddingTop="5dp" android:paddingBottom="5dp"> </TextView>
通过 app:stl_customTabTextViewId="TextView的Id" 将SmartTabLayout和textview联系起来.
fragment布局
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/tabs" /> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.view.ViewPager android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/viewPager" /> </FrameLayout> </LinearLayout>
主要思路:将smartTablayout添加到frameLayout(tabs)中,然后 smartTab.setViewPager(viewPager) ,将smartTab和ViewPager进行绑定.
fragment代码
public class NewsFragment extends Fragment { ArrayList<FragmentInfo> pages = new ArrayList<FragmentInfo>(); @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInanceState) { View mNews_Fragment = inflater.inflate(R.layout.news_fragment,container,false); return mNews_Fragment; } @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); FrameLayout tabs = getActivity().findViewById(R.id.tabs); SmartTabLayout smartTab = (SmartTabLayout) View.inflate(getActivity(),R.layout.include_tab,null); tabs.addView(smartTab); String[] titles = getResources().getStringArray(R.array.news_titles); for(int i = 0;i < titles.length;i++){ if(i==0){ FragmentInfo fragmentInfo = new FragmentInfo(titles[i], new HotFragment()); pages.add(fragmentInfo); }else{ FragmentInfo fragmentInfo = new FragmentInfo(titles[i], new EmptyFragment()); pages.add(fragmentInfo); } } // ViewPager viewPager = mNews_Fragment.findViewById(R.id.viewPager); ViewPager viewPager = (ViewPager) getActivity().findViewById(R.id.viewPager); // 设置ViewPager的数据 viewPager.setAdapter(new NewsApadter(getFragmentManager(),pages)); // 将samartTab和ViewPager进行绑定 smartTab.setViewPager(viewPager); } }
adapter代码
public class NewsApadter extends FragmentStatePagerAdapter { private ArrayList<FragmentInfo> pages; public NewsApadter(FragmentManager fm, ArrayList<FragmentInfo> pages) { super(fm); this.pages = pages; } // 返回标题对应的fragment @Override public Fragment getItem(int position) { return pages.get(position).getFragment(); } @Override public int getCount() { return pages.size(); } // 返回每个pager对应的标题 @Nullable @Override public CharSequence getPageTitle(int position) { return pages.get(position).getTitle(); } }
最终效果: