ViewPager实现导航

最新推荐文章于 2024-05-24 02:08:39 发布
原创 最新推荐文章于 2024-05-24 02:08:39 发布 · 551 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#ViewPager #导航 #android

本文介绍如何使用ViewPager组件在Android应用中实现导航功能，包括PagerAdapter、FragmentPagerAdapter及FragmentStatePagerAdapter的使用方法，以及如何添加监听器来响应页面变化。

ViewPager实现导航

标签（空格分隔）： Android ViewPager

1. PagerAdapter使用

  • 加入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>
  • 加载显示的页卡
    将Layout布局转换成View对象
1. LayoutInflater lf=getLayoutInflater().from(this);
   lf.inflate(resource,root);
2. View.inflate（context,resource,root）;

  • 配置适配器

    1. PagerAdapter 数据源：List< View >
    2. FragmentPagerAdapter 数据源：List< Fragment >
    3. FragmentStatePagerAdapter 数据源：List< Fragment >

  • Adapter里面的的常用方法

    1. getCount() 返回所有页面数量
    2. isViewFromObject(View view,Object o) 判断视图是否由对象产生
    3. instantiateItem(ViewGroup container,int position) 实例化界面
    4. destroyItem(ViewGroup container,int position,Object object) 销毁页面
    5. getPageTitle(int position) 返回页面标题信息

activity_view_pager.xml

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


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

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

        <android.support.v4.view.PagerTitleStrip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/title"
            android:layout_gravity="bottom"/>

    </android.support.v4.view.ViewPager>

</LinearLayout>

注意：PagerTabStrip和PagerTitleStrip作为标题二者选其一即可，后者会覆盖前者。

MyPagerAdapter.java:

package com.excavator.viewpagerdemo;

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

import java.util.List;

/**
 * 项目名称：AdvancedControlTest
 * 类描述：
 * 创建人：admin
 * 创建时间：2015/6/24 17:02
 * 修改人：admin
 * 修改时间：2015/6/24 17:02
 * 修改备注：
 */
public class MyPagerAdapter extends PagerAdapter {

    private List<View> mViewList;
    private List<String> mTitleList;

    public MyPagerAdapter(List<View> viewList, List<String> titleList) {
        mViewList = viewList;
        mTitleList = titleList;
    }

    /**
     * 返回页卡的数量
     * @return
     */
    @Override
    public int getCount() {
        return mViewList.size();
    }

    /**
     * View是否来自于对象
     * @param view
     * @param object
     * @return 布尔值
     */
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view==object;
    }

    /**
     * 实例化一个页卡
     * @param container
     * @param position
     * @return
     */
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(mViewList.get(position));
        return mViewList.get(position);
    }

    /**
     * 销毁一个页卡
     * @param container
     * @param position
     * @param object
     */
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(mViewList.get(position));
    }

    //设置ViewPager页卡的标题
    @Override
    public CharSequence getPageTitle(int position) {
        return mTitleList.get(position);
    }
}

MyViewPagerActivity.java

package com.excavator.viewpagerdemo;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.view.View;

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

public class ViewPagerActivity extends Activity {

    private List<View> mViewList;
    private ViewPager mViewPager;
    private PagerTabStrip mTabStrip;
    private List<String> mTitleList;

    private List<Fragment> mFragList;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_pager);
        mViewList = new ArrayList<>();

        /**
         * 通过View对象去作为ViewPager数据源
         */
        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);

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

        /**
         * 通过Fragment作为ViewPager的数据源
         */
        mFragList = new ArrayList<>();
        mFragList.add(new Fragment1());
        mFragList.add(new Fragment2());
        mFragList.add(new Fragment3());
        mFragList.add(new Fragment4());

        //为ViewPager页卡设置标题
        String[] titleNames = new String[]{"第一页", "第二页", "第三页", "第四页"};
        mTitleList = new ArrayList<>();
        Collections.addAll(mTitleList, titleNames);

        //为PagerTabStrip设置一些属性
        mTabStrip = (PagerTabStrip) findViewById(R.id.tab);
        mTabStrip.setBackgroundColor(Color.YELLOW);
        mTabStrip.setTextColor(Color.RED);
        mTabStrip.setDrawFullUnderline(false);
        mTabStrip.setTabIndicatorColor(Color.GREEN);

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

        //创建PagerAdapter
        MyPagerAdapter adapter = new MyPagerAdapter(mViewList,mTitleList);

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

2. FragmentPagerAdapter使用

ViewPagerActivity.java

package com.excavator.viewpagerdemo;

import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.widget.Toast;

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

public class ViewPagerActivity extends FragmentActivity implements ViewPager.OnPageChangeListener {

    private List<View> mViewList;
    private ViewPager mViewPager;
    private PagerTabStrip mTabStrip;
    private List<String> mTitleList;

    private List<Fragment> mFragList;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_pager);
        mViewList = new ArrayList<>();
        /**
         * 通过View对象去作为ViewPager数据源
         */
        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);

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

        /**
         * 通过Fragment作为ViewPager的数据源
         */
        mFragList = new ArrayList<>();
        mFragList.add(new Fragment1());
        mFragList.add(new Fragment2());
        mFragList.add(new Fragment3());
        mFragList.add(new Fragment4());

        //为ViewPager页卡设置标题
        String[] titleNames = new String[]{"微信", "通讯录", "发现", "我"};
        mTitleList = new ArrayList<>();
        Collections.addAll(mTitleList, titleNames);

        //为PagerTabStrip设置一些属性
        mTabStrip = (PagerTabStrip) findViewById(R.id.tab);
        mTabStrip.setBackgroundColor(Color.YELLOW);
        mTabStrip.setTextColor(Color.RED);
        mTabStrip.setDrawFullUnderline(false);
        mTabStrip.setTabIndicatorColor(Color.GREEN);

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

        //创建PagerAdapter
//        MyPagerAdapter adapter = new MyPagerAdapter(mViewList,mTitleList);

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

        //创建FragmentPagerAdapter
//        MyFragmentPagerAdapter adapter2 = new MyFragmentPagerAdapter(getSupportFragmentManager(),mFragList,mTitleList);
//        mViewPager.setAdapter(adapter2);

        MyFragmentPagerAdapter2 adapter3 = new MyFragmentPagerAdapter2(getSupportFragmentManager(),mFragList,mTitleList);
        mViewPager.setAdapter(adapter3);
        mViewPager.addOnPageChangeListener(this);
    }

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {
        Toast.makeText(this,"当前是第"+(position+1)+"个页面",Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }
}

注意：向下兼容Fragment时，即import android.support.v4.app.Fragment Activity应该继承自FragmentActivity，并且使用getSupportFragmentManager()方法获取管理者。

Fragment1.java

package com.excavator.viewpagerdemo;


import android.os.Bundle;
import android.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class Fragment1 extends android.support.v4.app.Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.view1, container, false);
    }

}

Fragment2.java

package com.excavator.viewpagerdemo;


import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class Fragment2 extends android.support.v4.app.Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.view2, container, false);
    }

}

Fragment3.java

package com.excavator.viewpagerdemo;


import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class Fragment3 extends android.support.v4.app.Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.view3, container, false);
    }

}

Fragment4.java

package com.excavator.viewpagerdemo;


import android.app.Fragment;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class Fragment4 extends android.support.v4.app.Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.view4, container, false);
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
        Log.d("Main1","我销毁了");
    }
}

注意：由于更换了手机，打印日志时，无法输出调试信息时，是由于手机没有打开离线日志输出，更改日志输出级别，大神F1手机 在拨号界面输入*20121220#进入工程模式，更改Java log level和C and C++ log level为LOGV，将Kernel log level输出等级设置为最后的KERN_DEBUG

MyFragmentPagerAdapter.java

package com.excavator.viewpagerdemo;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**
 * 项目名称：AdvancedControlTest
 * 类描述：FragmentPagerAdapter会把所有的Fragment界面全部加载，不会有自动加载和销毁页卡方法
 * 创建人：admin
 * 创建时间：2015/6/24 21:26
 * 修改人：admin
 * 修改时间：2015/6/24 21:26
 * 修改备注：
 */
public class MyFragmentPagerAdapter extends FragmentPagerAdapter {

    private List<Fragment> mFragList;
    private List<String> mTitleList;

    public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> fragList, List<String> titleList) {
        super(fm);
        mFragList = fragList;
        mTitleList = titleList;
    }

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

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

    @Override
    public CharSequence getPageTitle(int position) {
        return mTitleList.get(position);
    }


}

MyFragmentPagerAdapter继承自FragmentPagerAdapter会把所有Fragment界面全部加载，不会调用加载和销毁页卡方法。

MyFragmentPagerAdapter2.java

package com.excavator.viewpagerdemo;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.util.Log;
import android.view.ViewGroup;

import java.util.List;

/**
 * 项目名称：AdvancedControlTest
 * 类描述：FragmentStatePagerAdapter会把所有的Fragment界面全部加载，会调用自动加载和销毁页卡方法
 * 创建人：admin
 * 创建时间：2015/6/24 21:26
 * 修改人：admin
 * 修改时间：2015/6/24 21:26
 * 修改备注：
 */
public class MyFragmentPagerAdapter2 extends FragmentStatePagerAdapter {

    private List<Fragment> mFragList;
    private List<String> mTitleList;

    public MyFragmentPagerAdapter2(FragmentManager fm, List<Fragment> fragList, List<String> titleList) {
        super(fm);
        Log.d("Main1","abc");
        mFragList = fragList;
        mTitleList = titleList;
    }

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

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

    @Override
    public CharSequence getPageTitle(int position) {
        return mTitleList.get(position);
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        return super.instantiateItem(container, position);
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        super.destroyItem(container, position, object);
    }
}

MyFragmentPagerAdapter2继承自FragmentStatePagerAdapter会调用加载和销毁页卡方法。

3. 监听器的使用

使类实现OnPageChangeListene接口，
mViewPager.addOnPageChangeListener(this);
并重写以下方法

@Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {
        Toast.makeText(this,"当前是第"+(position+1)+"个页面",Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }
RadioGroup+RadioButton+ViewPager实现导航栏
cc
08-10 276
RadioGroup+RadioButton个人认为是最好实现图文导航栏的所以写了这个demo，希望对各位有些帮助 实现的效果 在activity_main中 在MainActivity中
Android使用ViewPager实现导航
08-31
Android 使用 ViewPager 实现导航 Android 中使用 ViewPager 实现导航是一种常见的方式，ViewPager 是 Android 中的一种视图容器，可以容纳多个视图，并且支持左右滑动。下面将详细介绍使用 ViewPager 实现导航的...
android使用viewpager实现导航页面
06-12
android使用viewpager实现导航页面。 如果遇到中文乱码情况，请在eclipse中右击工程->Resource右侧->Text file encoding更改编码格式为UTF-8即可。
ViewPager实现导航效果简单应用1
学习笔记
12-27 272
1 添加依赖 implementation ‘androidx.viewpager2:viewpager2:1.0.0-alpha02’ 创建项目的时候请勾选Use androidX 不然库冲突 2 xml布局中引用viewpager 3 声明数组,将图片存入 4 实例化适配器(RecyclerView.Adapter) 5 找到Viewpager.设置适配器 项目工程: MainActiv...
ViewPager实现导航效果
weixin_65838109的博客
05-02 951
应用场景：1.引导界面、相册多图片预览 2.多Tab页面、App导航 3.广告播放展示 存在于android.support.v4.view.ViewPager包中 List<View>:视图列表 注：在新版中android.support.v4.view.ViewPager包不存在了，需要改为androidx.viewpager.widget.ViewPager ...
Android 使用ViewPager实现导航页面
最新发布
2401_85239883的博客
05-24 380
private List views;public GuidePageAdapter(List views) {this.views = views;}@Overridepublic int getCount() {if (views != null) {return views.size();}return 0;}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return (arg0 == arg1);}@Overrid
利用viewPager实现导航界面
NELA的博客
06-29 641
利用viewPager实现基本的导航界面，和其中一些细节等。
使用ViewPager实现导航页
jyDave的博客
11-06 834
创建并初始化ViewPager 首先在xml文件中加入ViewPager 的声明： <android.support.v4.view.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="mat
Android UI学习笔记 之 使用ViewPager实现导航
A浩酱的博客
04-03 981
ViewPager的用处就如上图所示（图源网络），当我们左右滑动屏幕时，会从一个页码转到下一个页卡。 ViewPager中默认三个为一组的加载，例如，view1  view2   view3，当我们向左滑动时，view1会被销毁， 而view4(如果有的话)就会实例化加载进来，变成view2  view3   view4的样子 使用ViewPager大致分为以下步骤： ①建立数
Android ViewPager实现导航页效果
baipenggui_bo
08-25 427
效果 代码 ----------------------------------MainActivity ---------------------------------- public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener { //存放view的数组 private ArrayList<View> mViewList; ...
ViewPager实现导航功能
04-04
在这个项目中，ViewPager被用来实现导航功能，结合了FragmentTabHost，使得界面更加灵活且易于管理。下面我们将详细讨论这两个组件以及它们如何协同工作。 **ViewPager** ViewPager是由Android Support Library...
Android 利用ViewPager实现导航页滑动效果
10-29
刚开始搞导航页时从网上找到个叫MyScrollLayout(extends ViewGroup)的自定义组件，代码繁琐，滑动速度感觉不是很舒服；现在发现大家都在用ViewPager，试了下感觉滑动速度舒服多了，而且在一个类里面就可以搞定，值得...
ViewPager实现导航来视图-页卡滑动
01-14
这个项目“ViewPager实现导航栏视图-页卡滑动”显然是教你如何利用ViewPager来构建一个类似Google Play商店或者许多App首页那样的可滑动导航栏。 首先，我们来详细了解一下ViewPager。ViewPager是Android Support ...
四大组件
发条毛虫
06-11 1585
四大组件标签（空格分隔）：Activity ContentProvider BroadcastReceiver Service Android四大组件 一 ContentProvider 如何实现ContentProvider 何为URI UriMatcher类 ContentResolver 二 BroadcastReceiver 使用方法 广播的种类及使用 三 Service 四Activity
ScrollView实现滚动效果
发条毛虫
06-30 1189
ScrollView实现滚动效果标签（空格分隔）： ScrollView Android 滚动效果ScrollView实现滚动效果 使用ScrollView实现滚动条 监听ScrollView何时滑动到底部 控制ScrollView视图位置 滚动视图是指当拥有很多内容，屏幕显示不全时，需要通过滚动来显示完整的视图。 1. 使用ScrollView实现滚动条 ScrollView的种类：
使用ViewFlipper实现屏幕滚动切换动画
发条毛虫
06-30 1148
使用ViewFlipper实现屏幕滚动切换动画标签（空格分隔）： ViewFlipper Android 自动切换使用ViewFlipper实现屏幕滚动切换动画 使用ViewFlipper实现图片轮播 Android系统自带的一个多页面管理控件，可以实现子界面的自动切换。 使用ViewFlipper实现图片轮播1.静态导入：在layout布局文件中直接导入<ViewFlipper
多个Activity启动问题
发条毛虫
11-13 737
多个Activity启动问题标签（空格分隔）： 多个Activity Android 在应用程序中可以有多个Activity，每个Activity是同级别的，先启动哪个Activity？有些程序可能需要显示在默认列表里，有些则不需要。android.Intent.action.MAIN决定程序最先启动的Activity。android.Intent.category.LAUNCHER决定应用程序是否
WebView显示网页
发条毛虫
06-15 717
WebView显示网页标签（空格分隔）： WebView AndroidWebView显示网页 使用WebView加载页面 处理页面导航 在WebView中使用Javascript WebView后退与前进 判断页面加载过程 WebView缓存的使用 1.使用WebView加载页面loadUrl() web资源：webView.loadUrl("http://www.baidu.com");本地文
ViewPager实现导航页面与欢迎界面源码解析
实现一个包含ViewPager的欢迎界面涉及到布局的设置、适配器的设计、页面切换动画的处理等多个方面。 ### 知识点一：ViewPager基础 ViewPager是Android Support Library中的一个组件，它使得在同一个Activity中滑动...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值