android使用viewpager计算偏移量实现选项卡功能

<?xml version="1.0" encoding="utf-8"? 
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:clipToPadding="true"
 android:fitsSystemWindows="true"
 android:background="@color/bg_color" 

 <LinearLayout
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="@color/bag_gray"
 android:orientation="vertical" 

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="36dp"
  android:background="@android:color/white"
  android:orientation="horizontal"
  android:weightSum="3" 

  <TextView
  android:id="@+id/tab1_tv"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_gravity="center"
  android:layout_weight="1"
  android:gravity="center"
  android:text="商品"
  android:textColor="@color/title_bag"
  android:textSize="18sp" / 

  <TextView
  android:id="@+id/tab2_tv"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_gravity="center"
  android:layout_weight="1"
  android:gravity="center"
  android:text="评价"
  android:textColor="@color/text_color_context"
  android:textSize="18sp" / 
  <TextView
  android:id="@+id/tab3_tv"
  android:layout_width="0dp"
  android:layout_height="wrap_content"
  android:layout_gravity="center"
  android:layout_weight="1"
  android:gravity="center"
  android:text="详情"
  android:textColor="@color/text_color_context"
  android:textSize="18sp" / 

 </LinearLayout 

 <View
  android:layout_width="match_parent"
  android:layout_height="0.5dp"
  android:background="@color/text_color_context" / 
 <View
  android:id="@+id/cursor"
  android:layout_width="50dp"
  android:layout_height="2dp"
  android:layout_marginLeft="40dp"
  android:layout_marginTop="0dip"
  android:background="@color/title_bag"
  / 
 <android.support.v4.view.ViewPager
  android:id="@+id/thire_vp"
  android:layout_width="match_parent"
  android:layout_height="match_parent"/ 
 </LinearLayout 

</LinearLayout 

public class FragmentAdapter extends FragmentPagerAdapter {
 private ArrayList<Fragment  list;
 FragmentManager fm;

 public FragmentAdapter(FragmentManager fm, ArrayList<Fragment  list){
 super(fm);
 this.fm = fm;
 this.list = list;
 }

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

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

public class OneFragment extends Fragment {

 @Nullable
 @Override
 public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
 View view = inflater.inflate(R.layout.fragment_one,null);
 return view;
 }
}

public class MainActivity extends FragmentActivity implements ViewPager.OnPageChangeListener,View.OnClickListener{
private TextView tab1Tv;
private TextView tab2Tv;
private TextView tab3Tv;
private View cursor;
private ViewPager thirdVp;
private ArrayList<Fragment  fragmentlist;
private int offset = 0;
private int screenWidth = 0;
private int screenl_3;
private LinearLayout.LayoutParams lp;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_product);
//绑定控件
tab1Tv = (TextView)findViewById(R.id.tab1_tv);
tab2Tv = (TextView)findViewById(R.id.tab2_tv);
tab3Tv = (TextView)findViewById(R.id.tab3_tv);
cursor = (View) findViewById(R.id.cursor);
thirdVp = (ViewPager) findViewById(R.id.thire_vp);
//获取屏幕宽度
DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
screenWidth = dm.widthPixels;
screenl_3 = screenWidth/3; //裁剪3分之1
lp = (LinearLayout.LayoutParams)cursor.getLayoutParams();
fragmentlist = new ArrayList< ();
fragmentlist.add(new OneFragment());
fragmentlist.add(new TwoFragment());
fragmentlist.add(new ThreeFragment());
thirdVp.setAdapter(new FragmentAdapter(getSupportFragmentManager(),fragmentlist));
thirdVp.setCurrentItem(0);
thirdVp.setOffscreenPageLimit(2);
thirdVp.setOnPageChangeListener(this);
tab1Tv.setOnClickListener(this);
tab2Tv.setOnClickListener(this);
tab3Tv.setOnClickListener(this);
}
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
offset = (screenl_3-cursor.getLayoutParams().width)/2;
Log.d("TAG", "111----"+position + "--" + positionOffset + "--"
+ positionOffsetPixels);
final float scale = getResources().getDisplayMetrics().density;
if (position == 0){
lp.leftMargin = (int)(positionOffsetPixels/3)+offset;
}else if(position ==1){
lp.leftMargin = (int)(positionOffsetPixels/3)+screenl_3+offset;
}
cursor.setLayoutParams(lp);
upTextcolor(position);
}
private void upTextcolor(int position){
if (position==0){
tab1Tv.setTextColor(getResources().getColor(R.color.title_bag));
tab2Tv.setTextColor(getResources().getColor(R.color.text_color_context));
tab3Tv.setTextColor(getResources().getColor(R.color.text_color_context));
}else if(position==1){
tab1Tv.setTextColor(getResources().getColor(R.color.text_color_context));
tab2Tv.setTextColor(getResources().getColor(R.color.title_bag));
tab3Tv.setTextColor(getResources().getColor(R.color.text_color_context));
}else if(position==2){
tab1Tv.setTextColor(getResources().getColor(R.color.text_color_context));
tab2Tv.setTextColor(getResources().getColor(R.color.text_color_context));
tab3Tv.setTextColor(getResources().getColor(R.color.title_bag));
}
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.tab1_tv:
thirdVp.setCurrentItem(0);
break;
case R.id.tab2_tv:
thirdVp.setCurrentItem(1);
break;
case R.id.tab3_tv:
thirdVp.setCurrentItem(2);
break;
}
}
}