Android bottom button bar & scroll view with dialog theme

Question

I am trying to display an Android activity with:

• a dialog theme;
• a title fixed at the top of the dialog;
• a button bar fixed at the bottom of the dialog;
• a scroll view in the middle.

The layout I have written fulfills these criteria, except that the dialog always fills the full screen (see vertical screenshot at the bottom).

This is my layout:

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

    <TextView android:id="@+id/header"
    android:layout_width="fill_parent" android:layout_height="wrap_content"
    android:layout_marginLeft="10dp" android:layout_marginRight="10dp"
    android:layout_marginTop="10dp" android:layout_marginBottom="10dp"
    android:gravity="center_vertical"
        android:textSize="18dip" android:textColor="#ffffff"
        android:text="Sample Layout" />

    <LinearLayout android:id="@+id/controls" android:orientation="horizontal"
    android:layout_width="fill_parent" android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    style="@android:style/ButtonBar">
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:layout_weight="1" android:text="Yes" />
        <Button android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:layout_weight="1" android:text="No" />
    </LinearLayout>

    <ScrollView android:id="@+id/test" android:layout_below="@id/header"
    android:layout_above="@id/controls"
    android:layout_width="fill_parent" android:layout_height="wrap_content"
    android:layout_marginBottom="5dp" android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp">
        <TextView android:layout_width="fill_parent" android:layout_height="wrap_content"
        android:text="Lorem ipsum dolor sit amet, consectetur
        adipiscing elit. Integer dui odio, convallis vitae suscipit eu,
        tincidunt non mi. Vestibulum faucibus pretium purus vel adipiscing.
        Morbi mattis molestie risus vitae vehicula. [...]" />
    </ScrollView>

</RelativeLayout>

In addition, the activity is styled with @android:style/Theme.Dialog and android:windowNoTitle.

I'm not sure I understand why this layout expands to fill the whole screen. None of the views have a layout height set to fill_parent; the parent layout isn't set to fill_parent either.

Does anyone know if what I want to do is possible, and if yes how to do it?

My current layout in horizontal mode

My current layout in vertical mode

Legroom

Answer 1

I have an Activity that is very similar to yours. I did it some time ago so I don't really remember why I did this and that, but I think I achieve what you're trying to do. Here is my code:

<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/info_root"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_gravity="bottom"
android:background="@color/color2">

<LinearLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@color/color1">

    <TextView
        android:id="@+id/infos_titre"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_margin="12dip"
        android:textSize="20dip"
        android:textColor="@color/color2"
        android:gravity="center"
        android:background="@color/color1">
    </TextView>

</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1">

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:id="@+id/infos_LL"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:gravity="center_vertical">

            <TextView
                android:id="@+id/infos_text"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:textSize="16dip"
                android:padding="4dip"
                android:textColor="@color/color1"
                android:lineSpacingMultiplier="1.1"
                android:autoLink="web">
            </TextView>
        </LinearLayout>
    </ScrollView>
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@color/color1"
    android:paddingTop="6dip">

    <Button
        android:id="@+id/infos_remarquebutton"
        android:text="Faire une remarque"
        android:drawableLeft="@drawable/happy"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:textColor="@color/buttontext_color">
    </Button>
    <Button
        android:id="@+id/infos_partagerbutton"
        android:text="Partager"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/ic_menu_share"
        android:layout_weight="1"
        android:textColor="@color/buttontext_color">
    </Button>
</LinearLayout>

Don't be disturbed by the Frenglish namings...

So, I think the main trick was to put the ScrollView inside a LinearLayout. I also gave a weight of 1 to that LinearLayout (I don't remember why...). Also, the top Layout is a LinearLayout, and not a Relative Layout as in your code, but I don't think it would change anything, although I'm not familiar with RelativeLayouts.

Hope it helps!

Drone

Instead of using a ScrollView inside a LinearLayout, I was able to use a NestedScrollView which allows the usage of a layout_weight parameter. – Eucalyptus

Answer 2

I think Since you gave android:layout_alignParentBottom="true" for Linear Layout the Button moves to bottom and it looks like this..

So better you remove android:layout_alignParentBottom="true" and use android:layout_marginTop="some Values"

Try this please..Thanks..

Nikos

Only removing alighParentBottom doesn't work. The result is that the button bar moves to the top of the dialog (I assume it's because the relative layout doesn't know where to put it). I also tried to set the button bar "below" the scroll view, but then it disappears when the scroll view gets too big. – Legroom

As mentioned did you put android:layout_marginTop="200dip" instead of android:layout_alignParentBottom="true" – Nikos

Yes, replacing layout_alignParentBottom="true" with layout_marginTop="200dip" in the button bar places the bar down 200dip from the top of the dialog (not 200dip from the scroll view, which is what I need). – Legroom