首页 > 代码库 > android Tab =viewpager+fragmnet
android Tab =viewpager+fragmnet
1.定义几个fragment 的subclass 如fragmentone，fragmenttwo;
public class fragmentthree extends Fragment { private View view; /** * */ @Override public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle SaveInflaterState){ view=inflater.inflate(R.layout.fragmentthree, container, false); return view; }}
布局就是一个简单的TextView
<?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:layout_height="wrap_content" android:layout_width="match_parent" android:text="three fragment" /></LinearLayout>
2.主布局是这样的
<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" > <android.support.v4.view.ViewPager android:id="@+id/mViewpager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_gravity="center" android:layout_weight="1" /> <include layout="@layout/top1" /> </LinearLayout>
其中的top1.xml 如下；定义了三个TextView 作为Tab；
<?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="wrap_content" android:orientation="vertical" > <ImageView android:id="@+id/cursor_line" android:layout_width="fill_parent" android:layout_height="10dp" android:scaleType="matrix" android:src="@drawable/ic_launcher" /> <LinearLayout android:layout_width="match_parent" android:layout_height="30dp" android:orientation="horizontal" > <TextView android:id="@+id/tab01" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:text="tab01" /> <TextView android:id="@+id/tab02" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:text="tab02" /> <TextView android:id="@+id/tab03" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1" android:gravity="center" android:text="tab03" /> </LinearLayout></LinearLayout>
3.初始化viewpager
3.1
/*
* 初始化viewpager 1. 数据源 定义了一个List<Fragment> 并添加 Fragment 类 Subclass
* 如fragmentone; 2. 添加适配器 FragmentAdapter ;实例化FragmentAdapter 接口； 3.为
* viewpager 设置适配器；
*/
public void initview() { // TODO Auto-generated method stub lf = new ArrayList<Fragment>(); // 1 lf.add(new fragmentone()); lf.add(new fragmenttwo()); lf.add(new fragmentthree()); mFragAdapter madapter = new mFragAdapter(getSupportFragmentManager(), lf);// 2 vp = (ViewPager) findViewById(R.id.mViewpager); vp.setAdapter(madapter);// 3 vp.setCurrentItem(0); vp.setOnPageChangeListener(new OnPageChangeListener() { @Override public void onPageSelected(int position) { // TODO Auto-generated method stub mCurrentPageIndex = position; tab1.setTextColor(Color.BLACK); tab2.setTextColor(Color.BLACK); tab3.setTextColor(Color.BLACK); switch (position) { case 0: tab1.setTextColor(Color.RED); break; case 1: tab2.setTextColor(Color.RED); break; case 2: tab3.setTextColor(Color.RED); break; } } @Override public void onPageScrolled(int position, float positionOffset, int arg2) { // TODO Auto-generated method stub //Log.e("TAG", position + "------->" + positionOffset); LinearLayout.LayoutParams lp = (android.widget.LinearLayout.LayoutParams) mTabline .getLayoutParams(); if (mCurrentPageIndex > position) { lp.leftMargin = (int) (mCurrentPageIndex * mScreen1_3 + (positionOffset - 1) * mScreen1_3); } else { lp.leftMargin = (int) (mCurrentPageIndex * mScreen1_3 + positionOffset * mScreen1_3); } mTabline.setLayoutParams(lp); } @Override public void onPageScrollStateChanged(int arg0) { // TODO Auto-generated method stub } }); }
其中适配器如下；
public class mFragAdapter extends FragmentPagerAdapter { private List<Fragment> mFragments; public mFragAdapter(FragmentManager fm, List<Fragment> fragments) { super(fm); // TODO Auto-generated constructor stub mFragments = fragments; } @Override public Fragment getItem(int position) { // TODO Auto-generated method stub return mFragments.get(position); } @Override public int getCount() { // TODO Auto-generated method stub return mFragments.size(); } }
4.初始化Tab的滑动条的宽度
/* * 初始化滑动条的宽度 设置为手机屏幕的1/3 */ private void initTabLine() { mTabline = (ImageView) findViewById(R.id.cursor_line); Display display = getWindow().getWindowManager().getDefaultDisplay(); DisplayMetrics outMetrics = new DisplayMetrics(); display.getMetrics(outMetrics); mScreen1_3 = outMetrics.widthPixels / 3;// 屏幕的1/3 // LayoutParams lp = (LayoutParams) mTabline.getLayoutParams(); LinearLayout.LayoutParams lp = (android.widget.LinearLayout.LayoutParams) mTabline .getLayoutParams(); lp.width = mScreen1_3; mTabline.setLayoutParams(lp); }
在3. 中同时定义了刚滑动viewpager 是Tab的滑动条也跟着一起动；
5.Tab按钮的点击事件的定义；
/* * 初始化tab按钮的事件； 点击某个tab按钮 viewpager 转换fragment 通过ViewPager * 类的setCurrentIndex()方法设置需要跳转的fragment */ private void initTabBtn() { tab1 = (TextView) findViewById(R.id.tab01); tab2 = (TextView) findViewById(R.id.tab02); tab3 = (TextView) findViewById(R.id.tab03); tab1.setOnClickListener(new mlistenter()); tab2.setOnClickListener(new mlistenter()); tab3.setOnClickListener(new mlistenter()); tab1.setTextColor(Color.RED); }
public class mlistenter implements View.OnClickListener { @Override public void onClick(View v) { // TODO Auto-generated method stub switch (v.getId()) { case R.id.tab01: vp.setCurrentItem(0); break; case R.id.tab02: vp.setCurrentItem(1); break; case R.id.tab03: vp.setCurrentItem(2); break; } } }
其实就是通
vp.setCurrentItem(_index)来设置点击Tab按钮后的viewpager 要显示哪一个fragment
android Tab =viewpager+fragmnet
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。