Android之底部導航欄--RadioGroup、TabHost、Fragment

Android底部導航欄，使用Fragment實現

老規矩，先看效果圖，因為不想拿4.1操作系統的手機，直接就用模擬器了



然後目錄結構



佈局文件內容

<?xml version="1.0" encoding="UTF-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" >

<fragment
android:id="@+id/fragment_home"
android:name="com.android.francis.radionavigationbarbyfragment.TabHomeFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />

<fragment
android:id="@+id/fragment_letter"
android:name="com.android.francis.radionavigationbarbyfragment.TabLetterFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />

<fragment
android:id="@+id/fragment_comment"
android:name="com.android.francis.radionavigationbarbyfragment.TabCommentFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />

<fragment
android:id="@+id/fragment_search"
android:name="com.android.francis.radionavigationbarbyfragment.TabSearchFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />

<fragment
android:id="@+id/fragment_more"
android:name="com.android.francis.radionavigationbarbyfragment.TabMoreFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>

<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:visibility="gone" />

<RadioGroup
android:id="@+id/bottom_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="@drawable/group_background"
android:gravity="center_vertical"
android:orientation="horizontal" >

<RadioButton
android:id="@+id/radio_home"
style="@style/radio_navigation_bar_bottom_tab"
android:checked="true"
android:drawableTop="@drawable/navigation_home"
android:text="@string/navigation_home" />

<RadioButton
android:id="@+id/radio_letter"
style="@style/radio_navigation_bar_bottom_tab"
android:drawableTop="@drawable/navigation_letter"
android:text="@string/navigation_letter" />

<RadioButton
android:id="@+id/radio_comment"
style="@style/radio_navigation_bar_bottom_tab"
android:drawableTop="@drawable/navigation_comment"
android:text="@string/navigation_comment" />

<RadioButton
android:id="@+id/radio_search"
style="@style/radio_navigation_bar_bottom_tab"
android:drawableTop="@drawable/navigation_search"
android:text="@string/navigation_search" />

<RadioButton
android:id="@+id/radio_more"
style="@style/radio_navigation_bar_bottom_tab"
android:drawableTop="@drawable/navigation_more"
android:text="@string/navigation_more" />
</RadioGroup>
</LinearLayout>

</TabHost>

style.xml樣式文件內容

<style name="radio_navigation_bar_bottom_tab">
<item name="android:button">@null</item>
<item name="android:layout_marginTop">2.0dp</item>
<item name="android:textSize">10sp</item>
<item name="android:textColor">#ffffffff</item>
<item name="android:ellipsize">marquee</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:background">@drawable/radio_navigation_bar_bg</item>
<item name="android:paddingTop">5dp</item>
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:singleLine">true</item>
<item name="android:drawablePadding">2dp</item>
<item name="android:layout_weight">1</item>
</style>

radio_navigation_bar_bg.xml文件內容

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >

<item android:state_focused="true" android:state_pressed="false" android:state_enabled="true" android:drawable="@drawable/navigation_bar_tab_pressed" />
<item android:state_pressed="true" android:state_enabled="true" android:drawable="@drawable/navigation_bar_tab_pressed"></item>
<item android:state_checked="true" android:state_enabled="true" android:drawable="@drawable/navigation_bar_tab_selected" />
</selector>

string.xml文件內容

<string name="navigation_home">首頁</string>
<string name="navigation_comment">評論</string>
<string name="navigation_letter">私信</string>
<string name="navigation_search">搜索</string>
<string name="navigation_more">更多</string>

MainActivity.java主要代碼

/**
* 模仿新浪微博底部導航欄
* 使用RadioGroup+RadioButton、TabHost、Fragment實現底部導航欄
* 需要Android操作系統最低版本為11
* 因為現在還有許許多多2.2、2.3版本的手機充斥的我們的周圍
* 所以有點雞筋
* @author Francis-ChinaFeng
* @version 1.0 2013-09-08
*/
public class MainActivity extends Activity implements OnCheckedChangeListener {

private RadioGroup group;
private TabHost tabHost;

private String navigation_bar_home = "home";
private String navigation_bar_letter = "letter";
private String navigation_bar_comment = "comment";
private String navigation_bar_search = "search";
private String navigation_bar_more = "more";

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
init();
setNavigationBar();
}

private void init() {
group = (RadioGroup) findViewById(R.id.bottom_group);
tabHost = (TabHost) findViewById(android.R.id.tabhost);
group.setOnCheckedChangeListener(this);
tabHost.setup();
}

private void setNavigationBar() {
TabSpec tab_home = tabHost.newTabSpec(navigation_bar_home);
TabSpec tab_letter = tabHost.newTabSpec(navigation_bar_letter);
TabSpec tab_comment = tabHost.newTabSpec(navigation_bar_comment);
TabSpec tab_search = tabHost.newTabSpec(navigation_bar_search);
TabSpec tab_more = tabHost.newTabSpec(navigation_bar_more);

tab_home.setIndicator(navigation_bar_home).setContent(R.id.fragment_home);
tab_letter.setIndicator(navigation_bar_home).setContent(R.id.fragment_letter);
tab_comment.setIndicator(navigation_bar_home).setContent(R.id.fragment_comment);
tab_search.setIndicator(navigation_bar_home).setContent(R.id.fragment_search);
tab_more.setIndicator(navigation_bar_home).setContent(R.id.fragment_more);

tabHost.addTab(tab_home);
tabHost.addTab(tab_letter);
tabHost.addTab(tab_comment);
tabHost.addTab(tab_search);
tabHost.addTab(tab_more);
}

@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch (checkedId) {
case R.id.radio_home:
tabHost.setCurrentTabByTag(navigation_bar_home);
break;
case R.id.radio_letter:
tabHost.setCurrentTabByTag(navigation_bar_letter);
break;
case R.id.radio_comment:
tabHost.setCurrentTabByTag(navigation_bar_comment);
break;
case R.id.radio_search:
tabHost.setCurrentTabByTag(navigation_bar_search);
break;
case R.id.radio_more:
tabHost.setCurrentTabByTag(navigation_bar_more);
break;
}
}

}

TabHomeFragment代碼內容

/**
*
* @author Francis-ChinaFeng
* @version 1.0 2013-9-8
*/
public class TabHomeFragment extends Fragment {

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
//		return super.onCreateView(inflater, container, savedInstanceState);
return inflater.inflate(R.layout.activity_navigation_home, container);
}
}

好了，完成了，然後給出源碼連接，這個需要分數下載，小爺也是窮人

http://download.csdn.net/detail/u011290399/6234829