How to make TabHost located and docked inside a panel, not full screen

Question

I want to get the layout structure as it shown on the picture. Whatever I tried, it always makes TabHost spreaded over Linear, into full screen.

This layout structure was modified many times. I tried all weight and gravity and match_parent, fill parent.. all of them make TabHost on top and the bottom Linear is not visible. So if you see some crazy tags, don't be surprised :)

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

    <TabHost
        android:id="@+id/tabHost"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal">

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

    </TabHost>

    <LinearLayout
        android:layout_weight="1"
        android:background="@color/white"
        android:layout_height="60dp"
        android:layout_marginStart="0dp"
        android:layout_marginTop="0dp"
        android:layout_alignParentBottom="true"
        android:layout_width="fill_parent">

        <Button
            android:layout_width="100dp"
            android:layout_height="fill_parent"
            android:text="@string/finish_test"
            android:id="@+id/finishTest"
            android:background="@drawable/blueback"
            android:layout_alignParentRight="true"
            android:layout_gravity="right"
            android:nestedScrollingEnabled="false"
            android:onClick="onFinishClick" />
    </LinearLayout>

    </RelativeLayout>

But I need the screen to be divided into two panels.

Panel 1 - full area for TabHost

Panel 2 - fixed height and only for that linear.

Pls, help.

P.S. The Button is hown as just a part of Lineat. Pls, ignore it.

Maybe it's also important to mention that the tab panels I fill from code. And each tab is an activity layout.

I do it that way:

// on eCreate..

        TabHost mTabHost = (TabHost) findViewById(R.id.tabHost);
        mTabHost.setup(getLocalActivityManager());
        try {
            mTabHost.addTab(mTabHost.newTabSpec("tab0").setIndicator("title1", null).setContent(new Intent(this, HelloScreen.class)));
            mTabHost.addTab(mTabHost.newTabSpec("tab1").setIndicator("title2", null).setContent(new Intent(this, BeginTest.class)));
            mTabHost.addTab(mTabHost.newTabSpec("tab2").setIndicator("title3", null).setContent(new Intent(this, Second.class)));
        } catch (Exception e) {
            throw e;
        }

Then I hide TabWidget.. and always these tabs (with activities inside) occupy full screen..

Maybe I am wrong, but for me Activity is just like a Window in Windows.. or in terms of Winform.NET - User Control or a WinForm..

In.NET such structure works perfect.. I'm not sure how the Android manages the Activities..

Answer 1

The answer is hidden in the correct Layout parameters and correct type of Layouts.

You can use Fragment or Activity (they are deprecated, but I found them easier to implement, especially if you need to serve any View (buttons, canvas, texts.. etc.).. just do everythin "the groove tube" as you do when manage an Activity. Adding tabs - use my code above..

But the Layers.. they should be as follows:

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

    <TabHost
        android:id="@+id/tabHost"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical">

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

        </RelativeLayout>
    </TabHost>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_weight="1"
        android:background="@color/white"
        android:layout_height="60dp"
        android:layout_marginStart="0dp"
        android:layout_marginTop="0dp"
        android:layout_alignParentBottom="true"
        android:layout_width="fill_parent">

        <Button
            android:layout_width="100dp"
            android:layout_height="fill_parent"
            android:text="@string/your_text"
            android:id="@+id/yourId"
            android:layout_alignParentRight="true"
            android:layout_gravity="right"
            android:nestedScrollingEnabled="false"
            android:onClick="onYourClick" />
    </LinearLayout>
</LinearLayout>

To hide the TabHost TabWidget use:

mTabHost.getTabWidget().getChildAt(0).setVisibility(View.GONE);

On your MainActivity eCreate..

And then.. just use any method.. by button or from code to show the required Tab panel, using setCurrentTab(# of you Tab);

Very smooth solution..