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

Android底部導航欄，網絡上的示例多如牛毛

在這裡，我也記錄一個好了

這一篇文章用的是TabActivity，下一篇文章會用Fragment實現

廢話不多說了，看效果圖片

繼續咱們的節奏，看目錄文件

佈局文件內容

<?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" />        <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/tab_home"                android:text="@string/tab_home" />            <RadioButton                android:id="@+id/radio_letter"                style="@style/radio_navigation_bar_bottom_tab"                android:drawableTop="@drawable/tab_letter"                android:text="@string/tab_letter" />            <RadioButton                android:id="@+id/radio_comment"                style="@style/radio_navigation_bar_bottom_tab"                android:drawableTop="@drawable/tab_comment"                android:text="@string/tab_comment" />            <RadioButton                android:id="@+id/radio_reference"                style="@style/radio_navigation_bar_bottom_tab"                android:drawableTop="@drawable/tab_reference"                android:text="@string/tab_reference" />            <RadioButton                android:id="@+id/radio_more"                style="@style/radio_navigation_bar_bottom_tab"                android:drawableTop="@drawable/tab_more"                android:text="@string/tab_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>

<item name="android:button">@null</item>

消除單選按鈕

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="tab_home">首頁</string>    <string name="tab_comment">評論</string>    <string name="tab_letter">私信</string>    <string name="tab_reference">刷新</string>    <string name="tab_more">更多</string>

MainActivity.java文件代碼

/** * 模仿新浪微博底部導航欄 * 使用RadioGroup+RadioButton、TabHost、TabActivity實現底部導航欄 * 但是因為TabActivity屬於過時的系統類，所以不推薦該方法 * @author Francis-ChinaFeng * @version 1.0 2013-09-08 */public class MainActivity extends TabActivity implements OnCheckedChangeListener {//實例化頁面控件private RadioGroup group;private TabHost tabHost;//聲明TabSpac的Tag字符信息private String tab_home_bar = "tab_home";private String tab_letter_bar = "tab_letter";private String tab_comment_bar = "tab_comment";private String tab_reference_bar = "tab_reference";private String tab_more_bar = "tab_more";@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);init();setNavigationBar();}private void init() {group = (RadioGroup) findViewById(R.id.bottom_group);group.setOnCheckedChangeListener(this);tabHost = getTabHost();}private void setNavigationBar() {//實例化底部導航TabSpec對象TabSpec tab_home = tabHost.newTabSpec(tab_home_bar);TabSpec tab_letter = tabHost.newTabSpec(tab_letter_bar);TabSpec tab_comment = tabHost.newTabSpec(tab_comment_bar);TabSpec tab_reference = tabHost.newTabSpec(tab_reference_bar);TabSpec tab_more = tabHost.newTabSpec(tab_more_bar);tab_home.setIndicator(tab_home_bar).setContent(new Intent(this, TabHomeActivity.class));tab_letter.setIndicator(tab_letter_bar).setContent(new Intent(this, TabLetterActivity.class));tab_comment.setIndicator(tab_comment_bar).setContent(new Intent(this, TabCommentActivity.class));tab_reference.setIndicator(tab_reference_bar).setContent(new Intent(this, TabReferenceActivity.class));tab_more.setIndicator(tab_more_bar).setContent(new Intent(this, TabMoreActivity.class));tabHost.addTab(tab_home);tabHost.addTab(tab_letter);tabHost.addTab(tab_comment);tabHost.addTab(tab_reference);tabHost.addTab(tab_more);}@Overridepublic void onCheckedChanged(RadioGroup group, int checkedId) {switch (checkedId) {case R.id.radio_home:tabHost.setCurrentTabByTag(tab_home_bar);break;case R.id.radio_letter:tabHost.setCurrentTabByTag(tab_letter_bar);break;case R.id.radio_comment:tabHost.setCurrentTabByTag(tab_comment_bar);break;case R.id.radio_reference:tabHost.setCurrentTabByTag(tab_reference_bar);break;case R.id.radio_more:tabHost.setCurrentTabByTag(tab_more_bar);break;}}}

好了，整個實現過程就完成了，稍後提供源碼，并寫一下Fragment實現過程

下載鏈接：http://download.csdn.net/detail/u011290399/6234813

更多相关文章

随机推荐