How do I use tabHost for Android
Asked Answered
C

2

18

I have looked at posts on Stack Overflow and at tutorials on other websites, and I cannot understand how to use TabHost. Can someone please explain it to me and maybe send me a link to a tutorial?

Crapshooter answered 24/7, 2012 at 0:35 Comment(2)
is there really a realtionship between tabHosts vs. fragments?Socialite
@AndyHarris TabHost is NOT deprecated. TabActivity is. Please stop spreading false rumors.Pressor
P
71

Concept TabHost

enter image description here

  1. In ManiActivity extends TabActivity

    public class MainActivity extends TabActivity {
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    
        //setContentView(R.layout.activity_main);
    
        TabHost mTabHost = getTabHost();
    
        mTabHost.addTab(mTabHost.newTabSpec("first").setIndicator("First").setContent(new Intent(this  ,FirstActivity.class )));
        mTabHost.addTab(mTabHost.newTabSpec("second").setIndicator("Second").setContent(new Intent(this , SecondActivity.class )));
        mTabHost.setCurrentTab(0);
    
    
    }
    }
    
  • In this activity not use layout "activity_main.xml" .

  • Tabhost mTabHost = getTabHost(); is create main tab.

  • mTabHost.newTabSpec("first") is create tabspec id "first".

  • setIndicator("First") is create text "First" in title tab.

  • setContent(new Intent(this ,FirstActivity.class )) is use content from FirstActivity.class ( FirstActivity.java )

  • mTabHost.addTab(....) is add spectab to main tab

  • mTabHost.setCurrentTab(0) is defult tab when start page.

FirstActivity.java

public class FirstActivity extends Activity{

@Override
protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView( R.layout.first_layout );
}

}

SecondActivity.java

public class SecondActivity extends Activity{
@Override
protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);

    setContentView( R.layout.second_layout );
}
}
  • "R.layout.first_layout" is content from first_layout.xml

  • "R.layout.second_layout" is content from second_layout.xml

In AndroidManifest.xml add activity name ".FirstActivity" and ".SecondActivity" in example xml.

enter image description here

Finish!!!!!

enter image description here

Prewar answered 24/7, 2012 at 9:17 Comment(6)
The tabs dont appear... why?Pout
getTabHost() does not work for me. It does not import as a resource.Calomel
@Calomel you should have your activity Extend TabActivityMink
Shouldn't we use fragment for each tabs ?Cutty
@SebastienFERRAND yes Fragment's are always the better choicePresentative
This is deprecatedKrieger
P
7

First of all while TabHost is not deprecated, TabActivity on other hand is deprecated due to Fragment API.

There are two ways to use TabHost; using Fragment via FragmentTabHost and using TabHost.TabContentFactory.

1. Using Fragment via FragmentTabHost

This sample code show you how to use TabHost in Activity.

FragmentTabHostActivity.java

public class FragmentTabHostActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.fragment_tab_host_activity);

        FragmentTabHost fragmentTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
        fragmentTabHost.setup(this, getSupportFragmentManager(), android.R.id.tabcontent);
        fragmentTabHost.addTab(getTabSpec1(fragmentTabHost), Tab1Fragment.class, null);
        fragmentTabHost.addTab(getTabSpec2(fragmentTabHost), Tab2Fragment.class, null);
    }

    private TabHost.TabSpec getTabSpec1(FragmentTabHost tabHost) {
        return tabHost.newTabSpec("First Tab")
            .setIndicator("Tab1");
    }

    private TabHost.TabSpec getTabSpec2(FragmentTabHost tabHost) {
        return tabHost.newTabSpec("Second Tab")
            .setIndicator("Tab 2");
    }
}

fragment_tab_host_activity.xml

<android.support.v4.app.FragmentTabHost
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

    </LinearLayout>

</android.support.v4.app.FragmentTabHost>

Actually by using Fragment, you can use Tab inside a Fragment (Android docs).

2. Using TabHost.ContentFactory

TabHostActivity.java

public class TabHostActivity extends AppCompatActivity implements TabHost.TabContentFactory {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

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

        tabHost.addTab(getTabSpec1(tabHost));
        tabHost.addTab(getTabSpec2(tabHost));
    }

    private TabHost.TabSpec getTabSpec1(TabHost tabHost) {
        return tabHost.newTabSpec("First Tab")
            .setIndicator("Tab1")
            .setContent(this);
    }

    private TabHost.TabSpec getTabSpec2(TabHost tabHost) {
        return tabHost.newTabSpec("Second Tab")
            .setIndicator("Tab 2")
            .setContent(this);
    }

    @Override
    public View createTabContent(String tag) {
        return LayoutInflater.from(this).inflate(R.layout.activity_tab_1, null);
    }
}

activity_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="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

    </LinearLayout>

</TabHost>

However, I personally recommend using newest Material Design style TabLayout class.

Pressor answered 13/5, 2017 at 4:21 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.