Inflating multiple instances of the same layout into tabs

Question

This is a problem that has troubled me for a few days now. I've done my best searching for a solution, but everywhere I go it says the approach I'm currently using is the right one.

The situation is simple: I have five tabs, which are to contain the same layout with slightly different content (for example by using setText to change one of the labels). As such, I am inflating the layout five times, and adding all of them as seperate tabs.

This is my code:

package com.test;

import android.app.TabActivity;
import android.content.res.Resources;
import android.os.Bundle;
import android.view.View;
import android.widget.TabHost;
import android.widget.TextView;

public class TestActivity extends TabActivity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        TabHost host = getTabHost();
        Resources res = getResources();

        String[] days = { "Monday", "Tuesday", "Wednesday", "Thursday", "Friday" };

        for (int i = 0; i < days.length; i++)
        {
            View contents = getLayoutInflater().inflate(R.layout.test, host.getTabContentView(), true);

            ((TextView)contents.findViewById(R.id.title)).setText(days[i]);

            host.addTab
            (
                host.newTabSpec(days[i]).
                setIndicator(days[i]).
                setContent(contents.getId())
            );

            host.getTabWidget().getChildAt(i).getLayoutParams().height = 55;
        }
    }
}

And my layout file looks like this:

<?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="match_parent"
    android:orientation="vertical"
    android:padding="6dip">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Test"
        android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>

The problem is that, instead of the text being on seperate tabs, all the text overlaps eachother and is the same for every tab. It might be something really simple that I'm overlooking. Any help is appreciated.

score 2 · Accepted Answer · answered Oct 23 '11 at 13:56

 all the text overlaps eachother and is the same for every tab

They ain't overlapping each other from my discovery. If you remove android:text="Test" from your layout file, you will be seeing only Friday in all tab.

It looks like you will need to use TabContentFactory to achieve what you want. Here is my solution to your problem. It will give you what you needed.

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    final TabHost host = getTabHost();
    Resources res = getResources();

    final String[] days = { "Monday", "Tuesday", "Wednesday", "Thursday",
            "Friday" };

    for (int i = 0; i < days.length; i++) {
        TabHost.TabSpec spec=host.newTabSpec(days[i]);
        spec.setContent(new TabHost.TabContentFactory() {
            public View createTabContent(String tag) {
                View wv = getLayoutInflater().inflate(R.layout.test, host.getTabContentView(), false);
                ((TextView) wv.findViewById(R.id.title)).setText(tag);
                return(wv);
            }
        });
        spec.setIndicator(days[i]);
        host.addTab(spec);
    }
    host.setCurrentTab(0);
}

Here is the link where I get started https://github.com/commonsguy/cw-android/tree/master/Fancy/DynamicTab

Credit goes to Mark Murphy(Commonsguy).

Thanks! That solved my problem. It leaves me wondering though... am I wrong in the assumption that Inflate creates a new instance of the View every time? — Sven, Oct 23 '11 at 14:17
Inflating in general does create a new view. But not this `inflate(R.layout.test, host.getTabContentView(), true)`. It will give you back the same view everytimes you inflate. — PH7, Oct 23 '11 at 14:32

score 1 · Answer 2 · answered May 23 '12 at 10:42

1

It is fun, but my problem was solved when I passed unique text for each tab (i.e. days[i], instead of constant "Friday" :)

TabHost.TabSpec spec=host.newTabSpec(days[i]);

answered May 23 '12 at 10:42

Andrew Krizhanovsky

610
7
11

Inflating multiple instances of the same layout into tabs

2 Answers2