Android实用笔记——使用ViewPager实现导航

最新推荐文章于 2023-03-23 17:59:13 发布

Vincent8080

最新推荐文章于 2023-03-23 17:59:13 发布

阅读量125

点赞数

文章标签：移动开发 java python

原文链接：https://my.oschina.net/CoderBleak/blog/725093

版权

2019独角兽企业重金招聘Python工程师标准>>>

1、ViewPager功能：

可以使试图左右滑动（类似微信的顶部导航栏）。

2、加入ViewPager：

    <!--
      android.support.v4.view.ViewPager	为谷歌为了管理当前版本碎片化的问题而提供的兼容包
                     主要目的是为了解决向下兼容的问题，让一些高版本的控件可以在低版本的控件中使用
                     位于libs文件夹下，Viewpager控件为此架包的一个空间
      -->
    <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>

3、加载显示的页卡：

将Layout布局转换为View对象

4、配置Adapter：

5、应用：

a、创建View1.xml、View2.xml、View3.xml、View4.xml文件备用，以下为View1，其余与其类似

<?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:orientation="vertical" >
    
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第一个界面"
        ></TextView>

</LinearLayout>

b、编辑MainActivity.java文件、创建并编辑MyPagerAdapter.java文件、编辑activity_main.xml文件，步骤如代码注释所示

MainActivity.java文件：

package com.example.myandroidviewpager;

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

import android.os.Bundle;
import android.app.Activity;
import android.content.DialogInterface.OnClickListener;
import android.graphics.Color;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.Menu;
import android.view.View;
import android.widget.Toast;

public class MainActivity extends Activity implements OnPageChangeListener{
	//第一步：将新创建的几个View转化为对象存入List作数据源
	//1.1、声明数据源集合
	private List<View>viewList;
	
	//4.1、声明ViewPager对象
	private ViewPager pager;
	
	//5.1、声明标题栏对象，它其实是ViewPager的子标签
	private PagerTabStrip tab;
	//5.3、声明标题名称集合
	private List<String>titleList;
	
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        //1.2、将viewList初始化
        viewList=new ArrayList<View>();
        
        //1.3、把布局转成View对象   View.inflate(上下文, 布局ID, 父组件)
        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);
        
        //1.4、将生成的View对象加入到数据源的集合中
        viewList.add(view1);
        viewList.add(view2);
        viewList.add(view3);
        viewList.add(view4);
        
        //4.2、初始化ViewPager
        pager=(ViewPager) findViewById(R.id.pager);
        
        //5.4、为ViewPager页卡设置标题
        titleList=new ArrayList<String>();
        titleList.add("第一页");
        titleList.add("第二页");
        titleList.add("第三页");
        titleList.add("第四页");
        
        //5.5、需要将titleList加入到构造方法中去，则需要修改MyPagerAdapter
        
        //第二步，配置适配器,新建MyPagerAdapter。java文件
        
        //第三步、创建适配器PagerAdapter
        MyPagerAdapter adapter=new MyPagerAdapter(viewList,titleList);
        
        //第四步、ViewPager加载适配器
        //4.3、加载
        pager.setAdapter(adapter);
        
        //7.3、加载监听器
        pager.setOnPageChangeListener(this);
        
        //第五步、创建标题栏
        //5.2在main。xml文件中创建ViewPager的子标签
        
        //第六步、为PagerTabStript设置一些属性
        tab=(PagerTabStrip) findViewById(R.id.tab);
        tab.setBackgroundColor(Color.YELLOW);
        tab.setTextColor(Color.BLUE);
        tab.setDrawFullUnderline(false);
        tab.setTabIndicatorColor(Color.GREEN);        
    }

    //第七步、设置监听器
	@Override
	public void onPageScrollStateChanged(int arg0) {
		// TODO Auto-generated method stub
		
	}

	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
		// TODO Auto-generated method stub
		
	}

	@Override
	public void onPageSelected(int arg0) {
		// TODO Auto-generated method stub
		//7.1打印当前页面
		Toast.makeText(this, "当前是"+arg0+"个页面",Toast.LENGTH_SHORT);
	}   
}

MyPagerAdapter.java文件：

package com.example.myandroidviewpager;

import java.util.List;

import android.support.v4.view.PagerAdapter;
import android.text.style.SuperscriptSpan;
import android.view.View;
import android.view.ViewGroup;

public class MyPagerAdapter extends PagerAdapter{
	//第二步，配置适配器,新建MyPagerAdapter。java文件
	//2.1、声明搭建适配器需要的数据
	private List<View>viewList;
	
	//5.5、需要将titleList加入到构造方法中去，则需要修改MyPagerAdapter
	private List<String>titleList;
	
	//2.2、搭建构造方法
	//5.6、修改对应的构造方法
	public MyPagerAdapter(List<View>viewList,List<String>titleList){
		this.viewList=viewList;
		this.titleList=titleList;
	}
	
	//2.3、返回的是页卡数量
	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return viewList.size();
	}

	//2.4、判断当前View对象是否来自于对象
	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		// TODO Auto-generated method stub
		return arg0==arg1;
	}

	//2.5、实例化一个页卡
	@Override
	public Object instantiateItem(ViewGroup container, int position) {
		// TODO Auto-generated method stub
		container.addView(viewList.get(position));
		return viewList.get(position);
	}
	
	//2.6、销毁一个页卡
	@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
		// TODO Auto-generated method stub
		container.removeView(viewList.get(position));
	}
	
	//5.7、添加加载标题的方法,设置ViewPager的标题
	@Override
	public CharSequence getPageTitle(int position) {
		// TODO Auto-generated method stub
		return titleList.get(position);
	}
}

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	为谷歌为了管理当前版本碎片化的问题而提供的兼容包
                     主要目的是为了解决向下兼容的问题，让一些高版本的控件可以在低版本的控件中使用
                     位于libs文件夹下，Viewpager控件为此架包的一个空间
      -->
    <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.PagerTabStrip
            android:id="@+id/tab"
        	android:layout_width="wrap_content"
        	android:layout_height="wrap_content"
        	android:layout_gravity="top"
        	>
        </android.support.v4.view.PagerTabStrip>
       <!--
       	 与其类似的一个标签
       	 <android.support.v4.view.PagerTitleStrip
            android:id="@+id/tab"
        	android:layout_width="wrap_content"
        	android:layout_height="wrap_content"
        	android:layout_gravity="top"
        	>
        </android.support.v4.view.PagerTitleStrip>
        	一般两个不会一起用，如果一起用，android.support.v4.view.PagerTabStrip会被屏蔽，
        	只显示android.support.v4.view.PagerTitleStrip的效果
       -->    
        
        
    </android.support.v4.view.ViewPager>
    
</RelativeLayout>

c、结果

第四步完成结果：