如何将图像添加到“选项卡”按钮中

Question

I want to set an image instead of text in my tabs, i tried to add an "background" but it didn't work. it set a background to all of my tabs or to the layout. This is my main xml layout with tabs:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <TabHost
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/tabHost"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">
        <ScrollView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:fillViewport="false">
            <LinearLayout
                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"
                    android:onClick="clickOnList"
                    />
                <FrameLayout
                    android:id="@android:id/tabcontent"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent">

                    <RelativeLayout
                        android:orientation="vertical"
                        android:layout_width="fill_parent"
                        android:layout_height="460dp"
                        android:id="@+id/Home"
                        android:weightSum="1">

                        <Button
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Scan"
                            android:id="@+id/scanButton"
                            android:layout_gravity="center_horizontal"
                            android:layout_alignParentTop="true"
                            android:layout_centerHorizontal="true"
                            android:layout_marginTop="10dp" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Scan to find threats"
                            android:id="@+id/listViewTitle"
                            android:textStyle="bold"
                            android:textSize="18dp"
                            android:visibility="visible"
                            android:layout_gravity="center_horizontal"
                            android:layout_below="@+id/scanButton"
                            android:layout_centerHorizontal="true"
                            android:layout_marginTop="10dp" />

                        <ListView
                            android:layout_width="wrap_content"
                            android:layout_height="240dp"
                            android:id="@+id/suspectsList"
                            android:layout_below="@+id/listViewTitle"
                            android:layout_alignParentLeft="true"
                            android:layout_alignParentStart="true"
                            android:layout_marginTop="10dp" />

                        <Button
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Click to Connect"
                            android:id="@+id/Connect_Button"
                            android:layout_gravity="center_horizontal"
                            android:onClick="loginFunc"
                            android:layout_below="@+id/Apply"
                            android:layout_centerHorizontal="true"
                            android:layout_marginTop="10dp" />

                        <Button
                            style="?android:attr/buttonStyleSmall"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Apply All"
                            android:id="@+id/Apply"
                            android:layout_gravity="center_horizontal"
                            android:layout_below="@+id/suspectsList"
                            android:layout_centerHorizontal="true"
                            android:layout_marginTop="10dp" />

                        <Button
                            style="?android:attr/buttonStyleSmall"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="r"
                            android:id="@+id/restart"
                            android:layout_gravity="right"
                            android:layout_toRightOf="@+id/scanButton"
                            android:layout_marginTop="10dp"
                            android:layout_marginLeft="50dp">
                            </Button>

                    </RelativeLayout>

                    <LinearLayout
                        android:id="@+id/Quarantined"
                        android:layout_width="fill_parent"
                        android:layout_height="460dp"
                        android:orientation="vertical"
                        android:layout_gravity="right|bottom"
                        android:onClick="clickOnList">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Quarantined:"
                            android:id="@+id/QuarantinedListTitle"
                            android:textStyle="bold"
                            android:textSize="18dp"
                            android:visibility="visible"
                            android:layout_gravity="center_horizontal"
                            android:layout_below="@+id/scanButton"
                            android:layout_centerHorizontal="true"
                            android:layout_marginTop="10dp" />

                        <ListView
                            android:layout_width="wrap_content"
                            android:layout_height="240dp"
                            android:id="@+id/QuarantinedListView"
                            android:layout_margin="10dp" />

                        <Button
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Unquarantine Selected"
                            android:id="@+id/unQuarantinedSelected"
                            android:layout_alignBottom="@+id/tabHost"
                            android:layout_centerHorizontal="true"
                            android:layout_marginLeft="75dp" />
                    </LinearLayout>

                    <RelativeLayout
                        android:id="@+id/History"
                        android:layout_width="fill_parent"
                        android:layout_height="460dp"
                        android:orientation="vertical"
                        android:layout_gravity="center_horizontal|bottom">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:textAppearance="?android:attr/textAppearanceLarge"
                            android:text="History:"
                            android:id="@+id/historyTitle"
                            android:layout_alignParentTop="true"
                            android:layout_centerHorizontal="true" />

                        <ListView
                            android:layout_width="wrap_content"
                            android:layout_height="fill_parent"
                            android:id="@+id/HistoryListView"
                            android:layout_centerHorizontal="true"
                            android:layout_below="@+id/historyTitle"
                            android:layout_margin="10dp" />
                    </RelativeLayout>

                </FrameLayout>

            </LinearLayout>
        </ScrollView>
    </TabHost>

</RelativeLayout>

and this is how it looks like: http://www.myg.co.il/index.php?loc=see&pic=phpXtg66w.png

This is how i initialized the tabs:

TabHost tabHost = (TabHost)findViewById(R.id.tabHost);
// Create Tabs
tabHost.setup();
//1st tab - HomeTab
TabHost.TabSpec tabSpec = tabHost.newTabSpec("home");
//        tabHost.getTabWidget().setBackgroundResource(R.drawable.mglogo);
tabSpec.setContent(R.id.Home);
tabSpec.setIndicator("Home");
tabHost.addTab(tabSpec);
//2nd tab - HistoryTab
tabSpec = tabHost.newTabSpec("quarantine list");
tabSpec.setContent(R.id.Quarantined);
tabSpec.setIndicator("Quarantine List");
tabHost.addTab(tabSpec);
//3rd tab - HistoryTab
tabSpec = tabHost.newTabSpec("history");
tabSpec.setContent(R.id.History);
tabSpec.setIndicator("History");
tabHost.addTab(tabSpec);

i want to change the text : HOME / QUARANTINED / HISTORY to icons.

Answer 1

You have to create custom_tab_common.xml

    <?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
          android:id="@+id/tabImg"
          android:layout_width="@dimen/tabWidth"
          android:layout_height="wrap_content"
          android:gravity="center_horizontal"
          android:clickable="true"
          android:paddingTop="@dimen/tabTopPading"
          android:paddingBottom="@dimen/tabBottomPading"
          android:paddingLeft="@dimen/tabLeftPading"
          android:paddingRight="@dimen/tabRightPading"
          android:background="@drawable/tab_selector_common"/>

//This method is used to set view into tab

private static View createTabView(Context context, String tabText) {
        View view = LayoutInflater.from(context).inflate(R.layout.custom_tab_common, null, false);
        ImageView tv = (ImageView) view.findViewById(R.id.tabImg);
        tv.setText(tabText);
        return view;
    }

//Set into tab like this

        TabViewActivity.AddTab(TabViewActivity.this,this.tabHost,this.tabHost.newTabSpec("Tab4").setIndicator(createTabView(getApplicationContext(), Constant.Name)), (tabInfo = new TabInfo(
        Constant.Nem, Fragment.class)));
        this.mapTabInfo.put(tabInfo.tag, tabInfo);