Question

Basically, I am using a popular tactic to center a background image for a LinearLayout by wrapping it in a FrameLayout and adding an ImageView that uses fill_parent before the LinearLayout. However, when I add a ScrollView in the game, everything changes.

The issues is that the image is quite large vertically and the ScrollView respects the height of both the ImageView and the LinearLayout due to the wrap_content height attribute. This causes an undesired blank space below the LinearLayout when the image is vertically larger than it.

How do I make the FrameLayout‘s height stretch only to the child LinearLayout’s height? If possible, without mangling with its sizes programmatically on run-time/draw-time.

<ScrollView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fillViewport="true" >

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

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scaleType="center"
            android:src="@drawable/cash_bg" />

        <LinearLayout
            android:id="@+id/main_ll"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="vertical" >

            <!-- My main views are here -->

        </LinearLayout>
    </FrameLayout>
</ScrollView>

Answer 1

I had the same problem and gone nuts searching for an answer. I think this is an Android bug. What I have done is to include the FrameLayout into a LinearLayout to be able to force “fill_parent” on FrameLayout’s height, which increases the complexity, but solves the problem. Did not find any other (better) solution.
Try this:

<ScrollView
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:fillViewport="true" >
  <LinearLayout
   android:layout_width="fill_parent"
   android:layout_height="wrap_content">
    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scaleType="center"
            android:src="@drawable/cash_bg" />

        <LinearLayout
            android:id="@+id/main_ll"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="vertical" >

            <!-- My main views are here -->

        </LinearLayout>
    </FrameLayout>
   </LinearLayout>
</ScrollView>