1. 程式人生 > 其它 >Android --ViewPager元件的使用(含案例),滑動切換頁面, PagerAdapter類

Android --ViewPager元件的使用(含案例),滑動切換頁面, PagerAdapter類

PagerAdapter類

  • getCount() :獲得viewpager中有多少個view
  • instantiateItem() :(1)將給定位置的view新增到ViewGroup(容器)中,建立並顯示出來(2)返回一個代表新增頁面的Object(key) ,通常都是直接返回view本身就可以了,當然你也可以自定義自己的key,但是key和每個view要一一對應
  • isViewFromObject() :判斷instantiateItem(ViewGroup,int)函式所返回來的Key與一個頁面檢視是否是代表的同一個檢視(即它們是否是對應的,對應的表示同一個View),通常我們直接寫 return view==object
  • destoryItem() :移除一個給定位置的頁面。介面卡有責任從容器中刪除這個檢視。這是為了確保在finishUpdate(viewGroup)返回時檢視能夠被移除。而另外兩個方法則是涉及到一個Key的東西

步驟:

1、Layout:主頁面中呼叫 ViewPager,編寫各滑動頁面

2、Activity:把滑動的頁面存到List並傳到 介面卡

3、介面卡Adapter:繼承PagerAdapter

1、Layout:主頁面中呼叫 ViewPager,編寫各滑動頁面

activity_view_pager.xml
<?xml version="1.0" encoding="utf-8"
?> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" xmlns:android="http://schemas.android.com/apk/res/android"> <androidx.viewpager.widget.ViewPager android:layout_height="match_parent" android:layout_width="match_parent" android:id
="@+id/vp"/> </LinearLayout>
view_pager_layout_1.xml
<?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:background="#ffaaffcc">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="layout1"/>

</LinearLayout>
view_pager_layout_2.xml
<?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:background="#ffaaccff">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="layout2"/>

</LinearLayout>
view_pager_layout_3.xml
<?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:background="#ffaaccff">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="layout2"/>

</LinearLayout>

2、Activity:把滑動的頁面存到List並傳到 介面卡

package xyz.lushangg.t8;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;

import java.util.ArrayList;
import java.util.List;

import xyz.lushangg.t8.R;
import xyz.lushangg.t8.viewPager.ViewPagerAdapter;

public class ViewPagerActivity extends AppCompatActivity {

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

        LayoutInflater lf = getLayoutInflater().from(this);
        View view1 = lf.inflate(R.layout.view_pager_layout_1,null);
        View view2 = lf.inflate(R.layout.view_pager_layout_2,null);
        View view3 = lf.inflate(R.layout.view_pager_layout_3,null);

        List<View> viewList=new ArrayList<>();
        viewList.add(view1);
        viewList.add(view2);
        viewList.add(view3);

        ViewPager viewPager = findViewById(R.id.vp);
        ViewPagerAdapter viewPagerAdapter=new ViewPagerAdapter(viewList);
        viewPager.setAdapter(viewPagerAdapter);


    }
}

3、介面卡Adapter:繼承PagerAdapter

package xyz.lushangg.t8.viewPager;

import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;

import java.util.List;

public class ViewPagerAdapter extends PagerAdapter {

    private List<View> mListView;

    public ViewPagerAdapter(List<View> mListView){
        this.mListView=mListView;
    }

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



    @Override
    public int getCount() {
        return mListView.size();
    }

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

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {

        container.removeView(mListView.get(position));
    }
}
結果展示:
滑動過程1頁面:

滑動成功後的頁面: