實現底部導航欄及切換tab重新加載的問題解決

許多的App都使用底部導航欄來實現導航功能，我們可以使用RadioGroup+RadioButton的形式或者直接Button數組的方式實現，而谷歌官方提供了FragmentTabHost來方便快捷實現底部導航欄。

android.support.v4.app.FragmentTabHost

主要代碼：

fragmentTabHost.setup(this, getSupportFragmentManager(), R.id.layout_content);

for (int i = 0; i < TAB_NUM; i++){
    TabHost.TabSpec tabSpec = fragmentTabHost.newTabSpec(mTitles[i]);
    tabSpec.setIndicator(getTabView(i));
    fragmentTabHost.addTab(tabSpec, mFragments[i], null);
}

布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_fragment_tab_host"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.cheng.collection.ui.FragmentTabHostActivity">

    <FrameLayout
        android:id="@+id/layout_content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

    </FrameLayout>

    <android.support.v4.app.FragmentTabHost
        android:id="@+id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="48dp">

    </android.support.v4.app.FragmentTabHost>
</LinearLayout>

實現代碼：

public class FragmentTabHostActivity extends AppCompatActivity {

    private static final int TAB_NUM = 4;

    private Class[] mFragments = new Class[]{//tab對應的Fragment
            AFragment.class,
            BFragment.class,
            CFragment.class,
            DFragment.class
    };

    private int[] mTabDrawables = new int[]{//tab圖片
            R.drawable.tab_work,
            R.drawable.tab_im,
            R.drawable.tab_ebook,
            R.drawable.tab_me,
    };

    private String[] mTitles = new String[]{//tab標題文字
            "工作",
            "微信",
            "通信錄",
            "我的"
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fragment_tab_host);

        FragmentTabHost fragmentTabHost = (FragmentTabHost) findViewById(R.id.tabhost);
        fragmentTabHost.setup(this, getSupportFragmentManager(), R.id.layout_content);

        for (int i = 0; i < TAB_NUM; i++){
            TabHost.TabSpec tabSpec = fragmentTabHost.newTabSpec(mTitles[i]);
            tabSpec.setIndicator(getTabView(i));
            fragmentTabHost.addTab(tabSpec, mFragments[i], null);
        }
        //部分機型可能會顯示tab之間的分割線，設置為null取消掉
        fragmentTabHost.getTabWidget().setDividerDrawable(null);
    }

    private View getTabView(int index) {
        View view = View.inflate(this, R.layout.tab_indicator, null);
        ImageView iv = (ImageView) view.findViewById(R.id.maintab_iv);
        TextView tv = (TextView) view.findViewById(R.id.maintab_tv);

        iv.setImageDrawable(getDrawable(mTabDrawables[index]));
        tv.setText(mTitles[index]);

        return view;
    }
}

備注：

  這個實現方式有一個弊端，就是每次切換tab都會重新加載Fragment。實際項目過程種可能并不需要，而是需要在切換過程中保留Fragment狀態。

原因：

  FragmentTabHost在切換tab的時候使用detach和attach的方法來顯示/隱藏Fragment。

解決方法：

  修改FragmentTabHost的源代碼將doTabChanged方法中的

  ft.detach(mLastTab.fragment); 改成  ft.hide(mLastTab.fragment);

  ft.attach(newTab.fragment); 改成 ft.show(newTab.fragment);