安卓開發：安卓底部選單欄的實現，RadioGroup 和Fragment

安卓的底部選單 有很多實現方式，本文以RadioGroup 作為 底部單選切換。用fragment 作為頁面顯示隱藏

初次接觸安卓開發，有不對的地方大家交流溝通！

首先是佈局檔案

我們需要一個FrameLayout 放置 Fragment ，以及RadioGroup 放置底部選單

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#FFFFFFFF"
        android:orientation="vertical" >
        <FrameLayout
            android:id="@+id/frm_all"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1" >
        </FrameLayout>
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="1dp"
            android:background="@drawable/fbutton_color_emerald"></LinearLayout>
        <RadioGroup
            android:id="@+id/radiogroup"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:gravity="center_vertical"
            android:orientation="horizontal" >
            <RadioButton
                android:id="@+id/radio_main"
                style="@style/main_tab_bottom"
                android:layout_weight="1"
                android:drawableTop="@drawable/footer_main_selector"
                android:text="首 頁" />
            <RadioButton
                android:id="@+id/radio_video"
                style="@style/main_tab_bottom"
                android:layout_weight="1"
                android:drawableTop="@drawable/footer_video_selector"
                android:text="視 頻" />
            <RadioButton
                android:id="@+id/radio_new"
                style="@style/main_tab_bottom"
                android:layout_weight="1"
                android:drawableTop="@drawable/footer_new_selector"
                android:text="新 聞" />

            <RadioButton
                android:id="@+id/radio_mycenter"
                style="@style/main_tab_bottom"
                android:layout_weight="1"
                android:drawableTop="@drawable/footer_mycenter_selector"
                android:text="我 的" />

        </RadioGroup>
    </LinearLayout>

</RelativeLayout>

佈局檔案中 引用了 一個Style ,設定一些顏色 字型大小等

    <style name="main_tab_bottom">
        <item name="android:textSize">12sp</item>
        <item name="android:ellipsize">marquee</item>
        <item name="android:gravity">center_horizontal</item>
        <item name="android:background">#00000000</item>
        <item name="android:padding">5dp</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:button">@null</item>
        <item name="android:singleLine">true</item>
        <item name="android:drawablePadding">5dp</item>
        <item name="android:layout_weight">1.0</item>
    </style>

位於drawable 資料夾下邊 定義了一個資原始檔 設定了選中 和未選中的 樣式圖片

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
  <item android:state_focused="true" android:drawable="@drawable/footer_btn_home_preesed" />
  <item android:state_pressed="true" android:drawable="@drawable/footer_btn_home_preesed"  />
  <item android:state_selected="true" android:drawable="@drawable/footer_btn_home_preesed" />
  <item android:state_checked="true"  android:drawable="@drawable/footer_btn_home_preesed"></item>
  <item android:drawable="@mipmap/footer_btn_home" />
</selector>

然後就是 activity，設定 RadioGroup 的點選事件。點選後隱藏其他 fragment 顯示點選的按鈕對應的 利用 FragmentManager 管理fragment

import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.content.Context;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.RadioGroup;



public class MainActivity extends AppCompatActivity {

    private FragmentManager fragmentManager;
    private FragmentTransaction fragmentTransaction;



    MainFragment mainFragment;
    VideoHomeFragment videoFragment;
    MyCentent myCenterFragment;
    ProHomeFragment proHomeFragment;
    SkillHomeFragment skillFragment;

    private RadioGroup radiogroup;
    private int menuid;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getSupportActionBar().hide();
        setContentView(R.layout.activity_main);
       // getFragmentManager().beginTransaction().add(R.id.frm_all,new MainFragment()).commit();
        fragmentManager = getFragmentManager();
        fragmentTransaction = fragmentManager.beginTransaction();
        radiogroup = (RadioGroup) findViewById(R.id.radiogroup);


        radiogroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                menuid = checkedId;
                switch (checkedId) {
                    case R.id.radio_main:
                        setChoiceItem(0);
                        break;
                    case R.id.radio_mycenter:
                        setChoiceItem(4);
                        break;
                        case R.id.radio_skill:
                            setChoiceItem(2);
                            break;
                    case R.id.radio_pro:
                        setChoiceItem(3);
                        break;
                    case R.id.radio_video:
                        setChoiceItem(1);
                }
            }
        });
        radiogroup.check(R.id.radio_main);
    }

    public void setChoiceItem(int index) {
        fragmentManager = getFragmentManager();
        fragmentTransaction = fragmentManager.beginTransaction();
        hideFragments(fragmentTransaction);
        switch (index) {
            case 0:
                fragmentTransaction.show(mainFragment);
                break;
            case 1:
                fragmentTransaction.show(videoFragment);
                break;
            case 2:
                fragmentTransaction.show(skillFragment);
                break;
            case 3:
                fragmentTransaction.show(proHomeFragment);
                break;
            case 4:

                fragmentTransaction.show(myCenterFragment);
                break;
        }
        fragmentTransaction.commit();
    }


    //隱藏所有的Fragment,避免fragment混亂
    private void hideFragments(FragmentTransaction transaction) {
        if (mainFragment == null) {
            mainFragment = new MainFragment();
            transaction.add(R.id.frm_all, mainFragment);
        }
        if (videoFragment == null) {
            videoFragment = new VideoHomeFragment();
            transaction.add(R.id.frm_all, videoFragment);
        }
        if (myCenterFragment == null) {
            myCenterFragment = new MyCentent();
            transaction.add(R.id.frm_all, myCenterFragment);
        }
        if (skillFragment == null) {
            skillFragment = new SkillHomeFragment();
            transaction.add(R.id.frm_all, skillFragment);
        }
        if (proHomeFragment == null) {
            proHomeFragment = new ProHomeFragment();
            transaction.add(R.id.frm_all, proHomeFragment);
        }
        transaction.hide(proHomeFragment);
        transaction.hide(mainFragment);
        transaction.hide(videoFragment);
        transaction.hide(skillFragment);
        transaction.hide(myCenterFragment);

    }




}