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 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>
<?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 name="navigation_home">首頁</string> <string name="navigation_comment">評論</string> <string name="navigation_letter">私信</string> <string name="navigation_search">搜索</string> <string name="navigation_more">更多</string>
/** * 模仿新浪微博底部導航欄 * 使用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; } } }
/** * * @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