Android Layouts - ImageView inside ScrollView - space before Image

Question

I am new to Android and still learning the lingo of how things are done and have a question about layouts.

What I am getting (Extra space at the top, black background):

I would like to have a layout with a top bar, containing some buttons; a middle, which is scrollable; and a bottom bar, which also contains buttons. I've currently only implemented part of the layout, but I have a question on putting an ImageView inside a ScrollView.

Here is my XML for the layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >

<Button
 android:id="@+id/btnPrevious"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="Previous" />

<Button
 android:id="@+id/btnCurrent"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_toRightOf="@+id/btnPrevious"
 android:text="Current" />

<ScrollView
    android:id="@+id/scrollView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/btnCurrent"
    android:fillViewport="true"
    >
    <RelativeLayout
        android:id="@+id/childOfScrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"   

        >
        <com.example.touch.TouchImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="centerInside"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:layout_marginTop="10sp"
            android:contentDescription="none"
            android:background="#000000"
            android:src="@drawable/ic_launcher" 
        />
   </RelativeLayout>

</ScrollView>

<Button
     android:id="@+id/btnExtra"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_below="@+id/scrollView"
     android:text="Extra"
 />

</RelativeLayout>

And I am setting the Image dynamically with a URL, like such:

image = (ImageView) findViewById(R.id.image);
currentButton = (Button) findViewById(R.id.btnCurrent);
currentButton.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
        String address = ImageAddress.getImageAddress(0);
        Bitmap bm = getImageBitmap(address); //
        image.setImageBitmap(bm); // where 
    }
});

// get image bitmap later in my code
private Bitmap getImageBitmap(String url) {
    Bitmap bm = null;
    try {
        URL aURL = new URL(url);
        URLConnection conn = aURL.openConnection();
        conn.connect();
        InputStream is = conn.getInputStream();
        BufferedInputStream bis = new BufferedInputStream(is);
        bm = BitmapFactory.decodeStream(bis);
        bis.close();
        is.close();
   } catch (IOException e) {
       Log.e("Problem", "Error getting bitmap", e);
   }
   return bm;
} 

To summarize quickly, why is it that I am getting all this extra lead space (the black background) at top (and bottom)?

Update

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <Button
     android:id="@+id/btnPrevious"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="Previous" />

    <Button
     android:id="@+id/btnCurrent"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:text="Current" />

</LinearLayout>

<ScrollView
    android:id="@+id/scrollView"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:scrollbars="none"
    >

    <com.example.touch.TouchImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="centerInside"
        android:contentDescription="none"
        android:background="#000000"
        android:src="@drawable/ic_launcher"  />
</ScrollView>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <Button
         android:id="@+id/btnExtra"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="Extra"
     />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="48dp"
        android:text="button2" />
</LinearLayout>
</LinearLayout>

Answer 1

To adjust ImageView bounds to image size include:

android:adjustViewBounds="true"

This will remove the margins created around the image.