Android项目ViewPager+Fragment的基本使用

原创 2017年04月23日 09:58:13

利用ViewPager+Fragment简单实现页面的切换


项目的大概组成:


以下是代码的实现,首先在activity_main.xml新建菜单栏和ViewPager控件

<LinearLayout 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:orientation="vertical"
    tools:context="com.itman.viewpagerdemo.MainActivity" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tv_item_one"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_horizontal"
            android:text="菜单一" />

        <TextView
            android:id="@+id/tv_item_two"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_horizontal"
            android:text="菜单二" />

        <TextView
            android:id="@+id/tv_item_three"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_horizontal"
            android:text="菜单三" />
    </LinearLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/myViewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1" />

</LinearLayout>



接下来就新建三个Fragment页面做好准备,Fragment的布局文件:

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="我是菜单一"
        android:textSize="30sp" />

</RelativeLayout>


Fragment的Java文件:

package com.itman.viewpagerdemo;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class OneFragment extends Fragment{

@Override
public View onCreateView(LayoutInflater inflater,
ViewGroup container,  Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_one, null);
return view;
}

}


三个fragment页面都一样的,就不全部贴出来了,接下来就准备添加Fragment的适配器TabFragmentPagerAdapter:

package com.itman.viewpagerdemo;

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

public class TabFragmentPagerAdapter extends FragmentPagerAdapter {
private FragmentManager mfragmentManager;
private List<Fragment> mlist;

public TabFragmentPagerAdapter(FragmentManager fm, List<Fragment> list) {
super(fm); 
this.mlist = list;
}

@Override
public Fragment getItem(int arg0) {
return mlist.get(arg0);//显示第几个页面
}

@Override
public int getCount() {
return mlist.size();//有几个页面
}
}


准备工作完成,接下来是MainActivit.Java的代码实现:

package com.itman.viewpagerdemo;

import java.util.ArrayList;
import java.util.List;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;

public class MainActivity extends ActionBarActivity implements OnClickListener {

private TextView tv_item_one;
private TextView tv_item_two;
private TextView tv_item_three;
private ViewPager myViewPager;
private List<Fragment> list;
private TabFragmentPagerAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
InitView();

// 设置菜单栏的点击事件
tv_item_one.setOnClickListener(this);
tv_item_two.setOnClickListener(this);
tv_item_three.setOnClickListener(this);
myViewPager.setOnPageChangeListener(new MyPagerChangeListener());

//把Fragment添加到List集合里面
list = new ArrayList<>();
list.add(new OneFragment());
list.add(new TwoFragment());
list.add(new ThreeFragment());
adapter = new TabFragmentPagerAdapter(getSupportFragmentManager(), list);
myViewPager.setAdapter(adapter);
myViewPager.setCurrentItem(0);  //初始化显示第一个页面
tv_item_one.setBackgroundColor(Color.RED);//被选中就为红色
}

/**
* 初始化控件
*/
private void InitView() {
tv_item_one = (TextView) findViewById(R.id.tv_item_one);
tv_item_two = (TextView) findViewById(R.id.tv_item_two);
tv_item_three = (TextView) findViewById(R.id.tv_item_three);
myViewPager = (ViewPager) findViewById(R.id.myViewPager);
}

/**
* 点击事件
*/
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.tv_item_one:
myViewPager.setCurrentItem(0);
tv_item_one.setBackgroundColor(Color.RED);
tv_item_two.setBackgroundColor(Color.WHITE);
tv_item_three.setBackgroundColor(Color.WHITE);
break;
case R.id.tv_item_two:
myViewPager.setCurrentItem(1);
tv_item_one.setBackgroundColor(Color.WHITE);
tv_item_two.setBackgroundColor(Color.RED);
tv_item_three.setBackgroundColor(Color.WHITE);
break;
case R.id.tv_item_three:
myViewPager.setCurrentItem(2);
tv_item_one.setBackgroundColor(Color.WHITE);
tv_item_two.setBackgroundColor(Color.WHITE);
tv_item_three.setBackgroundColor(Color.RED);
break;
}
}

/**
* 设置一个ViewPager的侦听事件,当左右滑动ViewPager时菜单栏被选中状态跟着改变
*
*/
public class MyPagerChangeListener implements OnPageChangeListener {

@Override
public void onPageScrollStateChanged(int arg0) {
}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}

@Override
public void onPageSelected(int arg0) {
switch (arg0) {
case 0:
tv_item_one.setBackgroundColor(Color.RED);
tv_item_two.setBackgroundColor(Color.WHITE);
tv_item_three.setBackgroundColor(Color.WHITE);
break;
case 1:
tv_item_one.setBackgroundColor(Color.WHITE);
tv_item_two.setBackgroundColor(Color.RED);
tv_item_three.setBackgroundColor(Color.WHITE);
break;
case 2:
tv_item_one.setBackgroundColor(Color.WHITE);
tv_item_two.setBackgroundColor(Color.WHITE);
tv_item_three.setBackgroundColor(Color.RED);
break;
}
}
}

}


代码的注释很详细,也不是什么很难实现功能,有了基本实现的样例,大家就可以随意改动,变成自己喜欢的样式了。

版权声明:欢迎以任何形式转载,但请注明作者和出处

使用ViewPager和Fragment实现底部导航滑动重构版

感谢刘大神写的项目,参考自点击这里,本文对其进行了简单重构,写下思路,供自己以后思考。自定义view设置每个页面的子itemlayout_tab_item.xml,每个item由一个ImageView...
  • yyg204731
  • yyg204731
  • 2016年04月23日 12:29
  • 8139

ViewPager中添加Fragment的方法实现

有时候我们在使用ViewPager的时候可以向里面加入一个自定义的view,也可以加入一个Fragment,那如何加入Fragement 创建一个Viewpager的适配器,然后需要继承Frage...
  • u014697083
  • u014697083
  • 2016年03月25日 17:53
  • 1655

Android ViewPager加Fragment实现滑动或者点击页面切换

1.布局文件添加android.support.v4.ViewPager
  • u014732430
  • u014732430
  • 2016年08月23日 18:09
  • 477

Android ViewPager+Fragment 仿 Google Play

最近终于从繁忙的网络爬虫项目中解脱出来,回到久违的Android开发岗位,有时间研究Android 4.0的一些新特性,例如Fragment和ViewPager,参考了一些他人的代码,做出来了Goog...
  • FX_SKY
  • FX_SKY
  • 2013年05月29日 18:17
  • 38333

Android——ViewPager+Fragment+ListView之间

Android——ViewPager+Fragment+ListView之间 package com.example.jreduch05; import android.os.Bu...
  • zhangyufeng0126
  • zhangyufeng0126
  • 2016年08月09日 21:56
  • 3320

Android - Fragment+ViewPager结合使用

这篇作为详细回顾Fragment的最后一篇。 第一篇:http://blog.csdn.net/u014470702/article/details/48139579 为什么使用Fragment,F...
  • u014470702
  • u014470702
  • 2015年09月04日 09:33
  • 1290

Android之实现ViewPager+Fragment左右滑动

最近看新闻发现新闻的页面是可以左右滑动的,于是自己就好奇起来了,之前做过ViewPager展示图片,在想怎么加载页面呢?研究了一下,发现就是添加了Fragment,废话不多说,揭秘奥秘的时候到了。 ...
  • SnowWitch
  • SnowWitch
  • 2016年01月29日 16:23
  • 2911

Android的ViewPager,ViewPager配合Fragment的用法

MainActivity.java package com.hust.viewpaper; import java.util.ArrayList; import android.app.Acti...
  • tuke_tuke
  • tuke_tuke
  • 2016年05月29日 10:27
  • 647

ViewPager+Fragment动态增加页面,删除页面

ViewPager + Fragment 实现动态增加页面 和 动态删除页面。
  • robert_cysy
  • robert_cysy
  • 2017年05月08日 20:46
  • 1529

Android ViewPager + Fragment的使用

最近在做一款应用,需要实现左右滑动的效果,研究和实践了挺久,现在先简单总结一下。后续还会完善 一、ViewPager简介: android.support.v4 是谷歌官方给我们提供...
  • hrp36
  • hrp36
  • 2016年06月16日 10:35
  • 272
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android项目ViewPager+Fragment的基本使用
举报原因:
原因补充:

(最多只允许输入30个字)