Android: Layout on top of tabs

Question

As you can see, a linearlayout is on top of the tabs. What I want is to align the LinearLayout bottom to the tabs top.

Alternatively aligning the RelativeLayout to the top of tabs may also work.

Here's the corresponding code for the view above:

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout android:id="@+id/RelativeLayout01" android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android">
    <LinearLayout android:layout_width="fill_parent" android:orientation="vertical" android:layout_height="wrap_content" android:id="@+id/LinearLayout02" android:layout_alignParentBottom="true">
        <FrameLayout android:id="@+id/FrameLayout02" android:layout_height="wrap_content" android:layout_width="fill_parent" android:paddingTop="20sp" android:paddingBottom="20sp">
            <ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/record" android:layout_gravity="center_horizontal" android:id="@+id/RecordImageButton"></ImageButton>
        </FrameLayout>
        <SeekBar android:id="@+id/SeekBar01" android:layout_height="wrap_content" android:layout_width="fill_parent" android:paddingBottom="5sp" android:paddingLeft="10sp" android:paddingRight="10sp"></SeekBar>
        <FrameLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/FrameLayout03">
            <LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/LinearLayout02" android:layout_gravity="center_horizontal">
                <ImageButton android:layout_width="wrap_content" android:id="@+id/ImageButton01" android:layout_height="wrap_content" android:src="@drawable/play_rev"></ImageButton>
                <ImageButton android:layout_width="wrap_content" android:id="@+id/ImageButton02" android:layout_height="wrap_content" android:src="@drawable/play_stop"></ImageButton>
                <ImageButton android:layout_width="wrap_content" android:id="@+id/ImageButton03" android:layout_height="wrap_content" android:src="@drawable/play"></ImageButton>
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>
</RelativeLayout>

Here is the code for the tabs:

<?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">

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

        <TabWidget
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@android:id/tabs"
        android:layout_alignParentBottom="true" />

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

    </RelativeLayout>
</TabHost>

MainActivity, which sets an activity for each tab:

public void initTabs()
{
    Resources res = getResources(); // Resource object to get Drawables
    TabHost tabHost = getTabHost();  // The activity TabHost
    TabHost.TabSpec spec;  // Resusable TabSpec for each tab
    Intent intent;  // Reusable Intent for each tab

    intent = new Intent().setClass(this, FirstActivity.class);
    spec = tabHost.newTabSpec("tab1").setIndicator("Tab",
                      res.getDrawable(R.drawable.ic_tab_artists))
                  .setContent(intent);
    tabHost.addTab(spec);

    intent = new Intent().setClass(this, SecondActivity.class);
    spec = tabHost.newTabSpec("tab2").setIndicator("Tab 2",
                      res.getDrawable(R.drawable.ic_tab_artists))
                  .setContent(intent);
    tabHost.addTab(spec);

    intent = new Intent().setClass(this, ThridActivity.class);
    spec = tabHost.newTabSpec("tab3").setIndicator("Tab 3",
                      res.getDrawable(R.drawable.ic_tab_artists))
                  .setContent(intent);
    tabHost.addTab(spec);

    tabHost.setCurrentTab(0);
}

Answer 1

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout android:id="@+id/RelativeLayout01"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <LinearLayout android:layout_width="fill_parent"
        android:orientation="vertical" android:id="@+id/LinearLayout02"
        android:layout_alignParentBottom="true" android:weightSum="1"
        android:layout_height="wrap_content">
        <LinearLayout android:id="@+id/LinearLayout03"
            android:layout_width="fill_parent" android:layout_height="fill_parent"
            android:layout_weight=".25" android:weightSum="1"
            android:orientation="vertical">
            <FrameLayout android:id="@+id/FrameLayout02"
                android:layout_height="wrap_content" android:layout_width="fill_parent"
                android:paddingTop="20sp" android:paddingBottom="20sp"
                android:layout_weight=".5">
                <ImageButton android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:src="@drawable/record"
                    android:layout_gravity="center_horizontal" android:id="@+id/RecordImageButton"></ImageButton>
            </FrameLayout>
            <SeekBar android:id="@+id/SeekBar01" android:layout_height="wrap_content"
                android:layout_width="fill_parent" android:paddingBottom="5sp"
                android:paddingLeft="10sp" android:paddingRight="10sp"></SeekBar>
            <FrameLayout android:layout_width="fill_parent"
                android:layout_height="wrap_content" android:id="@+id/FrameLayout03">
                <LinearLayout android:layout_height="wrap_content"
                    android:layout_width="wrap_content" android:id="@+id/LinearLayout02"
                    android:layout_gravity="center_horizontal">
                    <ImageButton android:layout_width="wrap_content"
                        android:id="@+id/ImageButton01" android:layout_height="wrap_content"
                        android:src="@drawable/play_rev"></ImageButton>
                    <ImageButton android:layout_width="wrap_content"
                        android:id="@+id/ImageButton02" android:layout_height="wrap_content"
                        android:src="@drawable/play_stop"></ImageButton>
                    <ImageButton android:layout_width="wrap_content"
                        android:id="@+id/ImageButton03" android:layout_height="wrap_content"
                        android:src="@drawable/play"></ImageButton>
                </LinearLayout>
            </FrameLayout>
        </LinearLayout>
        <LinearLayout android:id="@+id/TabLayout" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight=".75">
        </LinearLayout>
    </LinearLayout>
</RelativeLayout>

You can add your TabHost things into the TabLayout(last LinearLayout). Hope that will solve your problem.

Answer 2

You can create params and rules :

RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT)

params.addRule(RelativeLayout.Top, anotherView.getId());

This line means that one view bottom will be top of another... This can works but it is adviced to do that in xml.