效果很不错,不啰嗦,

转自http://www.189works.com/article-80374-1.html

实现方式一:通过TabWidget实现

这种方式主要是在布局中将TabWidget标签嵌套在RelativeLayout中,并且在TabWidget标签中中设置android:layout_alignParentBottom="true"

另外,下划线和选项卡之间的线去除的方法时在TabWidget标签中设置属性android:tabStripEnabled="false"

xml代码:

xml version="1.0" encoding="utf-8"?>
<TabHostxmlns:android="http://schemas.android.com/apk/res/android"
android:id
="@android:id/tabhost"
android:layout_width
="fill_parent"
android:layout_height
="fill_parent"
android:orientation
="vertical">
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width
="fill_parent"
android:layout_height
="fill_parent"
android:padding
="5dp"
>FrameLayout>

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height
="fill_parent">


<TabWidget
android:id="@android:id/tabs"
android:tabStripEnabled
="false"
android:background
="#6E6E6E"
android:layout_width
="fill_parent"
android:layout_height
="wrap_content"
android:layout_alignParentBottom
="true"
>TabWidget>

RelativeLayout>

TabHost>

实现代码:

packagecom.loulijun.demo1;

importandroid.app.TabActivity;
importandroid.content.Intent;
importandroid.os.Bundle;
importandroid.widget.TabHost;

publicclassDemo1ActivityextendsTabActivity {
/**Called when the activity is first created.*/
privateTabHost tabhost;
privateIntent intent1, intent2, intent3, intent4;
@Override
publicvoidonCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
tabhost = getTabHost();

intent1 =newIntent(Demo1Activity.this, One.class);
tabhost.addTab(tabhost.newTabSpec("one")
.setIndicator("电话",getResources().getDrawable(android.R.drawable.ic_menu_call))
.setContent(intent1));

intent2 =newIntent(Demo1Activity.this, Two.class);
tabhost.addTab(tabhost.newTabSpec("two")
.setIndicator("相机",getResources().getDrawable(android.R.drawable.ic_menu_camera))
.setContent(intent2));

intent3 =newIntent(Demo1Activity.this, Three.class);
tabhost.addTab(tabhost.newTabSpec("three")
.setIndicator("分享",getResources().getDrawable(android.R.drawable.ic_menu_share))
.setContent(intent3));

intent4 =newIntent(Demo1Activity.this, Four.class);
tabhost.addTab(tabhost.newTabSpec("four")
.setIndicator("更多",getResources().getDrawable(android.R.drawable.ic_menu_more))
.setContent(intent4));
}
}

运行图:

实现方式二:隐藏TabWidget,通过RadioGroup和RadioButton实现底部菜单栏

这种方式更漂亮,也更灵活,网上基本用的是这种方式,通过setCurrentTabByTag来切换不同的选项卡

main.xml:

xml version="1.0" encoding="utf-8"?>
<TabHostxmlns: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:orientation="vertical"
android:layout_width
="fill_parent"
android:layout_height
="fill_parent">
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width
="fill_parent"
android:layout_height
="0.0dip"
android:layout_weight
="1.0"/>
<TabWidget
android:id="@android:id/tabs"
android:layout_width
="fill_parent"
android:layout_height
="wrap_content"
android:layout_weight
="0.0"
android:visibility
="gone"/>
<RadioGroup
android:id="@+id/main_tab"
android:background
="@drawable/maintab_toolbar_bg"
android:orientation
="horizontal"
android:layout_width
="fill_parent"
android:layout_height
="wrap_content"
android:gravity
="center_vertical"
android:layout_gravity
="bottom">
<RadioButton
android:layout_marginTop="2.0dip"
android:text
="@string/main_home"
android:drawableTop
="@drawable/icon_1_n"
android:id
="@+id/radio_button0"
style
="@style/main_tab_bottom"/>
<RadioButton
android:layout_marginTop="2.0dip"
android:text
="@string/main_news"
android:drawableTop
="@drawable/icon_2_n"
android:id
="@+id/radio_button1"
style
="@style/main_tab_bottom"/>
<RadioButton
android:layout_marginTop="2.0dip"
android:text
="@string/main_my_info"
android:drawableTop
="@drawable/icon_3_n"
android:id
="@+id/radio_button2"
style
="@style/main_tab_bottom"/>
<RadioButton
android:layout_marginTop="2.0dip"
android:text
="@string/menu_search"
android:drawableTop
="@drawable/icon_4_n"
android:id
="@+id/radio_button3"
style
="@style/main_tab_bottom"/>
<RadioButton
android:layout_marginTop="2.0dip"
android:text
="@string/more"
android:drawableTop
="@drawable/icon_5_n"
android:id
="@+id/radio_button4"
style
="@style/main_tab_bottom"/>
RadioGroup>
LinearLayout>
TabHost>

drawable/home_btn_bg.xml:切换时的效果

xml version="1.0" encoding="UTF-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<itemandroid:state_focused="true"android:state_enabled="true"android:state_pressed="false"android:drawable="@drawable/home_btn_bg_s"/>
<itemandroid:state_enabled="true"android:state_pressed="true"android:drawable="@drawable/home_btn_bg_s"/>
<itemandroid:state_enabled="true"android:state_checked="true"android:drawable="@drawable/home_btn_bg_d"/>
<itemandroid:drawable="@drawable/transparent"/>
selector>

string/dimens.xml 尺寸文件:

xml version="1.0" encoding="utf-8"?>
<resources>
<dimenname="bottom_tab_padding_drawable">2.0dipdimen>
<dimenname="bottom_tab_padding_up">5.0dipdimen>
<dimenname="bottom_tab_font_size">10.0dipdimen>
resources>

string/drawables.xml 设置为透明:

xml version="1.0" encoding="utf-8"?>
<resources>
<itemtype="drawable"name="transparent">#00000000item>
resources>

string/styles.xml 样式文件:

xml version="1.0" encoding="utf-8"?>
<resources>
<stylename="main_tab_bottom">
<itemname="android:textSize">@dimen/bottom_tab_font_sizeitem>
<itemname="android:textColor">#ffffffffitem>
<itemname="android:ellipsize">marqueeitem>
<itemname="android:gravity">center_horizontalitem>
<itemname="android:background">@drawable/home_btn_bgitem>
<itemname="android:paddingTop">@dimen/bottom_tab_padding_upitem>
<itemname="android:layout_width">fill_parentitem>
<itemname="android:layout_height">wrap_contentitem>
<itemname="android:button">@nullitem>
<itemname="android:singleLine">trueitem>
<itemname="android:drawablePadding">@dimen/bottom_tab_padding_drawableitem>
<itemname="android:layout_weight">1.0item>
style>
resources>

代码:

importandroid.app.TabActivity;
importandroid.content.Intent;
importandroid.os.Bundle;
importandroid.view.Window;
importandroid.widget.RadioGroup;
importandroid.widget.TabHost;
importandroid.widget.RadioGroup.OnCheckedChangeListener;
publicclassMainTabActivityextendsTabActivityimplementsOnCheckedChangeListener{
privateRadioGroup mainTab;
privateTabHost tabhost;
privateIntent iHome;
privateIntent iNews;
privateIntent iInfo;
privateIntent iSearch;
privateIntent iMore;

@Override
publicvoidonCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.main);
mainTab=(RadioGroup)findViewById(R.id.main_tab);
mainTab.setOnCheckedChangeListener(this);
tabhost = getTabHost();

iHome =newIntent(this, HomeActivity.class);
tabhost.addTab(tabhost.newTabSpec("iHome")
.setIndicator(getResources().getString(R.string.main_home), getResources().getDrawable(R.drawable.icon_1_n))
.setContent(iHome));

iNews =newIntent(this, NewsActivity.class);
tabhost.addTab(tabhost.newTabSpec("iNews")
.setIndicator(getResources().getString(R.string.main_news), getResources().getDrawable(R.drawable.icon_2_n))
.setContent(iNews));

iInfo =newIntent(this, MyInfoActivity.class);
tabhost.addTab(tabhost.newTabSpec("iInfo")
.setIndicator(getResources().getString(R.string.main_my_info), getResources().getDrawable(R.drawable.icon_3_n))
.setContent(iInfo));

iSearch =newIntent(this,SearchActivity.class);
tabhost.addTab(tabhost.newTabSpec("iSearch")
.setIndicator(getResources().getString(R.string.menu_search), getResources().getDrawable(R.drawable.icon_4_n))
.setContent(iSearch));

iMore =newIntent(this, MoreActivity.class);
tabhost.addTab(tabhost.newTabSpec("iMore")
.setIndicator(getResources().getString(R.string.more), getResources().getDrawable(R.drawable.icon_5_n))
.setContent(iMore));
}


@Override
publicvoidonCheckedChanged(RadioGroup group,intcheckedId) {
switch(checkedId){
caseR.id.radio_button0:
this.tabhost.setCurrentTabByTag("iHome");
break;
caseR.id.radio_button1:
this.tabhost.setCurrentTabByTag("iNews");
break;
caseR.id.radio_button2:
this.tabhost.setCurrentTabByTag("iInfo");
break;
caseR.id.radio_button3:
this.tabhost.setCurrentTabByTag("iSearch");
break;
caseR.id.radio_button4:
this.tabhost.setCurrentTabByTag("iMore");
break;
}
}
}

运行图:


更多相关文章

  1. 分享:android图片浏览器—类微信朋友圈相片浏览【android代码下载
  2. Ubuntu13.04环境下载、编译Android源代码
  3. Android(安卓)判断、创建和删除快捷方式
  4. node.js+android(使用HttpURLConnection和HttpClient)实现文件上
  5. android button 效果设计
  6. Android(安卓)fragment 获取id,findViewById为空
  7. WebView的Java和javascript相互调用
  8. 如何用同一份代码产生不同包名得APK包
  9. arcgis for android访问arcgis server上自己制作部署的地图服务

随机推荐

  1. Android CheckBox
  2. Android TextView文字过多时,通过滚动条显
  3. Android(安卓)UI开发第十八篇――Activit
  4. Android 通过WebView 调用Js sqlite数据
  5. android各组件详解
  6. 初学Android,五大布局对象(六)
  7. 安装android时提示The operation cannot
  8. gprs便捷开关 android之widget应用
  9. GridView显示ICON和TEXT
  10. 学习笔记-Android Gallery实现