CODEWITHSUNDEEP
androidandroid-tabhost
jayeshkv
jayeshkv

Reputation: 2208

Tabhost title being cropped off

This is my xml file 

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
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" 
        android:gravity="center" >
    </TabWidget>

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

</TabHost>

and this is my .class file 

    TabHost tabHost = getTabHost();

    TabSpec ta1= tabHost.newTabSpec("title");
    ta1.setIndicator("title");
    Intent ta1intent = new Intent(this, 1_webview.class);
    ta1.setContent(ta1intent);

    TabSpec ta2= tabHost.newTabSpec("title1");
    ta2.setIndicator("Title1");
    Intent ta2intent = new Intent(this, 2_webview.class);
    ta2.setContent(ta2intent);

    TabSpec ta3= tabHost.newTabSpec("two linetitle");
    ta3.setIndicator("Two line title");
    Intent ta3intent = new Intent(this, 3_webview.class);
    ta3.setContent(ta3intent);

    TabSpec ta4 = tabHost.newTabSpec("two line title");
    ta4.setIndicator("Two line //n title");  //tried using line break displays Two line \N title 
    Intent ta4intent = new Intent(this, week_webview.class);
    ta4.setContent(ta4intent);

this is what i get

output image

is there any way that i could get my title in the tab3 and tab4 to be multilined rather than being cropped off, the actual text in tab3 and tab4 are "two lined text" but it displays just the two line.

or is there a way to decrease the font size so that all words are visible ?

Upvotes: 3

Views: 2831

Answers (3)

Pratibha Sarode
Pratibha Sarode

Reputation: 1849

        The activity must extend TabActivity implements
        OnTabChangeListener

In onCreate()...

            tabHost = getTabHost();
            tabHost.getTabWidget().setDividerDrawable(R.color.trans);
            tabHost.getTabWidget().setShowDividers(
                    TabWidget.SHOW_DIVIDER_MIDDLE);

            tabHost.setup();
            tabHost.setOnTabChangedListener(this);

            // Inbox Tab
            TabSpec inboxSpec = tabHost.newTabSpec(INBOX_SPEC);

            // Tab Icon
            inboxSpec.setIndicator(INBOX_SPEC);
            Intent inboxIntent = new Intent(this,
                    IndividualReminderActivity.class);

            // Tab Content
            inboxSpec.setContent(inboxIntent);


            // Outbox Tab
            TabSpec outboxSpec = tabHost.newTabSpec(OUTBOX_SPEC);


            outboxSpec.setIndicator(OUTBOX_SPEC);
            Intent outboxIntent = new Intent(this,
                    CleanUpReminderActivity.class);

            outboxSpec.setContent(outboxIntent);

            // Adding all TabSpec to TabHost
            tabHost.addTab(inboxSpec); // Adding Inbox tab
            tabHost.addTab(outboxSpec); // Adding Outbox tab


            RelativeLayout.LayoutParams rllp = new RelativeLayout.LayoutParams(
                    ViewGroup.LayoutParams.WRAP_CONTENT,
                    ViewGroup.LayoutParams.WRAP_CONTENT);
            rllp.addRule(RelativeLayout.CENTER_IN_PARENT);

            for (int i = 0; i < tabHost.getTabWidget().getChildCount(); i++) {
                //setting background color
                tabHost.getTabWidget().getChildAt(i)
                        .setBackgroundColor(Color.parseColor("#000000"));

                //setting hieght width 
                tabHost.getTabWidget().getChildAt(i)
                        .findViewById(android.R.id.title).setLayoutParams(rllp);

                tabHost.getTabWidget().getChildAt(i).getLayoutParams().height
=100;
                tabHost.getTabWidget().getChildAt(i).getLayoutParams().width = 220;
                    }

and xml is

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




    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <TabHost
            android:id="@android:id/tabhost"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:background="@color/black_color"
                android:orientation="vertical" >

                <TabWidget
                    android:id="@android:id/tabs"
                    android:layout_width="fill_parent"
                    android:layout_height="60dp"

                    android:showDividers="middle"
                    android:textSize="@dimen/text_size" />

                <FrameLayout
                    android:id="@android:id/tabcontent"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:background="#000000" />
            </LinearLayout>
        </TabHost>

        <View
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:background="@color/ediitext_color" />
    </LinearLayout>

</LinearLayout>

Upvotes: 0

thpitsch
thpitsch

Reputation: 2036

Maybe there is enough space for the title, but the padding in the TabView ist to large.

In my case, the titles are short enough to fit in the tabs at API-8 to API-14, but not in API-17. Removing the padding solves my problem.

After adding the 5 tabs to my tabHost I do the following:

    for (int i=0; i<5; i++) {
        View tabView = tabHost.getTabWidget().getChildTabViewAt(i);
        tabView.setPadding(0, 0, 0, 0);
        TextView tv = (TextView)tabView.findViewById(android.R.id.title);
        tv.setSingleLine();
        tv.setTextSize(14);
    }

Upvotes: 3

Riandy
Riandy

Reputation: 372

I believe for smaller screen size it is not a good idea to display a lengthy tab name. therefore android kind of limits and cutoff the remaining if its too long. But you can make the text as image and put it in the tab

Something like this:

 //CRAFTING TAB
    TabSpec craftTabSpec = tabHost.newTabSpec("Crafting");      
    craftTabSpec.setIndicator("",getResources().getDrawable(R.drawable.YOURIMAGE));
    Intent craftIntent = new Intent(this, Bifrost.class);
    craftTabSpec.setContent(craftIntent);

EDIT: If you want to decrease the font size, yes you can. Define your own styles.

Folow the detailed steps from How to change the font size of tabhost in android

Hope that helps

Upvotes: 2

Related Questions