viewpager+FragmentAdapter实现App主界面Tab

viewpager+FragmentAdapter 实现可滑动的Fragment 管理的Tab App主界面

Fragment 作为内容区域 ；管理自己的布局中的控件，事件和逻辑。 减轻MainActivity 的代码冗余 MainActivity 只起到一个调度Fragment 的作用，Viewpager 实现了界面滑动

如果界面需要滑动则使用viewpager+FragmentAdapter 如果界面不需要滑动则使用 Fragment 请看这篇博客:

[androidFragment实现APP主界面Tab页面切换和点击事件] (http://blog.csdn.net/u012373815/article/details/47709213)

效果图



案例源代码下载

Fragment+Viewpager实现app主界面.zip

案例结构



Fragment1.java Fragment2.java Fragment3.java

tab1.xml tab2.xml tab3.xml bottom.xml 的代码和这篇博客一样参照

android Fragment实现APP主界面Tab页面切换和点击事件

这里我就主要写一下 （为了兼容性请都引用android.support.v4.app）

MainActivity.java

import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;

public class MainActivity extends FragmentActivity  implements OnClickListener {
private ViewPager viewpager;
private TextView t1, t2, t3;
private FragmentPagerAdapter fAdapter;
private List<Fragment> mFragments;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initEvent();
setSelect(0);
}

/*
* 初始化点击
*/
private void initEvent() {
// TODO Auto-generated method stub
t1.setOnClickListener(this);
t2.setOnClickListener(this);
t3.setOnClickListener(this);
}

// 初始化
private void initView() {
viewpager = (ViewPager) findViewById(R.id.viewpager);

t1 = (TextView) findViewById(R.id.text1);
t2 = (TextView) findViewById(R.id.text2);
t3 = (TextView) findViewById(R.id.text3);

mFragments=new ArrayList<Fragment>();
Fragment tab1=new Fragment1();
Fragment tab2=new Fragment2();
Fragment tab3=new Fragment3();
mFragments.add(tab1);
mFragments.add(tab2);
mFragments.add(tab3);

//适配器
fAdapter =new FragmentPagerAdapter(getSupportFragmentManager()) {

@Override
public int getCount() {
// TODO Auto-generated method stub
return mFragments.size();
}

@Override
public Fragment getItem(int arg0) {
//根据位置返回Fragment
return mFragments.get(arg0);
}
};
//添加内容到viewpager
viewpager.setAdapter(fAdapter);
//建立滑动监听
viewpager.setOnPageChangeListener(new OnPageChangeListener() {

@Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
int currentItem=viewpager.getCurrentItem();
setTab(currentItem);

}

@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub

}

@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub

}
});

}

/**
* 将tab 的text 初始化
*/
public void reset() {
t1.setText("标题1");
t2.setText("标题2");
t3.setText("标题3");
}

@Override
public void onClick(View v) {
// TODO Auto-generated method stub
reset();
switch (v.getId()) {
case R.id.text1:
setSelect(0);
break;
case R.id.text2:
setSelect(1);
break;
case R.id.text3:
setSelect(2);
break;
default:
break;
}
}
private void setSelect(int i) {
setTab(i);
//设置那个fragment 显示
viewpager.setCurrentItem(i);
}
//重用的代码抽出为方法   alt+shift+m  抽出代码的快捷键
private void setTab(int i) {
reset();
switch (i) {
case 0:
t1.setText("选中");
break;
case 1:
t2.setText("选中");
break;
case 2:
t3.setText("选中");
break;
}
}
}

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EEEEEE"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
></android.support.v4.view.ViewPager>
<include layout="@layout/bottom" />
</LinearLayout>