Viewpager+Tablayout

转载地址

## 前言 ##
楼主目前还属于小菜啊 有什么问题欢迎指教.
效果展示
Viewpager+Tablayout_第1张图片Viewpager+Tablayout_第2张图片
通过setOnTabSelectedListener设置一个监听器来响应选项卡的选择状态 可以通过setTabsFromPagerAdapter来使用PagerAdapter的page title

布局文件xml

"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"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
 tools:context="com.example.administrator.tablayoutandviewpagerapplication.MainActivity"
    tools:showIn="@layout/activity_main">
    .support.design.widget.TabLayout 
        android:id="@+id/tab1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="center"
        app:tabIndicatorColor="#FF00FF00"
        app:tabMode="scrollable"
        app:tabSelectedTextColor="#FF00FF00"
        app:tabTextColor="#FF000000">
    .support.design.widget.TabLayout>

    .support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

布局里只有一个 Tablayout控件 参数 里边有几个属性这里说明一下

  app:tabIndicatorColor="#FF00FF00"                         // 下方滚动的下划线颜色
        app:tabSelectedTextColor="#FF00FF00"               // tab被选中后,文字的颜色
        app:tabTextColor="#FF000000"                      // tab默认的文字颜色

代码

public class MainActivity extends AppCompatActivity {
    PagerAdapter mpageadpter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.content_main);

        TabLayout tabLayout = (TabLayout) findViewById(R.id.tab1); //tablayout控件找id

        final String[] mTitle = new String[4];
        final String[] mData = new String[4];

        {
            for (int i = 0; i < 4; i++) {
                mTitle[i] = "标题" + i;
                mData[i] = "第" + i+"页";
            }
        }
        final ViewPager viewPager = (ViewPager) findViewById(R.id.vp);//viewpager控件找id


        mpageadpter = new PagerAdapter() {
            @Override
            public CharSequence getPageTitle(int position) { //设置顶部的页面标题

                return mTitle[position];
            }

            @Override
            public int getCount() { //设置数据的大小长度
                return mData.length;
            }


            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                ((ViewPager) container).removeView((View) object); //销毁 视图
            }

            @Override //初始化视图
            public Object instantiateItem(View container, int position) {
                TextView textView = new TextView(MainActivity.this); //定义一个textview 控件
                textView.setText(mData[position]); //显示下边的数据 
                textView.setTextSize(30.f);//设置字体大小
                ((ViewPager) container).addView(textView);  //添加进布局
                return textView;
            }

            @Override
            public boolean isViewFromObject(View view, Object object) {
                return view == object;
            }
        };

        tabLayout.setTabsFromPagerAdapter(mpageadpter);//第二步,设置Tab的标题来自PagerAdapter.getPageTitle()。
        viewPager.setAdapter(mpageadpter);
        tabLayout.setupWithViewPager(viewPager);//这个方法是addOnPageChangeListener和setOnTabSelectedListener的封装。
    }
}

你可能感兴趣的:(2016-7月,Viewpager)