主界面布局如下
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/f_home_boungroud"
>
<include android:id="@+id/titlebar" layout="@layout/titlebar"/> // titlebar
<FrameLayout
android:id="@+id/tab_content" 主界面内容FrameLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1.0"
/>
<RadioGroup
android:id="@+id/tabs_rg" 主界面下面四个tab按钮
android:layout_width="fill_parent"
android:layout_height="50dp"
android:orientation="horizontal"
android:gravity="center"
android:background="@drawable/downbar"
>
<RadioButton
android:id="@+id/tab_rb_a"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:drawableTop="@drawable/selector_tab"
android:button="@null"
android:text="精品"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:textColor="@android:color/white"
android:textSize="13sp"
android:layout_weight="1.0"
android:gravity="center"
android:singleLine="true"
android:checked="true"
android:background="@drawable/selector_tab_item"
/>
<RadioButton
android:id="@+id/tab_rb_b"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:drawableTop="@drawable/selector_tab2"
android:button="@null"
android:text="热榜"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:textColor="@android:color/white"
android:textSize="13sp"
android:layout_weight="1.0"
android:gravity="center"
android:singleLine="true"
android:background="@drawable/selector_tab_item"
/>
<RadioButton
android:id="@+id/tab_rb_c"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:drawableTop="@drawable/selector_tab3"
android:button="@null"
android:text="软件"
android:textColor="@android:color/white"
android:textSize="13sp"
android:layout_weight="1.0"
android:gravity="center"
android:singleLine="true"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:background="@drawable/selector_tab_item"
/>
<RadioButton
android:id="@+id/tab_rb_d"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:drawableTop="@drawable/selector_tab4"
android:button="@null"
android:text="游戏"
android:textColor="@android:color/white"
android:textSize="13sp"
android:layout_weight="1.0"
android:gravity="center"
android:singleLine="true"
android:layout_marginTop="2dp"
android:layout_marginBottom="2dp"
android:background="@drawable/selector_tab_item"
/>
</RadioGroup>
</LinearLayout>
/**
* 获取一个带动画的FragmentTransaction
*
* @param index
* @return
*/
private FragmentTransaction obtainFragmentTransaction(int index) {
FragmentTransaction ft = childFragmentManager
.beginTransaction();
// 设置切换动画
if (index > currentTab) {
ft.setCustomAnimations(R.anim.slide_left_in, R.anim.slide_left_out);
} else {
ft.setCustomAnimations(R.anim.slide_right_in,
R.anim.slide_right_out);
}
return ft;
}
//通过点击tab按钮,来显示或者隐藏Fragment
private void showTab(int idx) {for (int i = 0; i < fragments.size(); i++) {
Fragment fragment = fragments.get(i);
FragmentTransaction ft = obtainFragmentTransaction(idx);
if (idx == i) {
ft.show(fragment); //获取对应点击的按钮,显示不同的Fragment
} else {
ft.hide(fragment);
}
ft.commit();
}
currentTab = idx; // 更新目标tab为当前tab
}
//当我们,的Fragment隐藏后,我们就让他暂停,显示后,我们就让他resume,我们可以方便的在这里进行Adapter.notifiDataChanget()进行一些其他的更新或者初始化操作
public void selete(int i){
Fragment fragment = fragments.get(i);
FragmentTransaction ft = obtainFragmentTransaction(i);
getCurrentFragment().onPause(); // 暂停当前tab
if (fragment.isAdded()) {
fragment.onResume(); // 启动目标tab的onResume()
} else {
ft.add(fragmentContentId, fragment);
}
showTab(i); // 显示目标tab
ft.commit();
// 如果设置了切换tab额外功能功能接口
// if (null != onRgsExtraCheckedChangedListener) {
// onRgsExtraCheckedChangedListener.OnRgsExtraCheckedChanged(
// radioGroup, checkedId, i);
// }
}
整个主页tab就是通过,显示和隐藏fragment来实现的tab页面的切换的,实现原理比较简单。