自定义TabWidget

 在开发过程中，默认的TabWidget不能满足我们对于UI的要求并且没有足够的属性工我们去修改，这个时候能够自定义TabWidget是非常必要的。自定义TabWidget组要运用的是TabSpec.setIndicator(View view)方法。

main.xml:

01	<TabHost xmlns:android="http://schemas.android.com/apk/res/android"

02	xmlns:tools="http://schemas.android.com/tools"

03	android:id="@android:id/tabhost"

04	android:layout_width="match_parent"

05	android:layout_height="match_parent"

06	tools:context=".Main" >

07

08	<RelativeLayout

09	android:layout_width="match_parent"

10	android:layout_height="match_parent" >

11

12	<TabWidget

13	android:id="@android:id/tabs"

14	android:layout_width="match_parent"

15	android:layout_height="wrap_content"

16	android:layout_alignParentBottom="true" />

17

18	<FrameLayout

19	android:id="@android:id/tabcontent"

20	android:layout_width="match_parent"

21	android:layout_height="match_parent" >

22

23	<LinearLayout

24	android:id="@+id/tabs1"

25	android:layout_width="match_parent"

26	android:layout_height="match_parent"

27	android:orientation="vertical" >

28

29

<TextView

30	android:layout_width="match_parent"

31	android:layout_height="wrap_content"

32	android:text="我是tab1" />

33	</LinearLayout>

34

35	<LinearLayout

36	android:id="@+id/tabs2"

37	android:layout_width="match_parent"

38	android:layout_height="match_parent"

39	android:orientation="vertical" >

40

41

<TextView

42	android:layout_width="match_parent"

43	android:layout_height="wrap_content"

44	android:text="我是tab2" />

45	</LinearLayout>

46	</FrameLayout>

47	</RelativeLayout>

48

49	</TabHost>

供点击时切换的图片tabmini.xml:

1	<?xml version="1.0" encoding="utf-8"?>

2	<selector xmlns:android="http://schemas.android.com/apk/res/android">

3

4	<item android:drawable="@drawable/check" android:state_selected="true"/>

5	<item android:drawable="@drawable/uncheck" android:state_selected="false"/>

6

7	</selector>

自定义view的布局文件custom.xml:

01	<?xml version="1.0" encoding="utf-8"?>

02	<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

03	android:layout_width="match_parent"

04	android:layout_height="wrap_content"

05	android:orientation="vertical" >

06

07	<ImageView

08	android:layout_width="match_parent"

09	android:layout_height="wrap_content"

10	android:src="@drawable/tabmini" />

11

12

<TextView

13	android:id="@+id/tv"

14	android:layout_width="match_parent"

15	android:layout_height="wrap_content"

16	android:layout_marginBottom="0sp"

17	android:gravity="center_horizontal"/>

18

19	</LinearLayout>

最后是我们的main.java:

01	package com.app.main;

02

03	import android.app.Activity;

04	import android.os.Bundle;

05	import android.view.View;

06	import android.widget.TabHost;

07	import android.widget.TabHost.TabSpec;

08	import android.widget.TextView;

09

10	public class Main extends Activity {

11

12

@Override

13	protected void onCreate(Bundle savedInstanceState) {

14	super.onCreate(savedInstanceState);

15	setContentView(R.layout.main);

16

17	TabHost tabHost = (TabHost) this.findViewById(android.R.id.tabhost);

18

19	// tabhost如果是以findViewById()这个方法获取的，必须调用setup()方法

20	tabHost.setup();

21

22	View view1 = this.getLayoutInflater().inflate(R.layout.custom, null);

23

24	TextView tv1 = (TextView) view1.findViewById(R.id.tv);

25

26	tv1.setText("tab1");

27

28	View view2 = this.getLayoutInflater().inflate(R.layout.custom, null);

29

30	TextView tv2 = (TextView) view2.findViewById(R.id.tv);

31

32	tv2.setText("tab2");

33

34	TabSpec spec1 = tabHost.newTabSpec("tab1").setIndicator(view1)

35	.setContent(R.id.tabs1);

36

37	TabSpec spec2 = tabHost.newTabSpec("tab2").setIndicator(view2)

38	.setContent(R.id.tabs2);

39

40	tabHost.addTab(spec1);

41

42	tabHost.addTab(spec2);

43

44

}

45

46

}

实现的效果：