ViewPager结合Fragment
viewPager是我们项目中经常需要用到的控件,而这种控件也往往和Fragment碎片一起使用,最近业务有涉及这部分的需求,特此学习记录一下。
首先是ViewPager的组成:布局文件中的Viewpager(用于绑定Fragment)、 List集合存放Fragment、Viewpager的适配器
其次是流程:1、List中添加fragment 2、adapter获取Fragment管理器 3、viewpager设置adapter
比如这类需求
首先是MainActivity
public class MainActivity extends FragmentActivity implements ViewPager.OnPageChangeListener, View.OnClickListener {
private ViewPager mViewPager;
private TextView mTvFirst,mTvSecond,mTvThird;
//定义一个list来存放Fragment
private List<Fragment> fragmentList;
//自定义一个适配器
private ViewPagerAdapter mAdater;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initEvent();
// adapter获取Fragment管理器
mAdater = new ViewPagerAdapter(getSupportFragmentManager());
// viewpager设置adapter
mViewPager.setAdapter(mAdater);
}
//初始化控件
private void initView() {
// 绑定控件
mViewPager = findViewById(R.id.vp_viewpager);
mTvFirst = findViewById(R.id.tv_dial);
mTvSecond = findViewById(R.id.tv_contacts);
mTvThird = findViewById(R.id.tv_sms);
// 添加fragment
fragmentList = new ArrayList<>();
fragmentList.add(new RecommandFragment());
fragmentList.add(new NewsFragment());
fragmentList.add(new MyFragment());
//默认进入应用第一个被选中
InitTextViewColor();
mTvFirst.setTextColor(Color.parseColor("#1FB79F"));
}
//设置监听
private void initEvent() {
mViewPager.addOnPageChangeListener(this);
mTvFirst.setOnClickListener(this);
mTvSecond.setOnClickListener(this);
mTvThird.setOnClickListener(this);
}
//颜色初始化
private void InitTextViewColor() {
mTvFirst.setTextColor(Color.WHITE);
mTvSecond.setTextColor(Color.WHITE);
mTvThird.setTextColor(Color.WHITE);
}
/**
* 页面滑动过程中回调
* @param position
* @param v
* @param i1
*/
@Override
public void onPageScrolled(int position, float v, int i1) {
}
/**
* 页面被选择时候的回调
* @param position
*/
@Override
public void onPageSelected(int position) {
InitTextViewColor();
switch (position) {
case 0:
mTvFirst.setTextColor(Color.parseColor("#1FB79F"));
break;
case 1:
mTvSecond.setTextColor(Color.parseColor("#1FB79F"));
break;
case 2:
mTvThird.setTextColor(Color.parseColor("#1FB79F"));
break;
}
}
/**
* 页面滑动状态监听
* @param state
*/
@Override
public void onPageScrollStateChanged(int state) {
}
/**
* 当点击标题的时候,通过传入当前点击的页面的position,调用mViewPager.setCurrentItem()来实现页面的变化
* @param v
*/
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.tv_dial:
mViewPager.setCurrentItem(0);
break;
case R.id.tv_contacts:
mViewPager.setCurrentItem(1);
break;
case R.id.tv_sms:
mViewPager.setCurrentItem(2);
break;
}
}
/**
* 创建适配器
*/
class ViewPagerAdapter extends FragmentPagerAdapter {
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
//获取Fragment
@Override
public Fragment getItem(int position) {
return fragmentList.get(position);
}
//显示的个数
@Override
public int getCount() {
return fragmentList.size();
}
}
}
MainAcivity的布局文件
<?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:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#333444"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_dial"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="推荐"
android:textColor="#ffffff"
android:textSize="18sp"
tools:ignore="HardcodedText" />
<TextView
android:id="@+id/tv_contacts"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="新闻"
android:textColor="#ffffff"
android:textSize="18sp"
tools:ignore="HardcodedText" />
<TextView
android:id="@+id/tv_sms"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="我的"
android:textColor="#ffffff"
android:textSize="18sp"
tools:ignore="HardcodedText" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="@+id/vp_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Viewpager里面对应的Fragment代码
public class MyFragment extends android.support.v4.app.Fragment {
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_mine, container, false);
return view;
}
}
Fragment布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:text="这个是我的Fragment"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="30dp" />
</LinearLayout>
参考代码 无积分,免费的