PagerSlidingTabStrip配合使用

PagerSlidingTabStrip配合使用Fragment

TabLayout的加强版

项目地址 https://github.com/astuetz/PagerSlidingTabStrip

使用

这是一个有坑的控件，直接使用属性部分会对应不上，还会出现奔溃等一系列问题。坠入坑里一天时间，网上博客太不负责了，自己没编译一下就贴别人的，搞得我以为自己电脑有问题，测试了多台电脑证明这个坑，解决方案就是把资源拷出来使用，然后就ok了。接下来我将介绍我跳出这个坑的方法。

但不是所用控件出问题都能这么解决的，这个比较裸，有的控件的依赖资源还会代码混淆啥的，就没办法了。

1.引进依赖，将依赖资源拷贝出来

在bulid.gradle app的目录下引进如下依赖

implementation 'com.astuetz:pagerslidingtabstrip:1.0.1'

拷贝过程就是找到对应的导入的外部依赖，从这个位置，然后打开External Libraries

然后如下资源中拷贝到我们项目的对应目录下，即PagerSlidingTabStrip的class文件还有drawable和values对应的xml文件

最后就是把之前引进的依赖删除。
经过这些项目就能愉快地运行了，不会出现app:pstsDividerColor="#aaf1fa"
app:pstsIndicatorColor="#ffafff"
app:pstsUnderlineColor="@color/colorAccent"这些属性的错位，还有app:pstsShouldExpand="true"的崩溃问题

2.创建MainActivity的布局

<?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"
    tools:context=".MainActivity">

    <com.example.tingyu.pagerslidingtabstriplearn.PagerSlidingTabStrip
        android:id="@+id/tabs"
        app:pstsDividerColor="#aaf1fa"
        app:pstsIndicatorColor="#ffafff"
        app:pstsUnderlineColor="@color/colorAccent"
        app:pstsUnderlineHeight="20dp"
        android:layout_width="match_parent"
        android:layout_height="40dp">
  </com.example.tingyu.pagerslidingtabstriplearn.PagerSlidingTabStrip>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_below="@id/tabs"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v4.view.ViewPager>

</LinearLayout>

ViewPager是下部页面，会配合Fragment和上部标题栏PagerSlidingTabStrip的项进行一些滑动切换效果。

</com.example.tingyu.pagerslidingtabstriplearn.PagerSlidingTabStrip>这里是我PagerSlidingTabStrip类的地址，在自己电脑上使用只需对应上自己的目录地址。打出PagerSlidingTabStrip字样，然后安卓的提示点击一下就会自动补全。
这里有些属性我亲自试的，没问题

//分割线的上下间距，类似于paddingTop和paddingBottom
app:pstsDividerPadding=“15dp”
//tab之间分割线颜色
app:pstsDividerColor="#0011dd"
//是否平分顶部空间，true平分，false从左到右排列
app:pstsShouldExpand=“true”
//当前页面对应标签的指示线颜色
app:pstsIndicatorColor="#FFFFA500"
//指示线高度
app:pstsIndicatorHeight=“5dp”
//整个title的下划线颜色
app:pstsUnderlineColor="@color/colorAccent"
//下划线高度
app:pstsUnderlineHeight=“3dp”
//标签的背景色，只有有标签的部分才有颜色，当pstsShouldExpand为false，标签不能满屏幕时，就很丑了
app:pstsTabBackground="@color/colorAccent"
//标签左右间距
app:pstsTabPaddingLeftRight=“50dp"
//标题全是大写字母
app:pstsTextAllCaps=“true”
这个我不太清楚
pstsScrollOffset Scroll offset of the selected tab 滚动选定选项卡的偏移量

找了一个别人的图

3.创建一个Fragment

创建直接选Fragment就可以了，回生成好多，保留着三个方法暂时就够了。布局文件自己随便写一个就行，用于下边的展示。

import android.content.Context;
import android.net.Uri;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

//Fragment一般需要重写三个方法 onCreate()，onCreateView()和它的一个构造方法
public class PageFragment extends Fragment {
    // the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
    public static final String ARG_PAGE = "ARG_PAGE";

    private  int mpage;

    public PageFragment() {
        // Required empty public constructor
    }

    /**
     * Use this factory method to create a new instance of
     * this fragment using the provided parameters.
     * @return A new instance of fragment PageFragment.
     */
    public static PageFragment newInstance(int page) {
        PageFragment fragment = new PageFragment();
        Bundle args = new Bundle();
        args.putInt(ARG_PAGE, page);
        fragment.setArguments(args);
        return fragment;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
            mpage = getArguments().getInt(ARG_PAGE);
    }

    //这里需要把定义的布局联系起来
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.fragment_page, container, false);
        //给标题部分进行定义
        TextView title=(TextView) view.findViewById(R.id.title);
        title.setText("Fragment #"+mpage);

        // Inflate the layout for this fragment
        return view;
    }
}

4.构造适配器Adapter

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

public class SampleFragmentPagerAdapter extends FragmentPagerAdapter {

    final int PAGE_COUNT=3;
    private String tabTitles[]=new String[]{"1","2","3"};

    public SampleFragmentPagerAdapter(FragmentManager fm){
        super(fm);
    }
    @Override
    public Fragment getItem(int position) {
        return PageFragment.newInstance(position+1);
    }

    @Override
    public int getCount() {
        return PAGE_COUNT;
    }
    @Override
    public CharSequence getPageTitle(int position){
        return tabTitles[position];
    }
}

5.在主活动中进行相应配置

public class MainActivity extends AppCompatActivity {

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

        //找到ViewPager，适配器SampleFragmentPagerAdapter适配一下
        ViewPager viewPager=(ViewPager)findViewById(R.id.viewPager);
        viewPager.setAdapter(new SampleFragmentPagerAdapter(getSupportFragmentManager()));

        PagerSlidingTabStrip tabsStrip=(PagerSlidingTabStrip)findViewById(R.id.tabs);
        //把标题和页面联系起来
        tabsStrip.setViewPager(viewPager);
    }
}

最后效果是这样的。
后续效果后面再弄吧