自定义TabWidget

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

main.xml:

?


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

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

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

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

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    tools:context=".Main" >

    <RelativeLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent" >

        <TabWidget

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

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:layout_alignParentBottom="true" />

        <FrameLayout

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

            android:layout_width="match_parent"

            android:layout_height="match_parent" >

            <LinearLayout

                android:id="@+id/tabs1"

                android:layout_width="match_parent"

                android:layout_height="match_parent"

                android:orientation="vertical" >

                <TextView

                    android:layout_width="match_parent"

                    android:layout_height="wrap_content"

                    android:text="我是tab1" />

            </LinearLayout>

            <LinearLayout

                android:id="@+id/tabs2"

                android:layout_width="match_parent"

                android:layout_height="match_parent"

                android:orientation="vertical" >

                <TextView

                    android:layout_width="match_parent"

                    android:layout_height="wrap_content"

                    android:text="我是tab2" />

            </LinearLayout>

        </FrameLayout>

    </RelativeLayout>

</TabHost>

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

?


1

2

3

4

5

6

7

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

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

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

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

</selector>

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

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

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

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

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:orientation="vertical" >

    <ImageView

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

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

    <TextView

        android:id="@+id/tv"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:layout_marginBottom="0sp"

        android:gravity="center_horizontal"/>

</LinearLayout>

最后是我们的main.java:

?


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

package com.app.main;

import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.widget.TabHost;

import android.widget.TabHost.TabSpec;

import android.widget.TextView;

public class Main extends Activity {

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

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

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

        tabHost.setup();

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

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

        tv1.setText("tab1");

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

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

        tv2.setText("tab2");

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

                .setContent(R.id.tabs1);

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

                .setContent(R.id.tabs2);

        tabHost.addTab(spec1);

        tabHost.addTab(spec2);

    }

}

实现的效果:

时间: 2024-10-16 11:32:19

自定义TabWidget的相关文章

【Android UI设计与开发】第06期:底部菜单栏(一)使用TabActivity实现底部菜单栏

转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/8989063       从这一篇文章开始,我们将进入到一个应用程序主界面UI的开发和设计中了,底部菜单栏在Android的应用开发当中占有非常重要的地位.几乎所有的手机应用程序都有底部菜单栏这样的控件,主要是因为手机的屏幕大小有限,这样一种底部菜单栏实现起来的效果可以很方便的为用户切换自己所需要的界面,具有更强的交互性.底部菜单栏的样式和效果也是五花八门,多的数不胜数,但是

【读书笔记-《Android游戏编程之从零开始》】6.Android 游戏开发常用的系统控件(TabHost、ListView)

3.9 TabSpec与TabHost TabHost类官方文档地址:http://developer.android.com/reference/android/widget/TabHost.html Android 实现tab视图有2种方法,一种是在布局页面中定义<tabhost>标签,另一种就是继承tabactivity.但是我比较喜欢第二种方式,应为如果页面比较复杂的话你的XML文件会写得比较庞大,用第二种方式XML页面相对要简洁得多. <?xml version="1

TabActivity实现底部菜单栏(六)

滴水穿石不是靠力,而是因为不舍昼夜. 本讲内容:TabActivity实现底部菜单栏 TabActivity这个类已经在Android4.0的系统中被弃用了,新的应用程序应该使用Fragment来代替该类的开发 示例效果图      (一)第一种实现方式:隐藏TabWidget,通过RadioGroup和RadioButton实现底部菜单栏.这种方式更漂亮,也更灵活,大部分的应用程序基本都是使用这种方式,通过setCurrentTabByTag()方法来切换不同的选项卡. 下面是res/layo

自定义TabHost,TabWidget样式

先看效果: 京东商城底部菜单栏 新浪微博底部菜单栏 本次学习效果图: 第一,主布局文件(启动页main.xml,位于res/layout目录下)代码 1 <?xml version="1.0" encoding="utf-8"?> 2 <TabHost xmlns:android="http://schemas.android.com/apk/res/android" 3 android:layout_width="f

Android 自定义TabHost,TabWidget样式

界面比较简单,要想做得漂亮换几张图片就可以了. 第一步:先在布局(这里用了main.xml创建时自动生成的)里面放上TabHost ,只要将TabHost控件托至屏幕中就可: <?xml version="1.0" encoding="utf-8"?> <TabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id

TabWidget修改tab颜色,自定义样式

可以通过tabWidget->setStyleSheet方法,设置样式,包括tab的样式. 如 1 QTabWidget* m_MainTab; 2 m_MainTab->setStyleSheet("QTabWidget::pane{border-width:1px;border-color:rgb(96, 96, 96);\ 3 border-style: outset;background-color: rgb(96, 96, 96);} 4 QTabWidget::tab-b

【原创】android——Tabhost 自定义tab+底部实现+intent切换内容

1,实现tabhost自定义格式,再此仅仅显示背景和文字,效果图预览:(底边栏所示) (图片变形) 2,xml配置 activity_user的XML配置  1 <TabHost xmlns:android="http://schemas.android.com/apk/res/android" 2 xmlns:tools="http://schemas.android.com/tools" 3 android:id="@+id/tabhost&qu

Android开发之自定义TabHost文字及背景(源代码分享)

使用TabHost 可以在一个屏幕间进行不同版面的切换,而系统自带的tabhost界面较为朴素,我们应该如何进行自定义修改优化呢 MainActivity的源代码 package com.dream.ledong; import android.app.TabActivity; import android.content.Intent; import android.graphics.Color; import android.os.Bundle; import android.view.Gr

Android 实现分页(使用TabWidget/TabHost)

注:本文为转载,但该内容本人已亲身尝试,确认该方法可行,代码有点小的改动,转载用作保存与分享. 原作者地址:http://gundumw100.iteye.com/blog/853967 个人吐嘈:据说TabWidget已经过时了,取而代之的是Fragment,但关于这个Fragment暂时还没时间研讨,现使用的是TabWidget方法,个人感觉实现出来的效果还是很不错的. 自定义TabHost:不用继承TabActivity,具体代码如下: 定义布局文件:activity_main.xml <