android:ViewPager配合Fragment实现页面切换

首先看下代码效果：

我们希望达到的效果是，点击上方的标题其背景颜色改变，同时底下的内容跟着改变。这是利用安卓的ViewPager和Fragment实现的。上方是LinearLayout中包含三个TextView，下面是ViewPager

我们对LinearLayout中的三个子控件进行监听实现切换ViewPager。

而ViewPager的内容我们利用FragmentPagerAdapter适配器将用我们的Fragment组成

2.代码

Fragment:

package com.example.administrator.myapplication;

import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;
import java.util.ArrayList;
import static com.example.administrator.myapplication.R.layout.activity_main;

/**
 * Created by Administrator on 2018/4/24.
 */
public class MyFragment extends android.support.v4.app.Fragment{
View view;
   
    ListView listView;
    private String data[]={"南京","北京","深圳","桂林","南宁","上海","北京","深圳","桂林","南宁","上海","北京","深圳","桂林","南宁"};

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        //解析Fragment布局文件
        view =inflater.inflate(R.layout.fragment, null);
        //获取listView控件
        listView=(ListView)view.findViewById(R.id.listView);
      return  view;
    }

    @Override
    public void onViewCreated(View view, Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        //创建适配器
        ArrayAdapter<String> adapter=new ArrayAdapter<String>(getActivity(),R.layout.simple_adapter_item, R.id.text1,data);
        listView.setAdapter(adapter);
        //listview 监听
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                Toast.makeText(getActivity(),data[i],Toast.LENGTH_SHORT).show();
            }
        });

    }

}

Fragment对应的xml文件：

<?xml version="1.0" encoding="utf-8"?>
<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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:orientation="vertical"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.administrator.myapplication.MainActivity">


<ListView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/listView"
    ></ListView>

</LinearLayout>

Activity代码：

package com.example.administrator.myapplication;

import android.graphics.Color;
import android.net.Uri;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.ActionBarActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.google.android.gms.appindexing.Action;
import com.google.android.gms.appindexing.AppIndex;
import com.google.android.gms.common.api.GoogleApiClient;

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

public class PagerActivity extends ActionBarActivity {
    ViewPager pager;
    private List<MyFragment> list;
    private String data[] = {"第一页", "第二页", "第三页"};
    private LinearLayout layout;
    private TextView textView[];
    private ViewPager view_pager;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_pager);
        //初始化Fragment数组
        pager = (ViewPager) this.findViewById(R.id.pager);
        list = new ArrayList<MyFragment>();
        list.add(new MyFragment());
        list.add(new MyFragment());
        list.add(new MyFragment());
        //创建自定的适配器对象
        MyAdapter adapter=new MyAdapter(getSupportFragmentManager(), list);
        pager.setAdapter(adapter);




        LinearLayout layout = (LinearLayout) this.findViewById(R.id.layout);
        //获取LinearLayout容器
        final int num = layout.getChildCount();
        //获取容器的子控件个数
        textView = new TextView[num];
        //实例化标题数组
        for (int i = 0; i < num; i++) {
            textView[i] = (TextView) layout.getChildAt(i);//循环获取子控件
            textView[i].setText(data[i]);//设置标题
            textView[i].setTag(i);//设置标识
            textView[i].setBackgroundColor(Color.GRAY);//初始化每个控件都设置背景为灰色

            /**
             *
             * 循环对容器中的每个子控件监听
             */
            textView[i].setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    int item = (Integer) view.getTag();//获取控件标识
                    pager.setCurrentItem(item);//切换pagerView
                    for (int i1 = 0; i1 < num; i1++) {
                        textView[i1].setBackgroundColor(Color.GRAY);//所有标签都改为灰色
                    }
                    textView[item].setBackgroundColor(Color.YELLOW);//选中的标签为黄色

                }
            });
            textView[i].setEnabled(true);//设置标签是否可点击
        }
        textView[0].setBackgroundColor(Color.YELLOW);//初始化默认第一个为选中状态


        pager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {


            }

            @Override
            /**
             * pagerView被切换后自动执行的方法
             */
            public void onPageSelected(int position) {


            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }
    /**
     * 定义FragmentPager适配器类
     */
    class MyAdapter extends FragmentPagerAdapter
    {
    private List<MyFragment> fragments;//fragment管理员
    private FragmentManager fm;//fragment数组

        /**
         * 构造函数
         * @param fm fragment管理员对象
         * @param fragmentList fragment数组
         */
    public MyAdapter(FragmentManager fm, List<MyFragment> fragmentList) {
        super(fm);
        this.fragments=fragmentList;
        this.fm=fm;
    }


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

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

    public void select() {

    }
}

activity对应的xml文件：

<?xml version="1.0" encoding="utf-8"?>
<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: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.example.administrator.myapplication.PagerActivity"
    android:orientation="vertical">


    <LinearLayout
        android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    >
    <TextView
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="tab1"
        android:gravity="center"
        android:layout_marginLeft="1dp"
        android:background="#cc0"
        />
    <TextView
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="tab2"
        android:gravity="center"
        android:layout_marginLeft="1dp"
        android:background="#cc0"
        />
    <TextView
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="tab3"
        android:gravity="center"
        android:layout_marginLeft="1dp"
        android:background="#cc0"
        />

</LinearLayout>


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

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