ViewPager初步用法

最新推荐文章于 2024-11-28 10:32:21 发布

原创最新推荐文章于 2024-11-28 10:32:21 发布 · 294 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #viewpager

android 专栏收录该内容

14 篇文章

订阅专栏

本文介绍如何使用ViewPager组件实现三个不同界面的左右滑动切换效果。通过创建自定义适配器MyPagerAdapter，管理包含三个TextView的布局文件。主页面activity_main.xml仅包含一个ViewPager组件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

viewpager中包含3个视图，并且这3个视图可以通过左右滑动来进行切换。既然我们需要包含3个视图，我们就先准备3个页面的布局吧！
TextView1.xml(布局1):

<?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">

    <TextView
        android:id="@+id/tv1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第一个界面"/>
</LinearLayout>

TextView2.xml(布局2):

<?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">

    <TextView
        android:id="@+id/tv2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第二个界面"/>
</LinearLayout>

TextView2.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">
    <TextView
        android:id="@+id/tv3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第三个界面"/>
</LinearLayout>

接下来…
然后是我们的主页面布局activity_main.xml，只有一个ViewPager：

<?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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.guocong.viewpager.MainActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
    </android.support.v4.view.ViewPager>
</LinearLayout>

好啦，我们已经把该准备的布局文件都准备好了，接下来我们开始来敲代码。从API中我们看出来，viewpager是通过适配器来进行管理的（数据源—适配器—视图）。我们分别来看看：

数据源：这里的数据比较简单，就是包含3个View的一个list

        /*
        通过View对象作为ViewPager的数据源
         */
        viewList=new ArrayList<View>();

        View view1=View.inflate(this,R.layout.view1,null);
        View view2=View.inflate(this,R.layout.view2,null);
        View view3=View.inflate(this,R.layout.view3,null);
        View view4=View.inflate(this,R.layout.view4,null);

        viewList.add(view1);
        viewList.add(view2);
        viewList.add(view3);
        viewList.add(view4);

视图：一般视图都是比较简单的，这里也不例外，就是一个ViewPager

private ViewPager pager;
... ... ... 
//初始化viewPager
pager=(ViewPager)findViewById(R.id.pager);

适配器：在大多数使用适配器的控件里，适配器相对于数据源和视图来说都更加复杂，同时也决定了这个控件主要的功能。ViewPager也不例外，所以我们有必要对PagerAdapter深入了解一下。

package com.example.guocong.viewpager;

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;

import java.util.List;
public class MyPagerAdapter extends PagerAdapter {
      private List<View>viewList;

      public MyPagerAdapter(List<View>ViewList)
      {
          this.viewList=ViewList;
      }
    //返回页卡的数量
    @Override
    public int getCount() {
        return viewList.size();
    }
    //View是否来自于对象
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view==object;
    }
    //实例化一个页卡
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(viewList.get(position));
        return viewList.get(position);
    }
    //销毁一个页卡
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(viewList.get(position));
    }
}

Mainactivity.class:

 //创建适配器
        MyPagerAdapter adapter=new MyPagerAdapter(viewList);

        //ViewPager加载适配器
        pager.setAdapter(adapter);