1.简介
我们在应用viewpager的时候,经常会使用TabPageIndicator来与其配合。达到很漂亮的效果。但是TabPageIndicator是第三方的,而且比较老了,当然了现在很多大神都已经开始自己写TabPageIndicator来满足自己的需求,在2015年的google大会上,google发布了新的Android Support Design库,里面包含了几个新的控件,其中就有一个TabLayout,它就可以完成TabPageIndicator的效果,而且还是官方的,最好的是它可以兼容到2.2以上版本,包括2.2。下面我就举一个简单的例子来使用它。
使用的 android studio进行开发的,所以引用TabLayout很简单,只要在build.gradle中加入 compile 'com.android.support:design:23.3.0'即可。
2.引用库
compile 'com.android.support:design:24.2.1'
布局
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <include layout="@layout/titlebar" /> <android.support.design.widget.TabLayout android:id="@+id/tabLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/holo_blue_bright" app:tabIndicatorColor="@android:color/background_dark" app:tabSelectedTextColor="@android:color/background_dark" app:tabTextColor="@android:color/white" /> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout>
定义和创建MyFragment
/** * 项目名:Software_Framework * 包名:com.chengdong.software_framework.TableLayout.Fragmnet * 文件名:MyFragment * 创建者:周成东 * 创建时间:2017/9/15 22:46 * 描述:ToDo */ public class MyFragment extends Fragment { private String title; public String getTitle() { return title; } public String getContent() { return content; } private String content; private TextView textView; private Context context; public MyFragment(String title, String content) { this.title = title; this.content = content; } @Override public void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); this.context = getActivity(); } /** * 綁定數據 * * @param savedInstanceState */ @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { textView.setText(content); super.onActivityCreated(savedInstanceState); } @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { textView = new TextView(context); textView.setTextSize(18); textView.setTextColor(Color.RED); textView.setGravity(Gravity.CENTER); return textView; } }
设置viewpager适配器
public class TalbeLayoutAdapter extends FragmentPagerAdapter { private final ArrayList<MyFragment> mFragments; public TalbeLayoutAdapter(FragmentManager fm, ArrayList<MyFragment> myFragments) { super(fm); this.mFragments=myFragments; } @Override public Fragment getItem(int position) { return mFragments.get(position); } @Override public int getCount() { return mFragments.size(); } @Override public CharSequence getPageTitle(int position) { return mFragments.get(position).getTitle(); } }
设置TableLayoutActivity
public class TableLayoutActivity extends FragmentActivity { @Bind(R.id.tv_title) TextView tvTitle; @Bind(R.id.tabLayout) TabLayout tabLayout; @Bind(R.id.viewPager) ViewPager viewPager; private ArrayList<MyFragment> myFragments; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_tab_layout_main); ButterKnife.bind(this); tvTitle.setText("TableLayout的使用"); myFragments = new ArrayList<>(); for(int i=0;i<12;i++){ myFragments.add(new MyFragment("标题"+i,"内容"+i)); } TalbeLayoutAdapter adapter=new TalbeLayoutAdapter(getSupportFragmentManager(),myFragments); viewPager.setAdapter(adapter); tabLayout.setupWithViewPager(viewPager); tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE); } }