先上图：
不用美工模仿tab
tab由radiogroup自定义而来，加上viewpager和fragment的联动
主页面的代码：
public class MainActivity extends BaseActivity {
@ViewInject(R.id.rgp_container)
private RadioGroup rgp_container;
@ViewInject(R.id.rb_rdio1)
private RadioButton rb_rdio1;
@ViewInject(R.id.rb_rdio2)
private RadioButton rb_rdio2;
@ViewInject(R.id.rb_rdio3)
private RadioButton rb_rdio3;
@ViewInject(R.id.rb_rdio4)
private RadioButton rb_rdio4;
@ViewInject(R.id.tab_vpager)
private ViewPager tab_vpager;
@SuppressLint("UseSparseArrays")
private Map<Integer, Fragment> mCacheFragments = new HashMap<Integer, Fragment>();
private Fragment mFm = null;
private Bundle bundle = null;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewUtils.inject(this);
initViewControls();
}
private void initViewControls() {
rgp_container.setOnCheckedChangeListener(changeL);
tab_vpager.setAdapter(new MyViewPagerAdapter(getSupportFragmentManager()));
tab_vpager.setOffscreenPageLimit(4);
tab_vpager.setOnPageChangeListener(pageL);
}
private class MyViewPagerAdapter extends FragmentPagerAdapter {
public MyViewPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public int getCount() {
return 4;
}
@Override
public Fragment getItem(int position) {
if (mCacheFragments.containsKey(position)) {
mFm = mCacheFragments.get(position);
} else {
switch (position) {
case 0:
mFm = FragmentTest.newInstance();
bundle = new Bundle();
bundle.putString("Title", "项目1");
mFm.setArguments(bundle);
break;
case 1:
mFm = FragmentTest.newInstance();
bundle = new Bundle();
bundle.putString("Title", "项目2");
mFm.setArguments(bundle);
break;
case 2:
mFm = FragmentTest.newInstance();
bundle = new Bundle();
bundle.putString("Title", "项目3");
mFm.setArguments(bundle);
break;
case 3:
mFm = FragmentTest.newInstance();
bundle = new Bundle();
bundle.putString("Title", "项目4");
mFm.setArguments(bundle);
break;
default:
break;
}
mCacheFragments.put(position, mFm);
}
return mFm;
}
}
private OnPageChangeListener pageL = new OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
if (position == 0) {
rb_rdio1.setChecked(true);
} else if (position == 1) {
rb_rdio2.setChecked(true);
} else if (position == 2) {
rb_rdio3.setChecked(true);
} else if (position == 3) {
rb_rdio4.setChecked(true);
}
}
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
private OnCheckedChangeListener changeL = new OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch (checkedId) {
case R.id.rb_rdio1:
tab_vpager.setCurrentItem(0, true);
break;
case R.id.rb_rdio2:
tab_vpager.setCurrentItem(1, true);
break;
case R.id.rb_rdio3:
tab_vpager.setCurrentItem(2, true);
break;
case R.id.rb_rdio4:
tab_vpager.setCurrentItem(3, true);
break;
default:
break;
}
}
};
}主页面的布局：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RadioGroup
android:id="@+id/rgp_container"
android:layout_width="match_parent"
android:layout_height="35dp"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:layout_marginTop="20dp"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/rb_rdio1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:background="@drawable/radio_left_bg"
android:button="@null"
android:checked="true"
android:gravity="center"
android:text="@string/rb_str1"
android:textColor="@color/radio_text_bg" />
<RadioButton
android:id="@+id/rb_rdio2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:background="@drawable/radio_center_bg"
android:button="@null"
android:gravity="center"
android:text="@string/rb_str2"
android:textColor="@color/radio_text_bg" />
<RadioButton
android:id="@+id/rb_rdio3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:background="@drawable/radio_center_bg"
android:button="@null"
android:gravity="center"
android:text="@string/rb_str3"
android:textColor="@color/radio_text_bg" />
<RadioButton
android:id="@+id/rb_rdio4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginTop="3dp"
android:layout_weight="1"
android:background="@drawable/radio_rigth_bg"
android:button="@null"
android:gravity="center"
android:text="@string/rb_str4"
android:textColor="@color/radio_text_bg" />
</RadioGroup>
<android.support.v4.view.ViewPager
android:id="@+id/tab_vpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="5dp"
android:layout_weight="1" />
</LinearLayout><?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="@color/white"/>
<item android:color="@color/orange"/>
</selector><?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<corners
android:bottomLeftRadius="0dp"
android:bottomRightRadius="3dp"
android:topLeftRadius="0dp"
android:topRightRadius="3dp" />
<solid android:color="@color/orange" />
</shape>
</item>
<item
android:bottom="1dp"
android:left="-1dp"
android:right="1dp"
android:top="1dp">
<shape android:shape="rectangle" >
<corners
android:bottomLeftRadius="0dp"
android:bottomRightRadius="3dp"
android:topLeftRadius="0dp"
android:topRightRadius="3dp" />
<solid android:color="@color/white" />
</shape>
</item>
</layer-list>将上述例子用到实际例子中还是有很不错的效果的：
demo地址：http://download.csdn.net/detail/u011566000/8390325