Search code examples
androidandroid-tabhost

How to keep TabHost on the bottom?


I'm new to Android and i just created my first TabHost. Here's the Code of the XML:

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:weightSum="1">

        <TextView
            style="@style/NormalFont"
            android:text="@string/stats"
            android:layout_weight="0.10"/>


        <TabHost
            android:id="@+id/TabHostStats"
            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">
                        <ScrollView
                            android:id="@+id/ScrollViewSmileyFilter"
                            android:scrollbars="vertical"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent">
                            <TableLayout
                                android:id="@+id/TableLayoutSmileyFilter"
                                android:layout_width="fill_parent"
                                android:layout_height="fill_parent"
                                android:stretchColumns="*">
                            </TableLayout>
                        </ScrollView>
                        <ScrollView
                            android:id="@+id/ScrollViewADFilter"
                            android:scrollbars="vertical"
                            android:layout_width="fill_parent"
                            android:layout_height="fill_parent">
                            <TableLayout
                                android:id="@+id/TableLayoutADFilter"
                                android:layout_width="fill_parent"
                                android:layout_height="fill_parent"
                                android:stretchColumns="*">
                            </TableLayout>
                        </ScrollView>
                    </FrameLayout>
            </LinearLayout>
        </TabHost>
</LinearLayout>

and here's the code of the Activity:

 public class StatsActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.stats); 

        TabHost host = (TabHost) findViewById(R.id.TabHostStats);
        host.setup();


        /** Dieser Code generiert den Tag für die Smileyfilter Stats**/

        TabSpec SmileyFilterTab = host.newTabSpec("sftab");
        SmileyFilterTab.setIndicator(getResources().getString(R.string.sfstats));
        SmileyFilterTab.setContent(R.id.ScrollViewSmileyFilter);
        host.addTab(SmileyFilterTab);

        /**Dieser Code generiert den Tag für die Auto Delete Filter Stats **/

        TabSpec AutoDeleteTab = host.newTabSpec("adtab");
        AutoDeleteTab.setIndicator(getResources().getString(R.string.adstats));
        AutoDeleteTab.setContent(R.id.ScrollViewADFilter);
        host.addTab(AutoDeleteTab);



    }
}

So the to registers of my TabHosts are on top. But I want them on the button, how can I do this? And also how and where can I change the Color of them. I want them unclicked in black and if they are clicked in blue.


Solution

  • i have seen many implementations. but this guys i like the most.

    enter image description here

    he has a tutorial and a downloadable sample project.

    EDIT after all these years the link seems to be broken. so here is the code. here is an alternate link and just in case here is the code.

    Images

    ebay.pngflickr.pngskype.pngyou_tube.png

    TabsDemoActivity.java

    package com.bakhtiyor.android.tabs;
    import android.app.TabActivity;
    import android.graphics.Color;
    import android.os.Bundle;
    import android.view.View;
    import android.widget.RadioButton;
    import android.widget.RadioGroup;
    import android.widget.TabHost;
    import android.widget.TextView;
    public class TabsDemoActivity extends TabActivity implements TabHost.TabContentFactory {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        TabHost tabHost = getTabHost();
    tabHost.addTab(tabHost.newTabSpec("ebay").setIndicator("eBay").setContent(this));
    tabHost.addTab(tabHost.newTabSpec("flickr").setIndicator("Flickr").setContent(this));
    tabHost.addTab(tabHost.newTabSpec("skype").setIndicator("skype").setContent(this));
    tabHost.addTab(tabHost.newTabSpec("you_tube").setIndicator("YouTube").setContent(this));
        setupUI();
    }
    @Override
    public View createTabContent(String tag) {
        TextView tv = new TextView(this);
        tv.setTextColor(Color.BLACK);
        tv.setTextSize(20);
        if (tag.equals("flickr")) {
            tv.setText(R.string.flickr);
        } else if (tag.equals("ebay")) {
            tv.setText(R.string.ebay);
        } else if (tag.equals("skype")) {
            tv.setText(R.string.skype);
        } else if (tag.equals("you_tube")) {
            tv.setText(R.string.you_tube);
        }
        return tv;
    }
    private void setupUI() {
        RadioButton rbFirst = (RadioButton) findViewById(R.id.first);
        RadioButton rbSecond = (RadioButton) findViewById(R.id.second);
        RadioButton rbThird = (RadioButton) findViewById(R.id.third);
        RadioButton rbFourth = (RadioButton) findViewById(R.id.fourth);
        rbFirst.setButtonDrawable(R.drawable.ebay);
        rbSecond.setButtonDrawable(R.drawable.flickr);
        rbThird.setButtonDrawable(R.drawable.skype);
        rbFourth.setButtonDrawable(R.drawable.you_tube);
        RadioGroup rg = (RadioGroup) findViewById(R.id.states);
        rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            public void onCheckedChanged(RadioGroup group, final int checkedId) {
                switch (checkedId) {
                case R.id.first:
                    getTabHost().setCurrentTab(0);
                    break;
                case R.id.second:
                    getTabHost().setCurrentTab(1);
                    break;
                case R.id.third:
                    getTabHost().setCurrentTab(2);
                    break;
                case R.id.fourth:
                    getTabHost().setCurrentTab(3);
                    break;
                }
            }
        });
    }
    }
    

    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">
            <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="0dip" android:layout_weight="1" android:padding="20dip" android:background="#fff"/>
    
                <RadioGroup android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:checkedButton="@+id/first" android:id="@+id/states">
                    <RadioButton android:id="@+id/first" android:background="@drawable/button_radio" android:width="80dip" android:height="70dip" />
                    <RadioButton android:id="@+id/second" android:background="@drawable/button_radio" android:width="80dip" android:height="70dip" />
                    <RadioButton android:id="@+id/third" android:background="@drawable/button_radio" android:width="80dip" android:height="70dip" />
                    <RadioButton android:id="@+id/fourth" android:background="@drawable/button_radio" android:width="80dip" android:height="70dip" />
                </RadioGroup>
    
            <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="0" android:visibility="gone" />
        </LinearLayout>
    </TabHost>
    

    strings.xml

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <string name="hello">Hello World, TabsDemoActivity!</string>
        <string name="app_name">Tabs</string>
        <string name="flickr">Flickr is an image and video hosting website, web services suite, and online community platform. In addition to being a popular website for users to share personal photographs, the service is widely used by bloggers as a photo repository. As of October 2009, it claims to host more than 4 billion images.</string>
        <string name="ebay">eBay Inc. is an American Internet company that manages eBay.com, an online auction and shopping website in which people and businesses buy and sell a broad variety of goods and services worldwide.</string>
        <string name="skype">Skype is a software application that allows users to make voice calls over the Internet. Calls to other users of the service and, in some countries, to free-of-charge numbers, are free, while calls to other landlines and mobile phones can be made for a fee. Additional features include instant messaging, file transfer and video conferencing.</string>
        <string name="you_tube">YouTube is a video sharing website on which users can upload and share videos. Three former PayPal employees created YouTube in February 2005. In November 2006, YouTube, LLC was bought by Google Inc. for $1.65 billion, and is now operated as a subsidiary of Google.</string>
    </resources>
    

    button_radio.xml

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_checked="true" android:state_window_focused="false" android:drawable="@drawable/selected" />
        <item android:state_checked="false" android:state_window_focused="false" android:drawable="@drawable/unselected" />
        <item android:state_checked="true" android:state_pressed="true" android:drawable="@drawable/selected" />
        <item android:state_checked="false" android:state_pressed="true" android:drawable="@drawable/unselected" />
        <item android:state_checked="true" android:state_focused="true" android:drawable="@drawable/selected" />
        <item android:state_checked="false" android:state_focused="true" android:drawable="@drawable/unselected" />
        <item android:state_checked="false" android:drawable="@drawable/unselected" />
        <item android:state_checked="true" android:drawable="@drawable/selected" />
    </selector>
    

    selected.xml

    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
        <gradient android:startColor="#FFAAAAAA" android:endColor="#FF333333" android:angle="270" />
    </shape>
    

    unselected.xml

    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <gradient android:startColor="#FF444444" android:endColor="#FF000000" android:angle="270" />
    </shape>
    

    EDIT here is a couple of other links

    android tabwidget

    http://www.anddev.org/code-snippets-for-android-f33/iphone-tabs-for-android-t14678.html