ViewPager与Fragment结合的简单使用

来源：互联网发布：php网站漏洞扫描工具编辑：程序博客网时间：2024/05/10 03:50

提供ViewPager与Fragment的简单实用方法，提供一个使用思路。

供初学者使用，不喜勿喷。

效果如下

使用方法：

1.首先我们要有自己的控件（这不是废话么！！）上边有三个按钮，下边放Viewpager

<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"    tools:context="text.an.com.vapdemp.MainActivity">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal"        android:id="@+id/linearLayout">        <Button            android:id="@+id/but1"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="#ff0"            android:text="第一个"/>        <Button            android:id="@+id/but2"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="#fff"            android:text="第二个"/>        <Button            android:id="@+id/but3"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="#fff"            android:text="第三个"/>    </LinearLayout>    <android.support.v4.view.ViewPager        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/vp"        android:layout_below="@+id/linearLayout"        android:layout_alignParentStart="true" /></RelativeLayout>

2.适配自己的fragment，以便使用，这里我们只给一个简单的一个布局

----布局，只给一个简单的文本布局，再给一个北京就好了，可以自选颜色，

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent">    <TextView        android:id="@+id/fragment1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:background="#ff0"        android:text="fragment1"/></LinearLayout>

----代码示意，简单点容易了解

public class Fragment1 extends Fragment{    private View view;    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {        view = inflater.inflate(R.layout.fragment1, container, false);        return view;    }}

3.我们将fragment添加到ViewPager里边代码如下

（1），创建适配器：viewPager.setAdapter(new FragmentPagerAdapter( getSupportFragmentManager())

切记，一定要加getSupportFragmentManager()

（2），重写里边的方法在 getCount() 中返回的是Framgent的个数

在 getItem中条目展示类型.

vp.setAdapter(new FragmentPagerAdapter(                getSupportFragmentManager()) {            //            @Override            public int getCount() {                return 3;            }            //条目展示类型.            @Override            public Fragment getItem(int position) {                Fragment fragment = null;                switch (position) {                    case 0:                        fragment = new Fragment1();                        break;                    case 1:                        fragment = new Fragment2();                        break;                    case 2:                        fragment = new Fragment3();                        break;                }                return fragment;            }        });

4.给每一个按钮一个点击事件，通过点击事件给边按钮的背景色，以及vp的item

    @Override    public void onClick(View view) {        switch (view.getId()){            case R.id.but1:                switchBut(1);                vp.setCurrentItem(0);                break;            case R.id.but2:                switchBut(2);                vp.setCurrentItem(1);                break;            case R.id.but3:                switchBut(3);                vp.setCurrentItem(2);                break;        }    }

上边调用的方法，我们抽出来一个方法下边还有调用

    private void switchBut(int i) {        switch (i){            case 1:                but1.setBackgroundColor(Color.YELLOW);                but2.setBackgroundColor(Color.WHITE);                but3.setBackgroundColor(Color.WHITE);                break;            case 2:                but1.setBackgroundColor(Color.WHITE);                but2.setBackgroundColor(Color.YELLOW);                but3.setBackgroundColor(Color.WHITE);                break;            case 3:                but1.setBackgroundColor(Color.WHITE);                but2.setBackgroundColor(Color.WHITE);                but3.setBackgroundColor(Color.YELLOW);                break;        }    }

5.给ViewPager一个监听事件

vp.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {            @Override            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {            }            @Override            public void onPageSelected(int position) {                switch (position){                    case 0:                        switchBut(1);                        break;                    case 1:                        switchBut(2);                        break;                    case 2:                        switchBut(3);                        break;                }            }            @Override            public void onPageScrollStateChanged(int state) {            }        });

2 0