Question

I’ve got the following layout file:

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

    <View
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="@color/blue" />


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

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/red" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/yellow" />
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="@color/blue" />

</LinearLayout>

It uses nested weights, and I’m aware of the performance issues.
I want to show this layout in an appwidget, but when I load the appwidget, the message “could not load the widget” appears. I think that’s because of the nested weights (not sure).

When I use a RelativeLayout for the base layout, I have the following:

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

    <View
        android:id="@+id/top"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="@color/blue" />

    <View
        android:id="@+id/bottom"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="@color/blue" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/bottom"
        android:layout_below="@id/top" >

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/red" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/yellow" />
    </LinearLayout>

</RelativeLayout>

When I use this layout, the red and yellow views don’t show, I guess the height stays at 0dp.

How can I achieve my goal?
To be clear: I want to have a view at the top and the bottom, fixed height. Between them I want to have a couple of views of the same height, filling the gap.

---

Edit
So I found out something. When you’ve got two levels of ViewGroups in your layout, the appwidget doesn’t show:

<LinearLayout
    android:id="@+id/middle"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="20dp"
    android:layout_marginTop="20dp"
    android:orientation="vertical" >


</LinearLayout>

<View
    android:id="@+id/top"
    android:layout_width="match_parent"
    android:layout_height="20dp"
    android:layout_alignParentTop="true"
    android:background="@color/teal" />

<View
    android:id="@+id/bottom"
    android:layout_width="match_parent"
    android:layout_height="20dp"
    android:layout_alignParentBottom="true"
    android:background="@color/teal" />

This works, but this doesnt:

<LinearLayout
    android:id="@+id/middle"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="20dp"
    android:layout_marginTop="20dp"
    android:orientation="vertical" >

    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/red" />
</LinearLayout>

<View
    android:id="@+id/top"
    android:layout_width="match_parent"
    android:layout_height="20dp"
    android:layout_alignParentTop="true"
    android:background="@color/teal" />

<View
    android:id="@+id/bottom"
    android:layout_width="match_parent"
    android:layout_height="20dp"
    android:layout_alignParentBottom="true"
    android:background="@color/teal" />

Does anyone know why this happens and how to implement my idea? Christopher’s image shows my idea.

Answer 1

If I understand your request correctly, this is the layout you are trying to achieve.

I have altered your xml code to create this layout. Here it is:

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

    <LinearLayout
        android:id="@+id/middle"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="20dp"
        android:layout_marginTop="20dp"
        android:orientation="vertical" >

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/red" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/white" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/red" />

        <View
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:background="@color/white" />
    </LinearLayout>

    <View
        android:id="@+id/top"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:layout_alignParentTop="true"
        android:background="@color/teal" />

    <View
        android:id="@+id/bottom"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:layout_alignParentBottom="true"
        android:background="@color/teal" />

</RelativeLayout>

All of the views placed in ‘middle’ will have uniform height if their weights are all set to 1.