23.商品列表（TabLayout的使用）

实现步骤：

1.首先加入dependence依赖（这个需要根据你自己的appcompent的版本来导入，比如

compile 'com.android.support:appcompat-v7:23.2.0'

），就要导入23.2.0的tablayout的架包以及在布局中使用TabLayout

compile 'com.android.support:design:23.2.0'

*********************不能用上面的依赖，会使得布局文件出现显示异常，不会报错，但是会有奇怪的东西显示，应该用下面的版本，要两者版本相同

compile 'com.android.support:design:23.0.1'
compile 'com.android.support:appcompat-v7:23.0.1'

2.编写含有TabLayout的布局文件，然后在Activity中加载这个布局，然后初始化TabLayout,并且赋值

TabLayout布局页面：

<?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"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <zuo.com.ui.widget.ByToolBar
        android:id="@+id/tool_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        app:isShowSearchView="false"
        app:contentInsetEnd="56dp"
        app:title="商品列表"/>
    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        style="@style/customTabLayout"
        app:tabGravity="fill"
        app:tabMode="fixed"
        >

    </android.support.design.widget.TabLayout>
<!--显示在tablayout下面的文字-->
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:minHeight="30dp"
        android:gravity="center_vertical"
        android:padding="5dp"
        android:background="@color/material_yellow">


        <TextView
            android:id="@+id/txt_summary"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/black"/>


    </LinearLayout>
    <!--下面就是下拉刷新和recyclerview-->
    <com.cjj.MaterialRefreshLayout
        android:id="@+id/refresh_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:overlay="false"
        app:wave_show="false"
        app:wave_color="#90ffffff"
        app:progress_colors="@array/material_colors"
        app:wave_height_type="higher"
        >


        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent">


        </android.support.v7.widget.RecyclerView>


    </com.cjj.MaterialRefreshLayout>


</LinearLayout>

在style中tablayout的样式：

<!--TabLayout的样式-->
    <style name="customTabLayout" parent="Widget.Design.TabLayout">
        <!--<item name="tabMaxWidth">@dimen/tab_max_width</item>-->
        <item name="tabIndicatorColor">#eb4f38</item>
        <item name="tabIndicatorHeight">2dp</item>
        <item name="tabPaddingStart">12dp</item>
        <item name="tabPaddingEnd">12dp</item>
        <item name="tabBackground">@color/white</item>
        <item name="tabTextAppearance">@style/customTabTextAppearance</item>
        <item name="tabSelectedTextColor">#eb4f38</item>
    </style>
    <style name="customTabTextAppearance" parent="TextAppearance.Design.Tab">
        <item name="android:textSize">14sp</item>
        <item name="android:textColor">@color/black</item>
        <item name="textAllCaps">true</item>
    </style>

3.在Activity中使用tablayout:

public class TabListActivity extends AppCompatActivity {
    private TabLayout tabLayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.layout_tab_list_activity);
        tabLayout= (TabLayout) findViewById(R.id.tab_layout);

        initTab();
    }
    private void initTab(){
           TabLayout.Tab tab=tabLayout.newTab();
            tab.setText("默认");
        tabLayout.addTab(tab);

         tab=tabLayout.newTab();
        tab.setText("价格");
        tabLayout.addTab(tab);

         tab=tabLayout.newTab();
        tab.setText("销量");
        tabLayout.addTab(tab);

    }
}

4.在recyclerview中运用以前的技术，显示数据

5.******************根据tablayout的点击事件，不同的点击事件可以获取不同的值，然后根据不同的值，传入到recycerview的adapter中，执行相应的操作,代码如下：

public class TabListActivity extends AppCompatActivity implements View.OnClickListener, TabLayout.OnTabSelectedListener {
    private int campaignId=0;
    private int orderBy=0;
    private int curPage=1;
    private int pageSize=10;

    private OkHttpHelper httpHelper=OkHttpHelper.getInstance();

    private TabLayoutBean tabLayoutBean;

    private TabLayout tabLayout;
    private Toolbar toolbar;
   private RecyclerView recyclerView;
    private TabLayoutAdapter tabLayoutAdapter;

    private TextView textView;

    private MaterialRefreshLayout materialRefreshLayout;

    //切换tablayout时候，需要标记的状态
    public static final int TAG_DEFAULT=0;
    public static final int TAG_SALE=1;
    public static final int TAG_PRICE=2;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.layout_tab_list_activity);
        tabLayout= (TabLayout) findViewById(R.id.tab_layout);
        toolbar= (Toolbar) findViewById(R.id.toolbar);
        recyclerView= (RecyclerView) findViewById(R.id.recycler_view);
        textView= (TextView) findViewById(R.id.txt_summary);
        materialRefreshLayout= (MaterialRefreshLayout) findViewById(R.id.refresh_layout);
        toolbar.setNavigationOnClickListener(this);
        initIntent();
        initTab();
        initTabLayoutData();
        initMaterialLayout();

    }
    //抓取homefragment传来的Intent数据
    private void initIntent(){
        Intent intent=getIntent();
        Bundle bundle=intent.getExtras();
        //campaignId=bundle.getInt("ID")-10;
      //  Log.d("123123",bundle.getInt("ID")+"");
        if(bundle.getInt("ID")>10){
            campaignId=bundle.getInt("ID")-10;
        }else{
            campaignId=bundle.getInt("ID");

        }
    }
    private void initTab(){
           TabLayout.Tab tab=tabLayout.newTab();
            tab.setText("默认");
        tab.setTag(TAG_DEFAULT);
        tabLayout.addTab(tab);

         tab=tabLayout.newTab();
        tab.setText("销量");
        tab.setTag(TAG_SALE);
        tabLayout.addTab(tab);

         tab=tabLayout.newTab();
        tab.setText("价格");
        tab.setTag(TAG_PRICE);
        tabLayout.addTab(tab);

        tabLayout.setOnTabSelectedListener(this);

    }
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        orderBy = (int) tab.getTag();
        initTabLayoutData();

    }

    @Override
    public void onTabUnselected(TabLayout.Tab tab) {

    }

    @Override
    public void onTabReselected(TabLayout.Tab tab) {

    }

效果图：