首页 > 代码库 > [应用妹 --第二篇 主界面Tab搭建] android应用市场之快速开发

[应用妹 --第二篇 主界面Tab搭建] android应用市场之快速开发


主界面布局如下

<?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页面的切换的,实现原理比较简单。

[应用妹 --第二篇 主界面Tab搭建] android应用市场之快速开发