Android一个页面一个tab页,Andorid ViewPager+PageAdapter+Fragment实现多个tab页

一、文章内容

现在常见的Android或者iOS应用中都可以看到一个页面的下面有多个tab,点击不同的tab页面重新加载。现使用Android提供的ViewPager、PageAdapter和Fragment简单实现这一功能。

二、ViewPager简介

首先为了让页面能够左右滑动，我们需要采用ViewPager这一Android官方提供的组件。在Android Reference中有提到，ViewPager让用户可以左右滑动来切换页面，当然也可以通过点击底部的tab来切换页面。使用ViewPager方式简单，需要以下两步：

添加相应的布局文件

android:id="@+id/t_ViewPager"

android:layout_width="match_parent"

android:layout_height="0dp"

android:layout_weight="1" />

在代码中加载布局文件并显示

ViewPager t_ViewPager = (ViewPager) findViewById(R.id.t_ViewPager);

但viewpager具体的职责应该负责加载、缓存view页面和切换显示不同的fragment。加载和缓存view暂且不深入讨论，对于滑动页面显示新的fragment，这里简单的说一下。

三、OnPageChangeListener简介

OnPageChangeListener是ViewPager类内部的一个接口，它就是负责对界面滑动的监听。它总共有三个方法，源码如下：

public interface OnPageChangeListener {

/**

* This method will be invoked when the current page is scrolled, either as part

* of a programmatically initiated smooth scroll or a user initiated touch scroll.

*

* @param position Position index of the first page currently being displayed.

* Page position+1 will be visible if positionOffset is nonzero.

* @param positionOffset Value from [0, 1) indicating the offset from the page at position.

* @param positionOffsetPixels Value in pixels indicating the offset from position.

*/

void onPageScrolled(int position, float positionOffset, int positionOffsetPixels);

/**

* This method will be invoked when a new page becomes selected. Animation is not

* necessarily complete.

*

* @param position Position index of the new selected page.

*/

void onPageSelected(int position);

/**

* Called when the scroll state changes. Useful for discovering when the user

* begins dragging, when the pager is automatically settling to the current page,

* or when it is fully stopped/idle.

*

* @param state The new scroll state.

* @see ViewPager#SCROLL_STATE_IDLE

* @see ViewPager#SCROLL_STATE_DRAGGING

* @see ViewPager#SCROLL_STATE_SETTLING

*/

void onPageScrollStateChanged(int state);

}

三个方法共同处理页面滑动相关的监听，第一个方法onPageScrolled(int position, float positionOffset, int positionOffsetPixels)是在页面滑动过程中不断的调用；第二个方法onPageSelected(int position)会在一个新的页面被选中时被调用(页面被选中也有相应的判定法则)；第三个方法onPageSelected(int position)，会在用户的滑动状态改变时调用。OnPageChangeListener解决的是动作相关的问题，但数据我们还没有解决，也就是存放所以我们还需要一个存放所有的view的组件，我们使用FragmentPagerAdapter，用来存放所有的fragment。

四、FragmentPagerApapter简介

FragmentPagerApapter继承自PagerAdapter，所以我们可以新建一个类，继承FragmentPagerApapter并实现它的一些方法来存放所有的fragment。FragmentPagerApapter主要的管理fragment的方法如下：

@Override

public Fragment getItem(int position) {

return fragments.get(position);

}

@Override

public int getItemPosition(Object object) {

return super.getItemPosition(object);

}

@Override

public int getCount() {

return fragments.size();

}

通过方法名就能知道每个方法时有什么作用，就不再赘述。

四、应用demo

创建ViewPager

ViewPager t_ViewPager = (ViewPager) findViewById(R.id.t_ViewPager);

自定义一个adapter，继承FragmentPagerAdapter并实现OnPageChangeListener

//这种实现参考了GitHub上一个开源项目(https://github.com/yingLanNull/AlphaTabsIndicator)，但对刷新自己重新实现了一下

private class AdapterAndListener extends FragmentPagerAdapter implements ViewPager.OnPageChangeListener {

private List fragments = new ArrayList<>();

private String[] titles = {"班级", "发布", "我"};

public MainAdapter(FragmentManager fm) {

super(fm);

fragments.add(TextFragment3.newInstance(titles[(int)(Math.random()*3)]));

fragments.add(TextFragment2.newInstance(titles[(int)(Math.random()*3)]));

fragments.add(TPersonalInfoFragment.getInstance(loginResult));

}

@Override

public Fragment getItem(int position) {

return fragments.get(position);

}

@Override

public int getItemPosition(Object object) {

return super.getItemPosition(object);

}

@Override

public int getCount() {

return fragments.size();

}

@Override

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

}

@Override

public void onPageSelected(int position) {

if (position==2){

((TPersonalInfoFragment)fragments.get(position)).update();

}

}

@Override

public void onPageScrollStateChanged(int state) {

}

}

这里的AdapterAndListener在继承FragmentPagerAdapter的同时并实现了ViewPager.OnPageChangeListener接口，所以它在管理所有页面的同时可以对页面的动作进行监听，根据用户的动作(如切换页面)而更新相应的方法。如：

@Override

public void onPageSelected(int position) {

if (position==2){

((TPersonalInfoFragment)fragments.get(position)).update();

}

}

当用户滑动到第三个界面时，则调用对应的fragment的更新方法

自定义fragment的设计

public class TPersonalInfoFragment extends Fragment {

private JSONObject shownData;

private TextView usernameView;

private TextView nameView;

private TextView typeView;

private TextView genderView;

private TextView emailView;

private TextView schoolIdView;

@Nullable

@Override

public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

View personalInfoView = inflater.inflate(R.layout.fragment_teacher_personal, container, false);

Log.d("teacher","done2");

usernameView = (TextView) personalInfoView.findViewById(R.id.t_username);

nameView = (TextView) personalInfoView.findViewById(R.id.t_name);

typeView = (TextView) personalInfoView.findViewById(R.id.t_type);

genderView = (TextView) personalInfoView.findViewById(R.id.t_gender);

emailView = (TextView) personalInfoView.findViewById(R.id.t_email);

schoolIdView = (TextView) personalInfoView.findViewById(R.id.t_schoolId);

if (shownData!=null){

try {

usernameView.setText(shownData.getString("username"));

nameView.setText(shownData.getString("name"));

typeView.setText(DataTransform.transformType(shownData.getString("type")));

genderView.setText(DataTransform.transformGender(shownData.getString("gender")));

emailView.setText(shownData.getString("email"));

schoolIdView.setText(shownData.getString("schoolId"));

} catch (JSONException e) {

e.printStackTrace();

}

}

return personalInfoView;

}

public static TPersonalInfoFragment getInstance(JSONObject data){

TPersonalInfoFragment fragment = new TPersonalInfoFragment();

Log.d("teacher","done1");

fragment.shownData = data;

return fragment;

}

public void update(){

UserInfo userInfo = (UserInfo) getActivity().getApplication();

final JSONObject param = new JSONObject();

try {

param.put("username",userInfo.getUserName());

param.put("password",userInfo.getPassword());

} catch (JSONException e) {

e.printStackTrace();

}

final Handler handler = new Handler();

new Thread(new Runnable() {

@Override

public void run() {

final JSONObject newData = NetUtil.myPost("/user/auth",param);

handler.post(new Runnable() {

@Override

public void run() {

if (!shownData.equals(newData)){

shownData = newData;

try {

usernameView.setText(newData.getString("username"));

nameView.setText(newData.getString("name"));

typeView.setText(DataTransform.transformType(newData.getString("type")));

genderView.setText(DataTransform.transformGender(newData.getString("gender")));

emailView.setText(newData.getString("email"));

schoolIdView.setText(newData.getString("schoolId"));

} catch (JSONException e) {

e.printStackTrace();

}

}

}

});

}

}).start();

}

}

在TPersonalInfoFragment中，提供一个获取TPersonalInfoFragment 实例getInstance方法，需要传入用户登录之后服务器返回的一个JsonObject，然后根据onCreateView()方法在创建fragment界面的时候调用，设置相应的数据并展示。此外，TPersonalInfoFragment中还有一个update()方法，在实现onPageSelected(int position)方法时，调用这个update()方法，从服务器获取新的数据并更新不同组件上的数据，从而实现刷功能。(注意：这边请求服务端数据必须重新开启一个线程执。)