android 控件学习笔记 --------ViewPager

最新推荐文章于 2022-11-13 20:00:00 发布

LTG01

最新推荐文章于 2022-11-13 20:00:00 发布

阅读量538

点赞数 2

分类专栏： android 文章标签： viewpager

本文链接：https://blog.csdn.net/ltg01/article/details/49095369

版权

android 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

ViewPager

viewpager 可以使屏幕自由的左右滑动。我们可以把它看成一个容器，它可以承载两个对象View 和Fragment 。

它的控件和以往的不太一样

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

这个控件指明了它的具体位置，它在建的工程libs文件下的android-support-v4.jar 中

配置Adapter

Pageradpter的数据源是List<view>

Fragement Pageradpter的数据源是List<Fragement>

FragementStatePageradpter的数据源是List<Fragement>

首先 Pageradpter

一次加载三个页卡自动移除没显示的页卡，

下面贴出完整代码后面做下解释

activity_main.xml

<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=".MainActivity" >

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

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/pts"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" >
        </android.support.v4.view.PagerTabStrip>
        
    </android.support.v4.view.ViewPager>
</RelativeLayout>

MainActivity.java

import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.graphics.Color;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.view.View;

public class MainActivity extends Activity {
	private ViewPager viewPager;
	private PagerTabStrip pagerTabStrip;
	List<View> listview;
	List<String> listtitle;
	View view1, view3, view4, view2;

	@SuppressLint("NewApi") @Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		viewPager = (ViewPager) findViewById(R.id.vp);
		pagerTabStrip = (PagerTabStrip) findViewById(R.id.pts);
		listview = new ArrayList<View>();

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

		listtitle = new ArrayList<String>();
		listtitle.add("第一页");
		listtitle.add("第二页");
		listtitle.add("第三页");
		listtitle.add("第四页");
		pagerTabStrip.setBackgroundColor(Color.BLACK);
		pagerTabStrip.setDrawFullUnderline(false);
		pagerTabStrip.setTabIndicatorColor(Color.BLUE);
		pagerTabStrip.setTextColor(Color.GREEN);		

		MyPagerAdapter myPagerAdapter = new MyPagerAdapter(listview,listtitle);

		viewPager.setAdapter(myPagerAdapter);
	}

}

MyPagerAdapter.java 代码

import java.util.List;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;


public class MyPagerAdapter extends PagerAdapter {
<span style="white-space:pre">	</span>List<View> listview;
<span style="white-space:pre">	</span>List<String> listtitle;


<span style="white-space:pre">	</span>public MyPagerAdapter(List<View> listview,List<String> listtitle) {
<span style="white-space:pre">		</span>this.listview = listview;
<span style="white-space:pre">		</span>this.listtitle=listtitle;
<span style="white-space:pre">	</span>}


<span style="white-space:pre">	</span>// 返回页卡的数量
<span style="white-space:pre">	</span>@Override
<span style="white-space:pre">	</span>public int getCount() {
<span style="white-space:pre">		</span>// TODO Auto-generated method stub
<span style="white-space:pre">		</span>return listview.size();
<span style="white-space:pre">	</span>}


<span style="white-space:pre">	</span>// 判断view是否来在对象
<span style="white-space:pre">	</span>@Override
<span style="white-space:pre">	</span>public boolean isViewFromObject(View arg0, Object arg1) {
<span style="white-space:pre">		</span>// TODO Auto-generated method stub
<span style="white-space:pre">		</span>return arg0 == arg1;
<span style="white-space:pre">	</span>}


<span style="white-space:pre">	</span>// 实例化页卡
<span style="white-space:pre">	</span>@Override
<span style="white-space:pre">	</span>public Object instantiateItem(ViewGroup container, int position) {
<span style="white-space:pre">		</span>// TODO Auto-generated method stub
<span style="white-space:pre">		</span>container.addView(listview.get(position));
<span style="white-space:pre">		</span>return listview.get(position);


<span style="white-space:pre">	</span>}


<span style="white-space:pre">	</span>// 销毁页卡
<span style="white-space:pre">	</span>@Override
<span style="white-space:pre">	</span>public void destroyItem(ViewGroup container, int position, Object object) {
<span style="white-space:pre">		</span>// TODO Auto-generated method stub
<span style="white-space:pre">		</span>container.removeView(listview.get(position));


<span style="white-space:pre">	</span>}

             //获取标题
<span style="white-space:pre">	</span>@Override
<span style="white-space:pre">	</span>public CharSequence getPageTitle(int position) {
<span style="white-space:pre">		</span>// TODO Auto-generated method stub
<span style="white-space:pre">		</span>return listtitle.get(position);
<span style="white-space:pre">	</span>}
<span style="white-space:pre">	</span>
<span style="white-space:pre">	</span>


}

view1.xml view2.xml view3.xml view4.xml 代码除了图片不一样其他完全一样这里就给出第一个的

<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=".MainActivity" >

    <ImageView
        android:src="@drawable/games_control"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />


</RelativeLayout>

下面简单解释下代码

 <android.support.v4.view.PagerTabStrip
            android:id="@+id/pts"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" >
        </android.support.v4.view.PagerTabStrip>

上面该段代码是实现滑动页面的标题的和下面代码配合使用

listtitle = new ArrayList<String>();
		listtitle.add("第一页");  //设置导航的title的名称
		listtitle.add("第二页");
		listtitle.add("第三页");
		listtitle.add("第四页");
		pagerTabStrip.setBackgroundColor(Color.BLACK);   //设置导航栏的背景颜色
		pagerTabStrip.setDrawFullUnderline(false);//设置导航栏下面的那条线的显示与否
		pagerTabStrip.setTabIndicatorColor(Color.BLUE); //设置当前页面那个标题下短线的颜色
		pagerTabStrip.setTextColor(Color.GREEN);//设置标题的颜色

最后的效果图如下

Fragement Pageradpter的数据源是List<Fragement>的时候

一次把所有的页卡加载完

代码基本差不多

但是在导包的时候要选择导入 android.support.v4.app.开头的包它具有兼容性 3.0以下版本也可以使用

MainActivity.java 代码如下和上面不一样的是

<strong>MainActivity  继承的不是Activity  而是FragmentActivity</strong>

import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.annotation.SuppressLint;
import android.graphics.Color;
import <strong>android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;</strong>
import android.view.View;

public class MainActivity <strong>extends FragmentActivity </strong>{
	private ViewPager viewPager;
	private PagerTabStrip pagerTabStrip;
	List<Fragment> fragmentlist;
	List<String> listtitle;

	@SuppressLint("NewApi") @Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		viewPager = (ViewPager) findViewById(R.id.vp);
		pagerTabStrip = (PagerTabStrip) findViewById(R.id.pts);
		
		listtitle = new ArrayList<String>();
		listtitle.add("第一页");
		listtitle.add("第二页");
		listtitle.add("第三页");
		listtitle.add("第四页");
		pagerTabStrip.setBackgroundColor(Color.BLACK);
		pagerTabStrip.setDrawFullUnderline(false);
		pagerTabStrip.setTabIndicatorColor(Color.BLUE);
		pagerTabStrip.setTextColor(Color.GREEN);		

		
		fragmentlist = new ArrayList<Fragment>();
		<strong>fragmentlist.add(new Fragment1());
		fragmentlist.add(new Fragment2());
		fragmentlist.add(new Fragment3());
		fragmentlist.add(new Fragment4());</strong>
		MyFragment myFragment = new MyFragment(<strong>getSupportFragmentManager()</strong>,fragmentlist,listtitle);
		viewPager.setAdapter(myFragment);
		
	}

}

Fragment1.java 和 Fragment2.java Fragment3.java Fragment4.java代码基本一样不一样的是导入的布局view 。其 Fragment1.java代码如下

import android.os.Bundle;
<strong>import android.support.v4.app.Fragment;</strong>
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment1 extends <strong>Fragment</strong>{

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		View view=inflater.inflate(<strong>R.layout.view1</strong>, container, false);  
		return  view;
	}

}

MyFragment.java代码如下

import java.util.List;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

public class MyFragment extends FragmentPagerAdapter {
	List<Fragment> listview; // 传递过来布局
	List<String> listtitle;// 传递过来标题

	public MyFragment(FragmentManager fm, List<Fragment> listview,
			List<String> listtitle) {
		super(fm);
		// TODO Auto-generated constructor stub
		this.listview = listview;
		this.listtitle = listtitle;
	}

	@Override
	public CharSequence getPageTitle(int position) {
		// TODO Auto-generated method stub
		return listtitle.get(position);
	}

	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return listview.size();
	}

	@Override
	public Fragment getItem(int arg0) {
		// TODO Auto-generated method stub
		return listview.get(arg0);
	}

}

运行的效果和上面一样。

FragementStatePageradpter的数据源是List<Fragement>的时候

和FragementPageradpter 基本一样不一样的是

<strong>MainActivity  继承的FragmentStateActivity </strong>

而且在 MyFragment.java代码中需要添加两个方法，但是不需要改写。它一次是加载3个页卡。自动移除创建页卡

@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
		// TODO Auto-generated method stub
		super.destroyItem(container, position, object);
	}

	@Override
	public Object instantiateItem(ViewGroup container, int position) {
		// TODO Auto-generated method stub
		return super.instantiateItem(container, position);
	}

运行效果和上面一样。

LTG01

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
android 控件学习笔记 --------ViewPager

ViewPager viewpager 可以使屏幕自由的左右滑动。我们可以把它看成一个容器，它可以承载两个对象View 和Fragment 。它的控件和以往的不太一样 android:id="@+id/vp" android:layout_width="wrap_content" android:layout_heigh
复制链接

扫一扫