Android ScrollView Doesn't wrap to its child?

Question

I have a problem with my ScrollView. It has an ImageView inside it. The imageView holds an image which is 480 * 3000 px. So It needs to be in a ScrollView so the user will have the ability to scroll down.

The problem is: when I test the application, the ScrollView does not wrap to the image hight. There is a black space under the image which is strange for me.

This is my XML code. I look forward for your opinion

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <ScrollView
    android:id="@+id/scroll_view"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:scrollbars="vertical" >    
        <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/image"
        android:src="@drawable/image01"
        android:scaleType="fitStart" />     
    </ScrollView>
</RelativeLayout>

Update: This is how my image looks like with @ruhalde code. I can't take a screenshoot since it is big and you'll not see the whole picture so I draw it.

Answer 1

Rewrite your layout. Make the ScrollView the outer most element. Take a look at this good tutorial for more information: http://mobiforge.com/designing/story/understanding-user-interface-android-part-1-layouts

Answer 2

Use a LinearLayout instead of RelativeLayout which is deprecated by now. Set fillViewPort=true in your ScrollView XML or programatically if you want with setFillViewPort(true).

Put imageview inside a LinearLayout and that inside ScrollView, your XML should look like this:

LinearLayout ---ScrollView ----LinearLayout ------ImageView

Check out my XML here working good with a 800 x 4000 pixels image, perfectly scrolling vertical:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <ScrollView android:id="@+id/scrollView1"
        android:layout_width="fill_parent" android:layout_height="wrap_content">
        <LinearLayout android:id="@+id/linearLayout1"
            android:layout_width="fill_parent" android:layout_height="fill_parent">
            <ImageView android:id="@+id/mapa" android:layout_height="wrap_content"
                android:layout_width="wrap_content"></ImageView>
        </LinearLayout>
    </ScrollView>

</LinearLayout>

Answer 3

To those who might be interested:

My problem was with the image I'm using, not how I organize my layouts. Thanks.

Answer 4

我相信您应该在布局标签之前使用scrollView标签