Android ViewPager的使用方法

以前在写一个小app —— 个人博客客户端——My CSDN 的实现的时候，就使用过ViewPager来呈现界面切换的效果，可是隔的时间长了，今天要使用的时候却忘了使用方法，琢磨了一下才又明白了
这里就来记录一下吧
ViewPager是android扩展包v4包下的类，这个类可以让用户左右切换当前的View，在这里我使用的View是Fragment，并使用FragmentPagerAdapter作为其适配器

首先，新建三个布局文件，以下是tab1.xml的布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
 android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:gravity="center"
android:text="Tab 1"
android:textSize="40sp" />

<Button
 android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="改变文字" />

</RelativeLayout>

其余两个布局文件：tab2.xml , tab3.xml的布局与之类似，只是TextView的文本内容有相应改动而已，Button在之后会用到

然后，再来建立三个Fragment，我这里使用的是android.support.v4.app.Fragment之下的Fragment

大致代码如下

/**
 * Created by ZY on 2016/9/14.
 */
public class Tab1 extends Fragment {

private View view;

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

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        view = inflater.inflate(R.layout.tab1, null);
        Button button = (Button) this.view.findViewById(R.id.button);
        button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
                TextView textView = (TextView) view.findViewById(R.id.text);
                textView.setText("被改变了文字");
            }
        });
return view;
    }

}

Button设置了点击事件，在点击后改变TextView的文本内容

再新建一个PagerAdapter类继承于FragmentPagerAdapter，自定义ViewPager的适配器

/**
 * Created by ZY on 2016/9/14.
 */
public class PagerAdapter extends FragmentPagerAdapter {

private List<Fragment> fragmentList;

public PagerAdapter(FragmentManager fm) {
super(fm);
    }

public PagerAdapter(List<Fragment> fragmentList, FragmentManager fm) {
super(fm);
this.fragmentList = fragmentList;
    }

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

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

}

重写了构造函数与父类的两个方法

在MainActivity中就可以来进行界面初始化了

public class MainActivity extends AppCompatActivity {

private ViewPager viewPager;

private List<Fragment> fragmentList;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager = (ViewPager) findViewById(R.id.viewPager);
        fragmentList = new ArrayList<>();
        Tab1 tab1 = new Tab1();
        Tab2 tab2 = new Tab2();
        Tab3 tab3 = new Tab3();
        fragmentList.add(tab1);
        fragmentList.add(tab2);
        fragmentList.add(tab3);
        PagerAdapter adapter = new PagerAdapter(fragmentList, getSupportFragmentManager());
        viewPager.setAdapter(adapter);
    }
}

效果图如下：

Android ViewPager的使用方法

可以看到已经能够进行Fragment滑动切换了
不过有一个问题，当点击了Tab 1页面下的Button改变了文本内容后，切换到Tab 2页面，再切换回Tab 1页面，此时文本内容没有改变，如果切换到Tab 3页面，再切换回Tab 1页面，此时文本内容又恢复为原来的文本了，说明Tab 1页面又重建了

如果想避免这种情况，可以修改Fragment的onCreateView方法，在返回View之前判断其是否为空，否的话直接返回，为空的话再来重新初始化

 @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
if (view == null) {
            view = inflater.inflate(R.layout.tab1, null);
            Button button = (Button) this.view.findViewById(R.id.button);
            button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
                    TextView textView = (TextView) view.findViewById(R.id.text);
                    textView.setText("被改变了文字");
                }
            });
        }
return view;
    }

这样，效果图如下

Android ViewPager的使用方法

可以看到，切换到Tab 3页面后再切换回Tab 1页面，此时TextView依然是改变后的内容，说明还是保留着之前的Fragment

秒客网

Android ViewPager的使用方法

相关文章