1. 程式人生 > 其它 >ViewPager的使用及與Fragment的區別

ViewPager的使用及與Fragment的區別

技術標籤:Viewpager的使用和與Fragment的區別android

Viewpager的使用)

View的介紹

使用效果圖
在這裡插入圖片描述
View的介紹

Viewpager,檢視翻頁工具,提供了多頁面切換的效果。Android3.0後引入的一個UI空間,位於v4包中。低版本使用需要匯入v4包,但是現在我們開發的App一般不在相容3.0及以下的系統版本,另外現在大多數使用Androidstudio進行開發,預設匯入v7包,v7包含了v4包。

Viewpager使用起來就是我們通過建立adpter給他填充多個view,左右滑動時,切換不同的view。Google官方是建議我們使用Fragment來填充Viewpager的,這樣可以更加方便的生成每個page,以及管理每個page的宣告週期

Viewpager 直接繼承了ViewGroup,所以它是一個容器類,可以在其中新增其他的view類。
ViewPager需要一個pager Adpter介面卡類給他提供資料
ViewPager經常和Fragment一起使用,並且提供了專門的FragmentPaterAdpter和FragmentStatepagerAdpter類供Fragment中的Viewpager 使用

viewpager的用法和ListView類似
1.在activity.xml中引入控制元件

<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" tools:context=".MainActivity"> <androidx.viewpager.widget.
ViewPager android:layout_width="wrap_content" android:id="@+id/vp" android:layout_height="wrap_content"></androidx.viewpager.widget.ViewPager> </LinearLayout>

2.然後在layout檔案中,建立一個viewpager的佈局檔案

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"

    android:layout_height="match_parent">
    <TextView
        android:id="@+id/vptext"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        ></TextView>
    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"

        android:layout_height="wrap_content"></ImageView>
</LinearLayout>

3.類似於listView一樣,建立介面卡,要繼承PagerAdpter,父類的方法要重寫

import android.content.Context;
import android.text.Layout;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

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

import java.util.List;

public class Myadpter extends PagerAdapter {
    private Context context;
    private List<String> list;
    private List<Integer>list2;

    public Myadpter(Context context, List<String> list, List<Integer> list2) {
        this.context = context;
        this.list = list;
        this.list2 = list2;
    }
    //總共有幾個頁面
    @Override
    public int getCount() {
        return list.size();
    }
    //判斷一個頁面是否與instantiateItem方法返回的Object一致
    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view==object;
    }
    //銷燬一個頁面  移除一個給定位置的頁面,介面卡有責任從容器中刪除這個檢視,這個是為了確保在finishUpdate(viewGroup)返回時檢視能夠被移除。
    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        //super.destroyItem(container, position, object);
        container.removeView((View) object);
    }
    //建立一個頁面   判斷instantiateItem(ViewGroup, int)函式所返回來的Key與一個頁面檢視是否是代表的同一個檢視,通常
    //我們直接寫return view == object;就可以了

    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        View inflate = LayoutInflater.from(context).inflate(R.layout.vp_layout, null);
        TextView textView = inflate.findViewById(R.id.vptext);
        textView.setText(list.get(position));
        ImageView imageView = inflate.findViewById(R.id.image);
        imageView.setImageResource(list2.get(position));
        container.addView(inflate);
        return inflate;
    }
}

4.在Activity中初始化viewPager和adpter

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

import android.os.Bundle;

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

public class MainActivity extends AppCompatActivity {
   private ViewPager vp;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        vp=findViewById(R.id.vp);

        //1.資料來源
        List<Integer> list2 = new ArrayList<>();
        list2.add(R.mipmap.ic_launcher);
        list2.add(R.mipmap.ic_launcher_round);
        list2.add(R.mipmap.bing);
        List<String> list = new ArrayList<>();
        list.add("第一頁");
        list.add("第二頁");
        list.add("第三頁");
        //2.介面卡
        Myadpter vpAdpter = new Myadpter(this,list,list2);

        //3.設定介面卡
        vp.setAdapter(vpAdpter);

    }
}

執行效果
在這裡插入圖片描述
在這裡插入圖片描述
這裡沒有視訊演示,滑動可以看到我們的效果

ViewPager與Fragment結合使用 ( 重 點 )

與Fragment結合使用其實也一樣,只是用Fragment代替原先的View,填充ViewPager;然後就是Adapter不一樣,配合Fragment使用的有兩個Adapter:FragmentPagerAdapter和FragmentStatePagerAdapter。

activity佈局

<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:orientation="vertical"
    android:layout_height="match_parent"
    tools:context=".Main2Activity">
    
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/vp2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"></androidx.viewpager.widget.ViewPager>
</LinearLayout>

先建立Fragment
建立介面卡

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentPagerAdapter;

import java.util.List;

public class FragmentAdpter extends FragmentPagerAdapter {
    private List<Fragment> list;

    public FragmentAdpter(@NonNull FragmentManager fm,List<Fragment> list) {
        super(fm);
        this.list=list;

    }

    @NonNull
    @Override
    public Fragment getItem(int position) {
        return list.get(position);
    }

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

activity程式碼

import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.viewpager.widget.ViewPager;
import java.util.ArrayList;
import java.util.List;

public class Main2Activity extends AppCompatActivity {

    private ViewPager vp2;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        vp2 = (ViewPager) findViewById(R.id.vp2);


        //1.資料來源
        List<Fragment> list = new ArrayList<>();
        list.add(new BlankFragment());
        list.add(new BlankFragment2());
        list.add(new BlankFragment3());
        //2.介面卡
        FragmentAdpter fragmentAdpter = new FragmentAdpter(getSupportFragmentManager(), list);
        //3.設定介面卡
        vp2.setAdapter(fragmentAdpter);
        
    }
}

上面說到的兩個Adapter:FragmentPagerAdapter和FragmentStatePagerAdapter。的區別:

FragmentStatePagerAdapter

fragment的生命週期會執行
onDestoryView
onDestory
onCreate
onCreateView
fragment會被銷燬
適用用 圖片預覽等多個fragment的情況

FragmentPagerAdapter

onDestoryView
onCreateView
fragment不會被銷燬
適用於引導頁等少個fragment的情況

Fragment 和Viewpager的區別

viewpager是一個滑動bai切換的du檢視或者zhi說控制元件。
fragment是一個dao輕量級的Activity。