Home  >  Article  >  Backend Development  >  Android UI control series: TabWidget (switch card)

Android UI control series: TabWidget (switch card)

黄舟
黄舟Original
2017-01-19 09:49:011315browse

The Tab tab is similar to the interface of a phone book. It switches different contents through multiple tabs. To achieve this effect, you must first know the TabHost. It is a container used to store multiple Tab tabs. Each Tab can Correspond to your own layout, for example, the Tab layout in the phone book is a linear layout

To use TabHost, you must first obtain the TabHost object through the getTabHost method, and then add Tab to the TabHost through the addTab method. Of course, every Each Tab will generate an event when switching. To capture this event, you need to set the event listener setOnTabChangedListener of TabActivity

The following is a small example:

TabTest.java

package org.hualang.tab;

import android.app.Activity;
import android.app.TabActivity;
import android.graphics.Color;
import android.os.Bundle;
import android.widget.TabHost;
import android.widget.Toast;
import android.widget.TabHost.OnTabChangeListener;

public class TabTest extends TabActivity {
    /** Called when the activity is first created. */
        TabHost tabhost;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        //取得TabHost对象
        tabhost = getTabHost();
        //为TabHost添加标签
        //新建一个newTabSpec(newTabSpec)
        //设置其标签和图标(setIndicator)
        //设置内容(setContent)
        tabhost.addTab(tabhost.newTabSpec("tab1")
                        .setIndicator("TAB 1",getResources().getDrawable(R.drawable.img1))
                        .setContent(R.id.text1));
        tabhost.addTab(tabhost.newTabSpec("tab2")
                .setIndicator("TAB 2",getResources().getDrawable(R.drawable.img2))
                .setContent(R.id.text2));
        tabhost.addTab(tabhost.newTabSpec("tab3")
                .setIndicator("TAB 3",getResources().getDrawable(R.drawable.img3))
                .setContent(R.id.text3));
        //设置TabHost的背景颜色
        //tabhost.setBackgroundColor(Color.argb(150,22,70,150));
        //设置TabHost的背景图片资源
        tabhost.setBackgroundResource(R.drawable.bg0);
        //设置当前显示哪个标签
        tabhost.setCurrentTab(0);
        //标签切换事件处理,setOnTabChangedListener
        tabhost.setOnTabChangedListener(new OnTabChangeListener()
        {
                public void onTabChanged(String tabId)
                {
                        Toast toast=Toast.makeText(getApplicationContext(), "现在是"+tabId+"标签", Toast.LENGTH_SHORT);
                        toast.show();
                }
        });

    }
}

main .xml

<?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="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">
            <TextView
                android:id="@+id/text1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:text="选项卡1" />
            <TextView
                android:id="@+id/text2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:text="选项卡2" />
            <TextView
                android:id="@+id/text3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:text="选项卡3" />
            </FrameLayout>
    </LinearLayout>
</TabHost>

The running effect is as follows:

Android UI control series: TabWidget (switch card)

The above is the content of the Android UI control series: TabWidget (switch card), more related content Please pay attention to the PHP Chinese website (www.php.cn)!


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn