1. 程式人生 > >ViewPager pagerTitleStrip pagerTabStrip 解釋。pagerTabStrip 屬性方法 。以及 結合 使用示例與程式碼

ViewPager pagerTitleStrip pagerTabStrip 解釋。pagerTabStrip 屬性方法 。以及 結合 使用示例與程式碼

  • pagerTabStrip 相對於 pagerTitleStrip 有互動作用,功能也更加豐富

pagerTabStrip 的屬性和方法

在這裡插入圖片描述

在這裡插入圖片描述示例:

示例原始碼:有 pagerTabStrip 和 pagerTitleStrip 的使用,pagerTitleStrip 在程式碼裡註釋掉了。

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

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

        <!--<android.support.v4.view.PagerTitleStrip-->
        <!--android:id="@+id/pagerTitleStrip"-->
        <!--android:layout_width="match_parent"-->
        <!--android:layout_height="wrap_content"/>-->


        <android.support.v4.view.PagerTabStrip
            android:id="@+id/pagerTabStrip"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"></android.support.v4.view.PagerTabStrip>


    </android.support.v4.view.ViewPager>
</LinearLayout>

layout1.xml 還有剩下的3個一樣的佈局,此處省略

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="頁面1"
        android:textSize="30sp" />
</LinearLayout>

MyViewPagerAdapter

public class MyViewPagerAdapter extends PagerAdapter {
    private List<View> datas;
    private List<String> titles;
    public MyViewPagerAdapter(List<View> datas,List<String> titles)
    {
        this.datas = datas;
        this.titles = titles;
    }

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return titles.get(position);
    }

    // 返回頁卡數量
    @Override
    public int getCount() {
        return datas.size();
    }

    // 判斷 View 是否來自 Object
    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object o) {
        return view == o;
    }

    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        container.addView(datas.get(position));
        return datas.get(position);
    }

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView(datas.get(position));
    }
}

MainActivity

public class MainActivity extends AppCompatActivity{

    private ViewPager viewPager;
    private List<View> datas;
    private MyViewPagerAdapter myViewPagerAdapter;
//    private PagerTitleStrip pagerTitleStrip;
    private PagerTabStrip pagerTabStrip;
    private List<String> titles;

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

// pagerTitleStrip 設定
//        pagerTitleStrip = findViewById(R.id.pagerTitleStrip);

// pagerTabStrip 設定
        pagerTabStrip = findViewById(R.id.pagerTabStrip);
        pagerTabStrip.setDrawFullUnderline(false);
        pagerTabStrip.setTabIndicatorColor(Color.WHITE);
        pagerTabStrip.setTextColor(Color.GREEN);
        pagerTabStrip.setTextSize(1,24);
        pagerTabStrip.setBackgroundResource(android.R.drawable.screen_background_light_transparent);


// 初始佈局
        initDatas();
// 介面卡
        myViewPagerAdapter = new MyViewPagerAdapter(datas,titles);
        viewPager.setAdapter(myViewPagerAdapter);


    }

    private void initDatas() {
        datas = new ArrayList<>();
        titles = new ArrayList<>();

        View view1 = LayoutInflater.from(this).inflate(R.layout.layout1,null);
        View view2 = LayoutInflater.from(this).inflate(R.layout.layout2,null);
        View view3 = LayoutInflater.from(this).inflate(R.layout.layout3,null);
        View view4 = LayoutInflater.from(this).inflate(R.layout.layout4,null);
        datas.add(view1);
        datas.add(view2);
        datas.add(view3);
        datas.add(view4);

        titles.add("第一頁");
        titles.add("第二頁");
        titles.add("第三頁");
        titles.add("第四頁");



    }

}