了解ViewPager

来源:互联网 发布:java软件开发的书籍 编辑:程序博客网 时间:2024/06/10 12:28

我所了解的ViewPager

我自己了解到的ViewPager是一个与listview相似的东西,不过ViewPager里面装的是布局。你可以将几个布局存进一个适配器中,然后进行滑动查看。通过ViewPager可以实现滑动查看图片,相信大家都知道 美团外卖吧。这下面的四个按钮,点击了呈现的四个不同的界面。而这些界面就是用ViewPager实现的。


首先我们实现的是通过滑动呈现图片,还是先上代码吧

主页布局文件:

<RelativeLayout 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: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.jikexueyuan.learnviewpaper.Guide">    <android.support.v4.view.ViewPager        android:id="@+id/viewpager"        android:layout_width="match_parent"        android:layout_height="wrap_content"></android.support.v4.view.ViewPager>    </RelativeLayout>

传入的第一个布局文件:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical" android:layout_width="match_parent"    android:layout_height="match_parent">    <ImageView        android:background="@drawable/guide_1"        android:layout_width="match_parent"        android:layout_height="wrap_content" /></LinearLayout>

传入第二个布局文件:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical" android:layout_width="match_parent"    android:layout_height="match_parent">    <ImageView        android:background="@drawable/guide_2"        android:layout_width="match_parent"        android:layout_height="wrap_content" /></LinearLayout>

传入的第三个布局文件:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical" android:layout_width="match_parent"    android:layout_height="match_parent">    <ImageView        android:background="@drawable/guide_3"        android:layout_width="match_parent"        android:layout_height="wrap_content" /></LinearLayout>


Mainactivity界面代码:

package com.jikexueyuan.learnviewpaper;import android.support.v4.view.ViewPager;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.widget.ImageButton;import android.widget.ImageView;import android.widget.Toast;import java.util.ArrayList;import java.util.List;public class Guide extends AppCompatActivity implements ViewPager.OnPageChangeListener{    private ViewPager viewPager;    private  ViewPagerAdapter adapter;    private List<View> views;    private ImageView[] dots;    private  int[] ids={R.id.lv1,R.id.dingdan,R.id.wode};    private ImageButton imageButton;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_guide);        initViews();        dos();        imageButton= (ImageButton) findViewById(R.id.lv1);        imageButton.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View view) {               viewPager.setCurrentItem(2);            }        });    }    private  void  initViews(){        LayoutInflater inflater=LayoutInflater.from(this);        views=new ArrayList<>();        views.add(inflater.inflate(R.layout.one,null));        views.add(inflater.inflate(R.layout.two,null));        views.add(inflater.inflate(R.layout.three,null));        adapter=new ViewPagerAdapter(views,this);        viewPager= (ViewPager) findViewById(R.id.viewpager);        viewPager.setAdapter(adapter);        viewPager.setOnPageChangeListener(this);    }    private  void  dos(){        dots=new ImageView[views.size()];        for(int i=0;i<views.size();i++){            dots[i]= (ImageView) findViewById(ids[i]);        }    }    @Override    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {            //页面被滑动的时候调用    }    @Override    public void onPageSelected(int position) {        //当前页面被选选中的时候调用        if(position==0){            dots[0].setImageResource(R.drawable.tab_icon_home_selected);        }        else {            dots[0].setImageResource(R.drawable.tab_icon_home);        }    }    @Override    public void onPageScrollStateChanged(int state) {        //当滑动状态改变的时候调用    }}

ViewPager适配器的代码:

package com.jikexueyuan.learnviewpaper;import android.content.Context;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.view.View;import android.view.ViewGroup;import java.util.List;/** * Created by Administrator on 2016/10/25. */public class ViewPagerAdapter extends PagerAdapter {    private List<View> views;    private Context context;    public  ViewPagerAdapter(List<View> views,Context context){        this.views=views;        this.context=context;    }    @Override    public void destroyItem(ViewGroup container, int position, Object object) {        ((ViewPager)container).removeView(views.get(position));    }    @Override    public Object instantiateItem(ViewGroup container, int position) {        ((ViewPager)container).addView(views.get(position));        return views.get(position);    }    @Override    public int getCount() {        return views.size();    }    @Override    public boolean isViewFromObject(View view, Object object) {        return (view==object);    }}


关于这些代码的理解

因为前面说过ViewPager和listview相似,所以ViewPager和listview一样都需要去写一个适配器的类,他就是PagerAdapter。大家看了这个适配器的代码,是不是和listview的差不多。首先我们会先创建三个布局,每一个布局都是一张图片。特别说明的是除了创建的三个布局之外,还有一个主布局。看主布局,只有一项创建了ViewPager的view。里面含有各种属性。接着在主函数中定义各种变量,创建了一个initViews(),在这个函数内,首先先加载当前布局,然后将list进行实例化。通过调用view的add函数进行添加布局,然后在实例化适配器,然后取得viewpager对象,在将viewpager对象绑定adapter。所实现的效果就是左右滑动可查看三张图片



0 0
原创粉丝点击