先看效果:
京东商城底部菜单栏
新浪微博底部菜单栏
本次学习效果图:
第一,主布局文件(启动页main.xml,位于res/layout目录下)代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
<?xml version= "." encoding= "utf-" ?>
<tabhost xmlns:android= "http://schemas.android.com/apk/res/android"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:id= "@+id/tabhost" >
<linearlayout
android:id= "@+id/linear"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:orientation= "vertical" >
<tabwidget
android:id= "@android:id/tabs"
android:layout_width= "fill_parent"
android:layout_height= "wrap_content" ></tabwidget>
<framelayout
android:id= "@android:id/tabcontent"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent" >
<linearlayout
android:id= "@+id/tab"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:orientation= "vertical" >
<textview
android:id= "@+id/tab_txt"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:gravity= "center"
android:text= "你" />
</linearlayout>
<linearlayout
android:id= "@+id/tab"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:orientation= "vertical" >
<textview
android:id= "@+id/tab_txt"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:gravity= "center"
android:text= "我" />
</linearlayout>
<linearlayout
android:id= "@+id/tab"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:orientation= "vertical" >
<textview
android:id= "@+id/tab_txt"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:gravity= "center"
android:text= "他" />
</linearlayout>
<linearlayout
android:id= "@+id/tab"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:orientation= "vertical" >
<textview
android:id= "@+id/tab_txt"
android:layout_width= "fill_parent"
android:layout_height= "fill_parent"
android:gravity= "center"
android:text= "我们" />
</linearlayout>
</framelayout>
</linearlayout>
</tabhost>
|
第二,创建显示此tabwidget的布局tabmini.xml(位于res/layout目录下)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<?xml version= "." encoding= "utf-" ?>
<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android"
android:layout_width= "fill_parent"
android:layout_height= "wrap_content"
android:paddingtop= "dp"
android:paddingleft= "dp"
android:paddingright= "dp"
android:background= "#cec" >
<textview
android:id= "@+id/tab_label"
android:layout_width= "fill_parent"
android:layout_height= "wrap_content"
android:layout_centerinparent= "true"
android:gravity= "center"
android:textcolor= "#"
android:textstyle= "bold"
android:background= "@drawable/tabmini" />
</relativelayout>
|
第三,在drawable里面创建一个selector,命名tabmini.xml,用来点击tabhost的一个tab时textview的变化
1
2
3
4
5
6
7
8
9
|
<?xml version= "." encoding= "utf-" ?>
<selector xmlns:android= "http://schemas.android.com/apk/res/android" >
<item
android:state_selected= "true"
android:drawable= "@drawable/add_managebg_down" />
<item
android:state_selected= "false"
android:drawable= "@drawable/add_managebg" />
</selector>
|
第四,java代码,在activity里实现tabhost
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
package com.example.androidtest____meihuatubiao;
import android.app.activity;
import android.os.bundle;
import android.view.layoutinflater;
import android.view.view;
import android.widget.tabhost;
import android.widget.textview;
public class main extends activity {
@override
protected void oncreate(bundle savedinstancestate){
super .oncreate(savedinstancestate);
setcontentview(r.layout.main);
view nitab=(view)layoutinflater.from( this ).inflate(r.layout.tabmini, null );
textview nitxt=(textview)nitab.findviewbyid(r.id.tab_label);
nitxt.settext( "ni" );
view wotab=(view)layoutinflater.from( this ).inflate(r.layout.tabmini, null );
textview wotxt=(textview)wotab.findviewbyid(r.id.tab_label);
wotxt.settext( "wo" );
view tatab=(view)layoutinflater.from( this ).inflate(r.layout.tabmini, null );
textview tatxt=(textview)tatab.findviewbyid(r.id.tab_label);
tatxt.settext( "ta" );
view wetab=(view)layoutinflater.from( this ).inflate(r.layout.tabmini, null );
textview wetxt=(textview)wetab.findviewbyid(r.id.tab_label);
wetxt.settext( "we" );
tabhost tabs=(tabhost)findviewbyid(r.id.tabhost);
tabs.setup();
tabs.addtab(tabs.newtabspec( "nitab" ).setcontent(r.id.tab).setindicator(nitab));
tabs.addtab(tabs.newtabspec( "wotab" ).setcontent(r.id.tab).setindicator(wotab));
tabs.addtab(tabs.newtabspec( "tatab" ).setcontent(r.id.tab).setindicator(tatab));
tabs.addtab(tabs.newtabspec( "wetab" ).setcontent(r.id.tab).setindicator(wetab));
}
}
|
以上内容是小编给大家分享的android程序开发之自定义设置tabhost,tabwidget样式,希望对大家有所帮助!