Android: LinearLayout Overlay as small as possible

Question

I'm trying to create a Overlay that acts as a small Media Player.
I have created a new Activity that uses a theme which makes its background transparent (well dark transparent).

But I have issues when it comes to layouting.
The Overlay currently looks like that:

I'm trying to have the media player box (the white square) vertically centered and (vertically) as small as possible. I'm currently trying to achieve this by having the Layout of the Box sourrounded by two blank View in a LinearLayout.

Current code:

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

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent" 
        android:layout_weight="1" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#CCFFFFFF"
        android:id="@+id/overlay_layout" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:id="@+id/overlay_firstrow">

            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/overlay_playbutton"
                android:src="@android:drawable/ic_media_play"
                android:background="@null" />

            <SeekBar
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/overlay_seekbar" />
        </LinearLayout>


        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/overlay_firstrow"
            android:layout_alignParentLeft="true"
            android:id="@+id/overlay_text"
            android:text="filename" />

    </RelativeLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent" 
        android:layout_weight="1" />

</LinearLayout>

I know that the current code is not working (because I assigned both blank Views and the LinearLayout a weight of 1 - so the middle box takes up exactly one third of the screen height)
But I don't know how to do it correctly. My goal is that the middle box is as small as possible while the two outer (blank) Views take up the remaining space in equal parts.

I hope someone can help me achieve this.

Thanks in advance,

Uriel

Answer 1

The problems were:
The relative layout shouldn't have a weight of 1, because this is what makes it divide the total height equally in 3.
When you specify a weight of 1 or more, set the height (in this case) to zero
Also, your text was set to match_parent, this was the guy taking all the space.

<View
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" />

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#CCFFFFFF"
    android:id="@+id/overlay_layout" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/overlay_firstrow">

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/overlay_playbutton"
            android:src="@android:drawable/ic_media_play"
            android:background="@null" />

        <SeekBar
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/overlay_seekbar" />
    </LinearLayout>


    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/overlay_firstrow"
        android:layout_alignParentLeft="true"
        android:id="@+id/overlay_text"
        android:text="filename" />

</RelativeLayout>

<View
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1" />

Answer 2

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

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <RelativeLayout
        android:id="@+id/overlay_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#CCFFFFFF" >

        <LinearLayout
            android:id="@+id/overlay_firstrow"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <ImageButton
                android:id="@+id/overlay_playbutton"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@null"
                android:src="@android:drawable/ic_media_play" />

            <SeekBar
                android:id="@+id/overlay_seekbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />
        </LinearLayout>

        <TextView
            android:id="@+id/overlay_text"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_below="@+id/overlay_firstrow"
            android:text="filename" />
    </RelativeLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1" />

</LinearLayout>